Claude Codeでサイト管理ができないかと思い、GitHub、microCMS、GA4、Search Console、Google Sheetsを接続し、自社サイトの分析、提案、修正、記録までを一元管理できるようにしました。
前提として、弊社のサイトはGitHub＋microCMSのヘッドレスCMSで運用しています（詳しくは「自社サイトをJamstack構築でリニューアルした話」の記事をご覧ください）。この構成自体、もともと更新しやすいもので、日々の運用で大きく困っていたわけではありませんでしたが、GA4やSearch Consoleと連携すれば、さらに捗るのではないかと思い、実践してみました。
今回接続したのは、GitHub MCP、microCMS MCP、Google Analytics Data API、Google Search Console API、Google Sheets MCPです。これによって、コードやCMSの更新だけでなく、数字の確認、改善提案、PR作成、マージ、作業履歴の記録までを、Claude Codeの中でつなげられるようになりました。
BtoB企業のWebサイトは、お問い合わせ獲得のために継続的な改善が必要です。コンテンツマーケティングやSEOも含め、見直したいポイントは常にあります。ただ、分析して終わる、提案して終わるのではなく、実際に修正し、記録して、次の改善につなげられる状態にしておく必要があります。Claude Codeを入れたのは、その流れをどこまで効率化できるか、成果に結びつくかを試したかったからでもあります。
接続したもの
今回、Claude Codeに接続したのは次の5つです。
- GitHub MCP
- microCMS MCP
- Google Analytics Data API
- Google Search Console API
- Google Sheets MCP
この構成にすると、Claude Codeは単にコードを触るツールではなく、数字の確認、改善提案、コードやCMSの更新、Google Sheetsへの記録まで、一連の流れとして担えるようになります。
行った設定
導入時に行ったことを大まかに整理すると、手順はそこまで長くありません。細かい設定画面の説明は省きますが、最低限行ったのは次の内容です。
Claude Codeをインストールする
まず、Claude Codeを使うために環境を整え、Claude Code本体をインストールして、Proプランのアカウントでログインしました。自分の環境ではNode.jsのバージョンが古かったため、その対応が必要でした。Node.jsが入っていない場合は、先にインストールから行う必要があります。
GitHub MCPを接続する
その後、GitHub MCPを接続し、Claude Codeがリポジトリを読める状態にしました。これで、コードの確認、修正、PR作成、マージまで進められる土台ができます。
microCMS MCPを接続する
続いてmicroCMS MCPを接続し、Claude CodeがmicroCMS上のコンテンツを取得・更新できるようにしました。静的フロントエンド側の変更とCMS側の更新を、同じ流れで扱えるようになったのはこの段階です。
Google Analytics Data APIとGoogle Search Console APIを有効化する
さらに、Google Analytics Data APIとGoogle Search Console APIを有効化し、GA4とSearch ConsoleのデータをClaude Codeから参照できるようにしました。今回の連携で、実務上もっとも価値が大きかったのはこの部分でした。更新作業だけなら従来の構成でも十分回りますが、数字を見た上で改善提案まで出せるようになると、Claude Codeを入れる意味がはっきりします。
Google Sheets MCPを接続する
最後にGoogle Sheets MCPを接続し、作業内容をスプレッドシートに記録できるようにしました。何を見て、どこを問題と判断し、どの修正を行ったかを残せるので、改善の履歴管理がしやすくなります。
詳細な設定手順については、公式ドキュメントを確認しつつ、ClaudeなどのAIも併用しながら進めるのがよいと思います。
CLAUDE.mdとSkillsで運用ルールを渡す
Claude Codeを実務で使う上で欠かせないのがCLAUDE.mdとSkillsです。CLAUDE.mdは、Claude Codeがセッション開始時に毎回読む指示ファイルで、プロジェクト全体の前提や運用ルールを書いておけます。設定ファイルというより、毎回読み込まれる共通コンテキストに近いものです。例えば「回答は日本語にする」「PR作成前に確認を取る」「microCMSの更新前に承認を挟む」「作業後はGoogle Sheetsに履歴を残す」といったルールを整理しておくことで、毎回同じ説明を繰り返さずに済みます。ただし、CLAUDE.mdは長く書きすぎず、広く共通するルールだけに絞るのが大事です。
一方、SkillsはClaude Codeの公式機能で、特定の作業手順や知識をSKILL.mdとして切り出して持たせるものです。毎回は使わないものの、特定のタイミングで実行してほしい流れ、例えば「GA4とSearch Consoleを確認して改善案を出し、修正後にPRを作成し、最後にGoogle Sheetsへ記録する」といった一連のプレイブックを切り出しておくのに向いています。CLAUDE.mdを常設ルール、Skillsを用途別の手順書として分けると、運用しやすくなります。
Claude Codeの使い方
弊社サイトでの使い方は、完全自動化ではなく「人が要所要所で判断し、Claude Codeが実行する」という形です。Claude Codeに特定ページやサイト全体を分析させ、GA4とSearch Consoleの数字を確認した上で問題点と改善案を出してもらいます。その内容を確認し、問題がなければ修正指示、PR作成、マージまで進めます。作業完了後、実施内容をGoogle スプレッドシートに記録してもらう、この流れで運用しています。
実際に感じた価値
AIが提案を出すだけなら珍しくありませんが、承認フローを挟んだ上で、そのまま実作業まで進められると、人の作業負担がかなり変わります。ちゃんとマージまで進んだときに、これなら日常の運用にも使えると感じました。
GA4とSearch Consoleを見てもらえるのは、想像以上に実用的でした。例えば、ランディングページを分析してもらった際には「セッションに対してユーザーが少なすぎる」という指摘とその改善点を受けました。自分で気づけていなかった箇所を指摘してもらえるのはとてもありがたいです。GA4とSearch ConsoleをClaude Codeに見せられるようになったことで、改善の出発点を数字ベースで持てるようになりました。
コンテンツ制作について思うこと
一方で、コンテンツ制作までそのままAI任せにするつもりはありません。ここは今回使ってみて、線引きがはっきりした部分でした。
既存コンテンツに対するリライト提案はしてくれますが、ある程度完成されている記事に対して、表層的なリライトだけで大きな成果が出るかというと、そこには限界があります。新規記事についても同じで、AI生成コンテンツは今や誰でも作れる以上、それだけで差別化にはなりませんし、弊社としてもAI生成コンテンツを量産するWebサイトにしたくありません。
現状しっくりきているのは、テーマや方向性は自分で考え、必要な論点も自分で持つ。その上で、Claude Codeには推敲や整理、構成の補助、必要に応じた実装や更新を任せる形です。分析や改善作業の自動化とは相性がよくても、コンテンツの中身そのものを丸ごと委ねるのはリスキーだと感じています。自分で喋って自動文字起こししてもらって推敲してもらう、というのも良さそうです。
実際にこの記事も概要を伝えてAIに初稿を作ってもらい、そこから私自身がかなり手を加えて、最後にまたAIにチェックしてもらう、という流れで制作しました。AI生成だけの文章よりもかなりの時間がかかっていますが、全てを人が書くよりかは効率的に執筆できたと思います。サムネイルはGenspark経由のNano Banana 2で生成しました。これも慣れが必要ですね。
どんな会社に向いているか
この環境は、Webサイトを細々と自分自身で改善したい担当者にかなり向いています。一語一句少しでも気になったら改善したい、コピーを定期的に変えて反応を試したい、ブログではなくサービスページを追加・修正したい、トップページのレイアウトを見直したい。そうした改善を制作会社に都度依頼すると、タイムラグも出ますし、費用もそれなりにかかります。Claude Codeを使った運用であれば、こうした小さな改善にすぐ着手しやすくなります。
運用はできても、環境準備や何かあった時の対応までは難しいと思います。ですので、制作会社がこの環境を整え、クライアント側が日々の更新や改善を進める、何か不具合や難しい改修が出た場合には、制作会社がサポートする。そのような形が今後のWeb制作・Web運用の一つの形になってくるのではないでしょうか。
まとめ
Claude Codeを自社サイト運用に入れてみて感じたのは、これは単なるコーディング支援ツールではなく、分析、提案、実装、記録をつなぐ運用ツールとして使うと強い、ということでした。
GitHubとmicroCMSだけでも更新作業は十分やりやすい構成です。ただ、GA4とSearch ConsoleまでClaude Codeに見せられるようにすると、どこを改善すべきかの判断から、その後の作業までを一気につなげやすくなります。さらにGoogle Sheetsに履歴を残せるようにすると、改善作業が単発で終わらず、運用として積み上がっていきます。
現時点での結論は「判断は人、分析と実行はClaude Code」という役割分担がいちばん実用的だということです。自分でサイトを細かく改善したい担当者がいる会社にはかなり相性のよいやり方だと思います。弊社ではそのサポートが行えますので、詳しく話を聞いてみたい方はぜひ一度ご連絡いただければと思います。
