ClaudeとShopify MCPの設定手順とAIで作るランディングページ

30時間以上・何百万トークンも試して、結果が良くなるから止められなくなった。ClaudeをShopifyにつなぐのは「商品一覧見せて」みたいな質問のためじゃない。それは床であって天井じゃない。

Claudeはビジネス全体を横断して読み書きする中央オペレーターになる。商品、注文、顧客、ページ、テーマ、さらに接続した全てのAPIまで。ページデザイナーやフロント担当を置き換える方向に進んでいる。

このガイドでは、特に検証した「セットアップ」と「Claudeから直接、通販ページを作る」部分に絞る。ただしAPI連携とデータ横断の可能性は無限で、別記事級だ。

管理画面を開かずにデータを引くのは分かりやすいが退屈。本当に面白いのは、数分でランディングや商品ページを作り、複数データ（問い合わせ・レビュー・コメント等）を突き合わせて広告やページに落とし込めることだ。

毎日の自動レポート、画像生成と文章の同時制作、物流や原価を入れた売上予測、全商品の検索対策の監査と修正、注文速度に基づく在庫予測、実際の質問からのよくある質問生成、比較表つきのセット提案もできる。

今のままだとClaudeは店の情報を推測するだけ。ここで安全な接続を作り、商品・在庫・注文・顧客を見て、説明文やページを更新し、テーマまで編集できるようにする。

必要なのは2つ。MCPの接続機能が商品・注文・顧客・ページを裏で扱い、Shopify用の開発ツールがセクションやテンプレートなどテーマファイルを作成・プレビュー・公開する。自分で触るというより、Claudeが裏で使う。

手順は、Node.jsとClaude CodeとShopify用の開発ツールを入れ、Shopify側で専用アプリを作って権限（読み取り/書き込み）を選び、IDと秘密鍵とドメインを控える。プロジェクトフォルダに設定ファイルを書いて、そこからClaudeを起動する。

接続テストで商品と注文が実データで返れば成功。次にCLAUDE.mdとブランド資料フォルダで、色・口調・ルールを教える。さらにLiquidのスキルを入れると、編集可能なセクション設計やアクセシビリティなどの品質が一気に上がる。

ページ制作はコツがある。「コンバージョン最適化して」みたいな雑な依頼は最悪。必ず参考を渡す。まずはリスティクルが簡単。複雑な商品ページは、詳細分析→記述→生成、またはセクションごとにスクショ/動画で複製するのが一番安定する。微調整は会話で一瞬だ。