Communityライティング&編集github.com

webflow/webflow-skills

Webflow CMSアイテムを一括作成・更新し、バリデーションと差分プレビューを提供します。複数のブログ記事や商品を追加したり、多数のアイテムのフィールドを更新する際に使用します。

webflow-skills とは?

このスキルは、Webflow CMSコレクション内のアイテムを一括で作成・更新するための包括的なツールです。開発者やコンテンツ管理者は、複数のブログ記事や商品情報を一度に追加・編集でき、スキーマに基づく自動バリデーション、フィールドごとの差分表示、きめ細かな承認プロセスを利用できます。スキルは、Webflow MCPツールセットと連携して動作し、サイトの一覧取得、コレクションの選択、スキーマの取得、そしてアイテムの作成・更新・公開をすべてMCP経由で実行します。処理前にはプレビューで変更内容を確認し、アイテム単位で承認を選択可能。エラーが発生しても処理を中断せず、成功・失敗を個別に追跡し、最後にはロールバック機能も提供します。これにより、大量のCMSアイテムを安全かつ効率的に管理できます。

対応~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/webflow/webflow-skills/tree/HEAD/plugins/webflow-skills/skills/bulk-cms-update

Installed? Explore more ライティング&編集 skills: steipete/notion, langchain-ai/langchain, bytedance/podcast-generation · View all 6 →

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

一括CMS更新

複数のCMSアイテムを作成・更新し、包括的なバリデーション、きめ細かな承認、ロールバック機能を提供します。

重要な注意点

常にWebflow MCPツールを使用してください:

  • Webflow MCPの data_sites_tool(アクション list_sites)を使用して利用可能なサイトを一覧表示する
  • Webflow MCPの data_cms_tool(アクション get_collection_list)を使用してCMSコレクションを一覧表示する
  • Webflow MCPの data_cms_tool(アクション get_collection_details)を使用してコレクションスキーマを取得する
  • Webflow MCPの data_cms_tool(アクション list_collection_items)を使用して既存のアイテムを取得する
  • Webflow MCPの data_cms_tool(アクション create_collection_items)を使用してアイテムを作成する(下書きまたは公開)
  • Webflow MCPの data_cms_tool(アクション update_collection_items)を使用してアイテムを更新する(下書きまたは公開)
  • Webflow MCPの data_cms_tool(アクション publish_collection_items)を使用して下書きアイテムを公開する
  • Webflow MCPの webflow_guide_tool を使用して開始前にベストプラクティスを確認する
  • Webflow操作には他のツールやメソッドを使用しないでください
  • すべてのツール呼び出しには必須の context パラメータを含める必要があります(15~25語、三人称視点)

手順

フェーズ1:サイトとコレクションの選択

  1. サイトを取得する:対象サイトを特定します。ユーザーがサイトIDを提供しない場合は、それを尋ねます。
  2. コレクションを一覧表示する:Webflow MCPの data_cms_tool(アクション get_collection_list)を使用して、利用可能なコレクションを表示します。
  3. ユーザーにコレクションを選択してもらう:ユーザーが操作するコレクションを指定します。
  4. コレクションスキーマを取得する:Webflow MCPの data_cms_tool(アクション get_collection_details)を使用して以下を取得します。
    • すべてのフィールド定義(タイプ付き)
    • 必須フィールドと任意フィールド
    • フィールドバリデーション(最大長、パターンなど)
    • 参照フィールドのターゲット

フェーズ2:データ収集と解析

  1. 操作タイプを尋ねる:ユーザーが何をしたいか明確にします。

    • 新しいアイテムのみを作成
    • 既存のアイテムのみを更新
    • 作成と更新の両方
  2. ユーザーからデータを受け取る:柔軟な形式でデータを受け入れます。

    • 構造化形式(JSON形式)
    • 自然言語による説明
    • CSV形式のデータ
    • 箇条書きリスト
  3. 解析して正規化する:ユーザーデータを構造化形式に変換します。

  4. 既存のアイテムを取得する(更新がある場合):Webflow MCPの data_cms_tool(アクション list_collection_items)を使用して現在のデータを取得します。

    重要 - 効率的なアイテム検索:

    • 特定のアイテムを名前で検索する場合は、常に name パラメータを使用してフィルタリングします(例:name: "Pikachu")
    • スラッグで検索する場合は、slug パラメータを使用してフィルタリングします
    • すべてのアイテムを最初に取得してから結果を検索しないでください。これはAPIコールとトークンの無駄です
    • すべてのアイテムを表示する必要がある場合、または対象のアイテムが不明な場合にのみ、フィルタリングなしのリストを取得します

