会社員が0からAIで副業に挑戦する記録

Claude CodeでWordPressブログを作る方法|テーマ作りから下書きまで6つの手順【初心者向け】

sebu

WordPress でブログやホームページを作れるようになりたい。でも、プログラムは書けない…。

このブログ「sebu の副業記録」は、Claude Code に作ってもらいました。私はプログラムを1行も書いていません。この記事では、Claude Code で WordPress のブログを作る方法を、実際の手順どおりにまとめます。

この記事でわかること

  • パソコンの中に練習用の WordPress を作る方法
  • 見本のブログに近いデザイン(テーマ)を Claude に作ってもらう頼み方
  • Claude が記事の下書きを作れるようにする設定

Claude CodeでWordPressブログを作る全体の流れ

Claude Code でブログを作る6つの手順
6つの手順で、デザインから記事の下書きまで

手順1:練習用のサイトをパソコンの中に作る

いきなりインターネットに公開するサイトを作るのは不安なので、まずは Local(パソコンの中に WordPress を作れるアプリ)で練習用のサイトを作りました。パソコンの中だけのサイトなので、何を試してもインターネットには出ません。

ポイント

インターネットに公開するには、サーバー(サイトを置く場所)とドメイン(サイトの住所)の契約が必要で、費用がかかります。まずは Local で形を作ってから考えるのがおすすめです。

手順2〜3:見本を決めて、テーマを作ってもらう

テーマは、WordPress のデザイン一式のことです。自分で作るのは大変ですが、見本のサイトの URL を渡すと、Claude が近い構成で作ってくれます。私は、見やすいと思ったブログ(makusan.ne.jp)を見本にしました。

ブログは、https://makusan.ne.jp/ を見本にして、デザインをテーマに入れ込み、
毎日のまとめを、その中の記事の1つとして作ってほしい。

できあがったテーマの中身はこうなっています。

テーマの中身
全部 Claude が書いたファイル

注意

まねるのは「並び方(構成)」だけにしました。見本サイトのロゴ・画像・文章・色はそのまま使わず、自分の色(紺・クリーム・黄)で作ってもらっています。

手順4:記事の部品と「作成の手引き」を作る

記事ごとに見た目がバラバラにならないよう、有名なブログでよく使われる部品をそろえてもらいました。

  • 自動で作られる目次(長いときは「もっと見る」でたたむ)
  • ポイント・注意・メモの囲み
  • sebu と Claude の吹き出し
  • 番号つきの手順・チェックリスト
  • プロンプトの黒い枠・マーカー
  • シェアボタン・「この記事を書いた人」

さらに、どの部品をどこで使うかを「作成の手引き」として Claude 用のルールファイルに書いてもらいました。これで、Claude が記事を作るたびに同じ形になります。

ブログを充実させたい。有名なブログ・見やすいブログを参考にしたデザインを採用し、
統一感を持って作成すること。

手順5:Claude が下書きを作れるようにつなぐ

Claude が WordPress に記事の下書きを作るには、アプリケーションパスワード(外のプログラムが WordPress を使うための専用のパスワード)を使います。

  1. アプリケーションパスワードを作るWordPress の管理画面で「ユーザー」→「プロフィール」を開き、「アプリケーションパスワード」で新しく作ります。
  2. 安全な場所に保存する私は Mac のキーチェーン(パスワードを守って保存する仕組み)に保存しました。パスワードの中身は、ブログにも Claude との会話にも出しません。
  3. 下書きを作るプログラムを作ってもらうClaude に、キーチェーンからパスワードを読んで、下書きを作るプログラムを作ってもらいました。

注意

アプリケーションパスワードは、ふつうのパスワードと同じくらい大事なものです。人に見せたり、ファイルにそのまま書いたりしないでください。

手順6:記事を作って、自分で公開する

記事は、Claude が「本文・図・アイキャッチ(記事の一番上の画像)・カテゴリー・抜粋」までそろえて、下書きで作ります。公開ボタンは、中身を見てから自分で押します。

図は、ブログと同じ色・文字で Claude が作っています。この記事の図も、そうやって作りました。

私がつまずいた所

つまずいた所と直し方

  • 画像のアップロードでエラー → ファイル名の書き方を変えて解決(Claude が直してくれた)
  • 日本語のタイトルのままだと URL が長くなる → URL の最後を英語や日付にした
  • WordPress の画像にはゴミ箱がない → 消すと戻せないので、使わない画像はそのまま残している
  • 大きな見出しが中央に来ない → デザインの設定(CSS)の書き方を Claude が直した

まとめ

  • まずは Local で、パソコンの中に練習用のサイトを作る
  • 見本の URL を渡すと、Claude が近い構成のテーマを作ってくれる(まねるのは構成だけ)
  • 部品と「作成の手引き」を決めると、記事の見た目がそろう
  • 下書きまでは Claude、公開は自分

Claude Code の始め方は「【初心者向け】Claude Codeの使い方|インストールから初期設定まで」で紹介しています。

sebu

この記事を書いた人

sebu

設備保守の仕事をしている会社員。
0からAI(Claude)を使った副業に挑戦中。
やったこと・使ったプロンプト・つまずいた所を、
そのまま記録しています。

前の記事
次の記事
▲TOP