• データ入力
  • 在庫管理
  • 人間
  • 人間

Framer Connectorを使ってAIでCMSアイテムを更新する方法

AIをFramerに接続すれば、チャットだけでコレクションの管理が可能になります。連携後は、エージェントがデータ入力やコレクションの検索を代行します。

このページについてAIに聞く

すぐに答え

AIを使ってFramer CMSを更新できますか？

はい。AIクライアントを使用して、コレクションの一覧表示、アイテムの閲覧、新しいエントリーの作成が可能です。デザインキャンバスを開かずにサイトのコンテンツを充実させることができます。

実現できること

AIが担当する範囲

AIはFramerサイトのデータレイヤーを管理します。

データ入力

新しいCMSエントリー

エージェントがコレクションに新しい行を作成します。チャットでの入力内容を、Framerで設定した各フィールドに適切に割り当てます。

在庫管理

コレクションの閲覧

AIが既存のコレクションやアイテムを検索します。特定のレコードを探し出し、現在のステータスを確認することも可能です。

人間

デザインとレイアウト

AIはキャンバス上の要素を移動したり、視覚的なスタイルを変更したりすることはできません。デザイン作業は引き続きFramerで行ってください。

人間

フィールドのマッピング

どのテキストや画像がどのフィールドに入るかをAIに認識させる必要があります。AIは、あなたが構築した既存の構造に従って動作します。

ワークフロー

データが届いたときのAIの動き

AIはチャットインターフェースとFramerデータベースの架け橋となります。

  1. コレクションの検索

    エージェントがプロジェクト内の利用可能なすべてのCMSコレクションを特定し、データをどこに送るべきかを判断します。

    list_collections

  2. 既存アイテムの確認

    現在のアイテムをスキャンして、重複を防いだり、参照したい特定のレコードを見つけたりします。

    list_collection_items

  3. 新しいコンテンツの追加

    AIが指示を受け取り、選択したコレクションに新しいエントリーを書き込みます。

    create_collection_item

  4. エントリーの検証

    エージェントはコレクションを再確認し、新しいアイテムが正常に追加されたことを確認できます。

    list_collection_items

試してみる

以下のプロンプトをコピーして開始しましょう。

これらのプロンプトを使用して、Framerのツールを起動できます。

出発点

括弧内のテキストは、実際のコレクション名や具体的なコンテンツの詳細に書き換えてください。

Framer Connector

準備完了です。MCPクライアントを選択し、セットアップ手順に従ってください。

コネクタリンクhttps://edge.vinkius.com/vk_preview_XocPRHUqmexgPHRudnuYlV7Bh5mp6EvuOwQLlneR/mcp

Claude Desktop

以下の手順で数秒で接続できます。

  1. 1In Claude Desktop, open Settings → Connectors.
  2. 2Click “Add custom connector” and paste the connector link above as the remote MCP server URL.
  3. 3Click Add and start a new chat — Framer capabilities are ready to use.
設定 · claude_desktop_config.jsonコピー
{
  "mcpServers": {
    "framer-mcp": {
      "url": "https://edge.vinkius.com/vk_preview_XocPRHUqmexgPHRudnuYlV7Bh5mp6EvuOwQLlneR/mcp"
    }
  }
}
チャットにコピー04

  • 利用可能なFramerのコレクションをすべてリストアップしてください。

  • 「Blog Posts」コレクションにある現在のアイテムを表示してください。

  • 「Team Members」コレクションに、名前が「Alex」で役割が「Designer」の新しいアイテムを作成してください。

  • 「Products」コレクションを確認して、「Solar Charger」という名前のアイテムが既に存在するか調べてください。

  • Claude
  • ChatGPT
  • Cursor
  • VS Code
  • Windsurf
  • Claude Code
  • JetBrains
  • Cline

ここから始める

一度接続すれば、あとは指示するだけ。

Vinkiusのダッシュボードからアカウントを連携するだけです。認証情報は暗号化されて保持されるため、すぐに、お使いのクライアントからFramerのデータと対話を開始できます。

FramerをAIに接続する

FAQ

機能の詳細

  • 01

    AIはFramer CMSのアイテムを削除できますか？

    いいえ。現在のツールでは、アイテムのリスト表示と作成のみが可能です。既存のアイテムの削除や更新はサポートされていません。

  • 02

    AIはウェブサイトの色やフォントを変更できますか？

    いいえ。AIはCMSデータのみを操作します。デザインキャンバスや視覚的なスタイルにアクセスしたり、変更したりすることはできません。

  • 03

    Framerのタブを開いたままにしておく必要がありますか？

    いいえ。接続が有効になれば、AIクライアントを通じて完全にコレクションを管理できます。

  • 04

    AIはどのフィールドに情報を入力すべきか、どうやって判断するのですか？

    AIは、あなたがFramerですでに定義しているコレクションの構造を使用します。どの情報をどのフィールドに入れるかを指示するだけで大丈夫です。

  • 05

    AI経由で画像をアップロードすることはできますか？

    いいえ。現在のツールは、コレクションへのテキストベースまたは構造化されたデータのエントリー作成に限定されています。

  • Framerについて他に質問がありますか？ Connectorのページで回答しています。 Framer Connectorの全機能を見る

『Framer』を Claude、Cursor、ChatGPT などに接続