フェーズ3:バリデーションと分析

  1. すべてのデータを検証する:
    • フィールド名: すべてのフィールド名がスキーマに存在するか確認する
    • 必須フィールド: すべての必須フィールドが提供されているか確認する
    • フィールドタイプ: データ型がスキーマと一致するか検証する
    • 制約: 最大長、パターン、許容値を確認する
    • スラッグ: スラッグが一意で有効であることを確認する
    • 参照フィールド: 参照されるアイテムが存在するか確認する
  2. 競合を検出する:
    • 重複スラッグ(バッチ内または既存アイテムとの間)
    • 必須フィールドの欠落
    • 無効なデータ型
    • 制約違反
  3. 影響を分析する:
    • 作成数と更新数をカウントする
    • どのフィールドが変更されるかを特定する
    • バッチサイズと処理時間を計算する

フェーズ4:プレビューときめ細かな承認

  1. 詳細なプレビューを生成する:
    • 各アイテムをバリデーションステータスとともに表示する
    • 問題がある場合は警告を表示する
    • 更新の場合は差分(旧 → 新)を表示する
    • 作成の場合はすべてのフィールド値を表示する
    • 選択的な承認のために各アイテムに番号を付ける
  2. きめ細かな承認オプションを提示する:
    • ユーザーが処理する特定のアイテムを選択できるようにする
    • オプション:「すべて」「なし」、特定の番号、番号範囲
    • 推定処理時間を表示する
  3. 公開オプションを提供する:
    • すぐに公開(*_live エンドポイントを使用)
    • 下書きとして作成(通常のエンドポイントと手動公開を使用)

フェーズ5:実行とレポート

  1. ロールバックデータを保存する: 変更前に以下を保存:
    • 更新されるすべてのアイテムの元の値
    • タイムスタンプ
    • 操作の詳細
  2. バッチで処理する:
    • 1バッチあたり最大50アイテム
    • 進行状況インジケータを表示する
    • レート制限を適切に処理する
  3. 操作を実行する: ユーザーの選択に基づいて適切なWebflow MCPツールを使用する
  4. エラーを適切に処理する:
    • 単一アイテムの失敗でも処理を続行する
    • 成功と失敗を個別に追跡する
    • 詳細なエラーメッセージを提供する
  5. 包括的なレポートを生成する:
    • 概要(成功/失敗の数)
    • アイテムごとの詳細結果
    • 作成/更新されたアイテムのID
    • 失敗したアイテムのエラー詳細
  6. ロールバックオプションを提供する: 必要に応じてユーザーが変更を元に戻せるようにする

例

ユーザープロンプト:

Webflow MCPに関する2つのブログ記事を追加し、最初のブログのタイトルを「Best」から「Top」に更新してください。

ステップ1:サイトとコレクションの選択

📋 一括CMS更新のセットアップ

利用可能なサイト:
1. MCP Demo#1
2. MCP Demo#2
3. MCP Demo#3

サイトを選択してください(1-3):

ユーザーが選択: 1

MCP Demo#1 の利用可能なコレクション:
└── ブログ記事(9アイテム)
    フィールド: name, slug, post-body, post-summary, main-image, thumbnail-image, featured, color

ブログ記事コレクションを進めますか?(yes/no)

ユーザーが確認: yes

ステップ2:データ収集

🔍 コレクションスキーマ: ブログ記事

必須フィールド:
- name(プレーンテキスト、最大256文字)
- slug(プレーンテキスト、最大256文字、英数字のみ)

任意フィールド:
- post-body(リッチテキスト)
- post-summary(プレーンテキスト)
- main-image(画像)
- thumbnail-image(画像)
- featured(スイッチ、true/false)
- color(カラー、16進数形式)

リクエストを解析します:
- Webflow MCPに関する新しい記事を2つ作成
- 最初の記事を更新: 「Best」→「Top」

アイテムを生成中...

ステップ3:バリデーションとプレビュー

📋 プレビュー: 一括CMS更新

コレクション: ブログ記事
操作: 2アイテム作成 + 1アイテム更新

---

### 🆕 作成するアイテム(2件)

[1] ✓ 新規投稿
    name: "Webflow MCP: The Future of Web Development"
    slug: "webflow-mcp-future-web-development"
    post-summary: "Discover how Webflow MCP is revolutionizing..."
    post-body: "<h1>The Future is Here</h1><p>..."
    featured: true
    color: "#9B59B6"
    ✅ すべてのバリデーションに合格

[2] ✓ 新規投稿
    name: "Why Webflow MCP Will Transform Your Workflow in 2026"
    slug: "webflow-mcp-transform-workflow-2026"
    post-summary: "Learn how Webflow MCP's integration..."
    post-body: "<h1>Transform Your Workflow</h1><p>..."
    featured: true
    color: "#3498DB"
    ✅ すべてのバリデーションに合格

---

### ✏️ 更新するアイテム(1件)

