Claudeのプロジェクト機能で、WordPress運用が劇的に変わる
ブロックエディタの面倒な作業を丸ごとClaudeに任せる、知られていない活用法
先日、受講生のAさんから、こんな連絡がありました。
「Claude Web Master講座を受けて、本当に綺麗なサイトが作れるようになりました。知人に宣伝したら……まさかのWordPressリニューアルを頼まれてしまいました（笑）」
Claude Web Master講座は、Claude CodeとCloudflare Pagesを使って、自分だけのWebサイトを構築・公開する講座です。しかも、高速表示、セキュア、無料です。
AさんはHTMLやCSSの基礎からインターネットの仕組みまで、しっかり身につけて、本当に美しいサイトを作り上げていました。
でも、依頼されたのはWordPressのリニューアル。
「がっくし…でも、チャレンジします！」
そのガッツは素晴らしい。でも、Aさんの続きの報告を聞いて、私は「もったいないなあ」と感じてしまいました。
Aさんの「もったいない」Claude活用法
Aさんはどうやってこの仕事を進めたか、教えてくれました。
XServerでのWordPressインストールはボタンひとつで完了
その後の初期設定や、クライアント指定テーマの設定方法はClaudeに質問した
構成を決めたり、ページの内容を考えるのにも、Claudeと話した
あとは、自力で頑張った
これは、かなり「もったいない」使い方です。
「Claudeに聞きながら作業する」は、確かに便利です。Google検索に頼っていた頃に比べたら10倍以上効率良くなりました。でも、Claudeにできることは「回答する」だけではありません。
Claudeは、WordPressのコンテンツとデザインを、同時に作ってくれます。つまり、コピーライター&デザイナーをしてくれます。
WordPressの「本当の大変さ」はどこか？
WordPressを触ったことがある方は、おわかりかもしれません。現在のWordPressの標準エディタは「ブロックエディタ（Gutenberg）」と呼ばれるもので、これが曲者です。
たとえば、「3列で、商品の特徴を並べたい」という、よくあるレイアウトを作ろうとすると、こんな手順が必要です。
グループブロックを挿入する
その中にカラムブロックを入れる
列数を3に設定する
各カラムの中に、アイコン・見出し・テキストをそれぞれ追加する
各ブロックのスタイルや余白を調整する
文章で書くと短く見えますが、実際には無数のクリックと、細かい設定の繰り返しです。しかも、ブロックエディタには独自の概念と操作があり、使いこなせるようになるまでに時間がかかります。WordPressブロックエディター職人を目指す必要があります。
これが、WordPressを「面倒」と感じさせる大きな理由のひとつです。
Claudeのプロジェクト機能を使うと、何が変わるか
実は、Claudeのプロジェクト機能を使うと、このブロックエディタの作業をClaudeに任せることができます。
Claudeが一人三役をしてくれます。
デザイナー: コンテンツをどう見せると良いか？を考える
コピーライター : レイアウトに収まるように、文章を考え調整する
WordPress職人 : 複雑なブロックエディターを駆使して、ページを作り上げる
具体的には、WordPressのブロックエディタに「そのまま貼り付けられる特殊なHTML」を、Claudeが生成してくれます。コンテンツ（文章・見出し・リスト）とデザイン（レイアウト・スタイル）を、同時に出力してくれるのです。
具体的な操作手順
では、実際にどうやって使うのか、順を追って説明します。
ステップ1：プロジェクトを作成する
Claude.aiの左メニューから「プロジェクト」を選び、新しいプロジェクトを作成します。名前と説明を入れます（これは、性能には影響しません）。
ステップ2：ナレッジにテーマファイルを追加する
プロジェクトの設定から「ナレッジ」を開き、使用しているWordPressテーマのファイルを追加します。
テーマのフォルダ構成も重要な情報なので、Githubというサービスと連携させて、テーマデータを取り込みます。ほとんどのテーマはオープンソースとして公開されているので、大抵はGithubに公開されており、取り込むのは簡単です。
なお、ナレッジには、テーマファイルのほかに、サイトの目的・ターゲット・ブランドトーンなどの情報も入れておくと、コンテンツの質がさらに上がります。
※ Project機能の仕組み、使い方を理解すると、この説明自体は難しくないと感じるはずです。ポイントは、「必要な知識を与えている」ということだけです
ステップ3：WordPressの用語を使ってプロジェクト指示を書く
会話を始める際は、WordPressの用語を使って指示するのがポイントです。たとえば、こんな感じです。
## あなたのタスク
ユーザーの要求によって、
1. ページのコンテンツを考え
2. レイアウトを考え
3. WordPressのブロックエディタ専用のHTMLコードを出力
## 注意点
- WordPressの標準テーマである「twenty twenty four」の pattern や、利用できるブロック、要素を使うこと。
- プロジェクトのナレッジ（ドキュメント）に、テーマファイル群がある。この中のコードを参考にして、HTMLコードを生成することステップ4 : ページ生成の指示をする
準備が完了しました。このプロジェクト内で、実際に作業をします。新しいチャットで、以下のような指示をします。
ランディングページを作ってください。
ランディングページの目的は、「非エンジニアのためのClaude Code開発ワークショップ（1day）を募集すること」です。
内容は以下のとおりです。日程、場所などは架空のもので埋めてください。
- 非エンジニア向け
- Claude Codeのインストールから、実際に動いて、公開できるものを作る
- 具体的には、Cloudflare でDB連携するアプリを生成して、デプロイ（公開）までを行う
- 作業を行いながら、どんな仕組みか、イメージを解説する
- イメージがわかることで、どんな知識を今後学べば良いか？がわかるようになる
- 随時質問を受け付けながら、楽しく、じっくり進めていく
デザインは、シンプルかつ美しく、セクションとカラムを効果的に使ったものにしてください。
Claudeはこの指示を理解し、ブロックエディタ対応のHTMLを生成します。
ステップ4：生成されたHTMLをWordPressに貼り付ける
WordPressのエディタ右上にあるメニューから「コードエディター」を開き、生成されたHTMLをそのまま貼り付けます。
ビジュアルエディターに戻すと、レイアウトが反映されています。
ステップ5：微調整する
「復元する」ボタンが表示された場合はクリックして内容を確認し、必要であれば微調整します。画像などは、セットできませんので、ご自身で設定をします。
以下のようなものが、完成します。
完璧な出力にするには、ナレッジの充実や指示の工夫が必要な場面もありますが、それでもゼロから手作業で組む場合と比べて、圧倒的に効率が変わります。
どういう仕組みなのか？
まず２つの視点から説明します。
① ClaudeはWordPressの仕様を知っている
WordPressはオープンソースのソフトウェアです。ブロックエディタのルールや、対応するHTMLの書き方は、世界中に公開されています。Claudeはその情報を学習しているため、「ブロックエディタが理解できるHTML」を正確に生成できます。
② プロジェクト機能で、テーマ固有の情報を読み込める
WordPressサイトの見た目は「テーマ」によって決まります。テーマが異なれば、使えるクラス名やスタイルも変わります。Claudeのプロジェクト機能を使うと、そのテーマファイルをナレッジとして登録できるため、そのサイト専用のデザインに合ったHTMLを生成できるようになります。
Claudeは、テーマファイルのコードを読み取って「どんな装飾が可能で、どう使えば良いか？」を理解して、出力できる能力があります。驚くかもしれませんが、これぐらいのことができないと、Claude Code でシステムを組み上げることはできません。
RAGについて
ちなみに、Claudeのプロジェクト機能のナレッジは、「RAG（Retrieval-Augmented Generation）」と呼ばれる仕組みで動いています。
難しい名前ですが、考え方はシンプルです。
「必要なときに、必要な資料を取り出して読んでから、回答を作る」
Claudeはタスクに応じて、登録されたナレッジの中から関連する情報を引き出し、それを参照しながら回答を生成します。テーマファイルを登録しておくことで、Claudeはそのテーマのルールを理解した上でHTMLを出力してくれます。
さらに、サイトのコンセプトや、これまで書いた記事の情報なども入れておけば、コンテンツの生成精度も上がります。単なる「質問に答えるAI」ではなく、そのサイトの専属ライター兼デザイナー、そしてWordPress職人として機能します。
まとめ：まず「小さな業務改善」から始めること
最近、「Claude Codeで業務を自動化しよう」という話が流行っています。Claude Codeは確かに強力なツールですが、基礎知識や経験がないまま始めると、ハードルが高いのも事実です。
残念ながら、そういった流行を利用したビジネスも出てきています。
ある話では、3年契約・総額300万円（月10万円×36ヶ月）というAI導入サービスがあるそうです。一昔前のWebサイト制作の請負契約と、構造がそっくりです。華やかな未来を描いてみせて、解約のしにくいリース契約を結ばせる。
そういったサービスが「絶対に不要」とは言いません。でも、自分がAIで何ができるかを知らないまま、高額な契約を結ぶのは危険です。
まずは今日紹介したような、すぐに試せる小さな業務改善から始めてください。
自分で手を動かし、「Claudeってここまでできるんだ」という経験を積み重ねることが、何より大切です。その経験があれば、将来エンジニアに外注する場面が来たとしても、意図と違うものを作られたり、過剰な契約をさせられるリスクをぐっと下げられます。
Claudeの対話力と、多彩な機能を使いこなす「Claude上級者」になること。
それが今、いちばんやるべきことだと、私は確信しています。
ところで、あなたは、WordPressを使っていますか？
私は、WordPressを卒業しています。Claude Code を使えば、WordPressの面倒な操作や、セキュリティ問題、ある日突然、エラーでサイトが閉鎖などの頭痛の種から解放されます。
Claude Code を自分専属のエンジニア、デザイナーにして「Static Site Generator」と呼ばれるツールを使えば、無料、高速、安全、簡単、美しくサイトを作って運用できます。
もし、興味があれば、今後、取り上げます。
あなたの感想、質問など、お気軽にどうぞ！
いつも有益な情報をありがとうございます‼️