[3] ✓ 既存アイテム更新
    アイテムID: 69615f84fc6ce1aa444d24d5
    スラッグ: why-webflow-is-best-2026-ai

    変更点:
      name: "Why Webflow is the Best Choice for 2026" → "Why Webflow is the Top Choice for 2026"

    ✅ すべてのバリデーションに合格

---

**概要:**
- ✅ 2アイテムが作成されます
- ✅ 1アイテムが更新されます
- ⚠️ 警告0件
- ❌ エラー0件

**公開オプション:**
1. すぐに公開(推奨)
2. 下書きとして保存

どのアイテムを処理しますか?
- 「all」と入力すると3アイテムすべてを処理
- 番号を入力するとそのアイテムをスキップ(例:「2」でアイテム2をスキップ)
- 「none」と入力するとキャンセル

公開オプションを選択(1/2): _
アイテムを選択: _

ユーザーが選択: 1, all

⚠️ 以下の操作を実行しようとしています:
- 2件の新しいブログ記事を作成(公開)
- 1件の既存ブログ記事を更新(変更を公開)

続行するには「confirm」と入力してください。

ユーザーが確認: confirm

ステップ4:実行と結果

🔄 一括更新を処理中...

アイテムを作成中: ██████████ 100% (2/2)
アイテムを更新中: ██████████ 100% (1/1)

✅ 一括CMS更新が完了しました!

---

### 🆕 作成されたアイテム(2件)

✓ [1] "Webflow MCP: The Future of Web Development"
       ID: 6961640c66de07bed9aacf3e
       スラッグ: webflow-mcp-future-web-development
       公開日時: 2026年1月9日 20:24

✓ [2] "Why Webflow MCP Will Transform Your Workflow in 2026"
       ID: 6961640c66de07bed9aacf41
       スラッグ: webflow-mcp-transform-workflow-2026
       公開日時: 2026年1月9日 20:24

---

### ✏️ 更新されたアイテム(1件)

✓ [3] "Why Webflow is the Top Choice for 2026"
       ID: 69615f84fc6ce1aa444d24d5
       変更点: タイトルが更新されました
       公開日時: 2026年1月9日 20:24

---

**概要:**
- ✅ 2アイテムが正常に作成されました
- ✅ 1アイテムが正常に更新されました
- ❌ 0件の失敗
- ⏱️ 3.2秒で完了

**合計アイテム数:** 11(元は9)

📋 ロールバック可能:
最終更新: 3アイテムが先ほど変更されました
すべての変更を元に戻すには、5分以内に「undo」と入力してください

代替:バリデーション警告あり

📋 プレビュー: 一括CMS更新

[1] ⚠️ 新規投稿
    name: "Test Post"
    slug: "test"
    post-summary: "Hi"
    ⚠️ 警告: post-summaryが短すぎます(20文字未満) - SEOに影響する可能性があります
    ⚠️ 警告: スラッグが汎用的すぎます - より説明的なスラッグを検討してください
    ⚠️ 警告: post-bodyがありません - コンテンツが空になります
    ✅ 必須フィールドあり(処理可能)

[2] ❌ 新規投稿
    name: "Another Post!!!"
    slug: "another post"
    ❌ エラー: スラッグにスペースが含まれています(英数字とハイフンのみ使用可能)
    ❌ エラー: 名前に許可されていない特殊文字が含まれています
    🔴 続行できません - 先にエラーを修正してください

---

**概要:**
- ✅ 1アイテムを作成可能(警告あり)
- ❌ 1アイテムにエラーあり(作成不可)

アイテム2を修正するか、スキップしますか?(fix/skip)

ガイドライン

フェーズ1:重要な要件

サイトとコレクションの選択:

  • 常に data_sites_tool(アクション list_sites)を使用して実際のサイトリストを取得する
  • サイトIDを決して推測しない
  • コレクション名とアイテム数を表示する
  • データを受け入れる前にフィールドスキーマを表示する
  • コレクションの選択をユーザーに確認する

フェーズ2:データ解析

柔軟な入力形式: 複数の形式でデータを受け入れます:

  1. 構造化形式(JSON形式):
CREATE:
- name: "Post Title"
  slug: "post-slug"
  featured: true
  1. 自然言語:
「'Getting Started'というブログ記事をslug 'getting-started'で追加してください」
  1. CSV形式:
name,slug,featured
"Post 1","post-1",true
"Post 2","post-2",false
  1. 箇条書きリスト:
- Post 1: "Title" (slug: title-slug)
- Post 2: "Another" (slug: another-slug)

解析ルール:

  • 形式のバリエーションには寛容に対応する
  • 欠落している任意フィールドは推測する
  • 曖昧な場合は明確化を求める
  • 必須フィールドの値を決して推測しない

効率的なアイテム検索: 更新のために既存のアイテムを取得する場合、フィルタパラメータを使用してAPIコールを最小限に抑えます:

# 良い例 - アイテム名がわかっている場合は名前でフィルタ
 data_cms_tool(action: "list_collection_items", collection_id, name: "Pikachu")

# 良い例 - スラッグがわかっている場合はスラッグでフィルタ
 data_cms_tool(action: "list_collection_items", collection_id, slug: "pikachu")

# 悪い例 - すべてのアイテムを取得してから結果を検索
 data_cms_tool(action: "list_collection_items", collection_id)  # 100アイテムを返す
# その後、結果から手動で「Pikachu」を検索...
  • 特定のアイテムを検索する場合は、常に name または slug パラメータを使用する
  • これにより、APIコール、応答サイズ、トークン使用量が削減されます
  • すべてのアイテムを表示する場合、または対象が不明な場合にのみ、フィルタリングなしのリストを取得する

フェーズ3:バリデーションルール

フィールド名のバリデーション:

  • すべてのフィールド名がスキーマに存在するか確認する
  • 大文字と小文字を区別して一致させる
  • タイプミスの修正を提案する
  • 例:「autor」→「author」のことですか?

必須フィールド:

  • name と slug はWebflow CMSでは常に必須です
  • スキーマからコレクション固有の必須フィールドを確認する
  • 欠落している必須フィールドをすべて明確にリストする
  • 必須フィールドが欠落している場合は続行できません

フィールドタイプのバリデーション:

プレーンテキスト:

  • 最大長制約を確認する
  • 指定されている場合はパターンを検証する
  • HTMLは許可されない

リッチテキスト:

  • 有効なHTMLである必要がある
  • 閉じタグがないか確認する
  • 一般的なHTML要素を許可する

画像/ファイル:

  • ファイルIDまたはURLを受け入れる
  • ファイルが存在することを確認する(可能な場合)
  • 代替テキストは任意

スイッチ(ブール値):

  • 受け入れ: true/false, yes/no, 1/0
  • ブール値に正規化する

カラー:

  • 16進数形式(#RRGGBB)である必要がある
  • 16進文字を検証する
  • 例: #FF5733 ✓, red ✗

参照フィールド:

  • 既存のアイテムIDを参照する必要がある
  • 参照されるアイテムが存在するか検証する
  • わかりやすくするために参照されるアイテム名を表示する

スラッグのバリデーション:

  • 重要: 英数字とハイフンのみ使用可能
  • スペース、アンダースコア、特殊文字は不可
  • 最大256文字
  • 一意である必要がある(既存アイテムとバッチ内で確認)
  • タイトルからスラッグを自動提案する(欠落している場合)
  • 例:
    • ❌ 「My Post!」 → ⚠️ 特殊文字が含まれています
    • ✅ 「my-post」 → 有効

制約バリデーション:

  • 最大長: 制限に近い場合は警告、超えた場合はエラー
  • パターン: スキーマの正規表現パターンをテストする
  • 許容値: 列挙されたオプションと照合する

フェーズ4:プレビューと承認

プレビュー形式:

作成操作の場合:

[1] ✓ 新規投稿
    field1: "value1"
    field2: "value2"
    field3: "value3"
    ✅ すべてのバリデーションに合格

更新操作の場合:

[2] ✓ 既存アイテム更新
    アイテムID: xxx
    スラッグ: existing-slug

    変更点:
      field1: "old value" → "new value"
      field2: (変更なし)
      field3: "old" → "new"

    ✅ すべてのバリデーションに合格

警告のあるアイテムの場合:

[3] ⚠️ 新規投稿
    name: "Title"
    ⚠️ 警告: 任意フィールド「post-body」がありません
    ⚠️ 警告: スラッグが汎用的すぎる可能性があります
    ✅ 続行可能(警告のみ)

エラーのあるアイテムの場合:

[4] ❌ 新規投稿
    name: "Title!!!"
    slug: "bad slug"
    ❌ エラー: スラッグにスペースが含まれています
    ❌ エラー: 名前に特殊文字が含まれています
    🔴 続行できません - エラーを修正する必要があります

きめ細かな承認:

  • 各アイテムに番号を付ける: [1]、[2]、[3]...
  • 選択的な処理を許可する
  • 以下の形式を受け入れる:
    • 「all」 - すべて処理
    • 「none」 - 操作をキャンセル
    • 「1,3,5」 - アイテム1、3、5を処理
    • 「1-5」 - アイテム1から5を処理
    • 「2」 - アイテム2のみスキップ、残りを処理

公開オプション:

  • すぐに公開: *_live エンドポイントを使用(推奨)
  • 下書きモード: 通常の create_collection_items / update_collection_items を使用し、publish_collection_items で個別に公開

Individual skills in this repo

This repo contains 4 individual skills — each has its own dedicated page.

関連スキル