【実録】非エンジニアがClaude Codeに丸投げで固定ページ4本作った話【所要時間30分】

※将来的にアフィリエイトリンクを追加する予定です。

はじめに
TL;DR(忙しい人向けまとめ)
第1章:なぜ Claude Code に丸投げしたか
第2章:何が起きたか(時系列で)
第3章:アバター1案目で、私は固まった
第4章:スラッグ衝突 — 自動で対処された話
第5章:Application Password を発行・削除した話
第6章:私はその間、何をしていたか — 承認ボタン係の30分
第7章:この経験で考えたこと
つまずきポイント・備忘録
終わりに
1. 次の記事(第4記事)について
2. 続編記事

はじめに

前の記事(WordPress初期設定編)を書き終えて、保存ボタンを押したのが午前中。その記事の最後に「これから絶対にやる宿題」として置いた固定ページ4ページが、数時間後にはもう片付いていました。

何をしたかというと、Claude Code に丸投げした。それだけです。

当初の見積もりは4〜5時間。実際に私が作業した時間は約30分。手応えの薄さと、前進した事実とが、頭の中でうまく噛み合わない一日でした。

この記事は、その30分のあいだに何が起きたか、Claude が何を提案してきて、どこで私が「待った」をかけたか、終わったあと何を考えたかを、できるだけ加工せずに残したものです。

前の記事の第7章(後日談)を、腰を据えて書き直したのがこの記事になります。

このブログ自体が X サーバーのクイックスタートで立ち上がっています。今回の Claude Code による REST API 操作も、その上で動かしました。サーバーから自分で立ち上げる前提なので、これから始める方は1記事目のサーバー契約編が先に役立つと思います。

TL;DR(忙しい人向けまとめ)

項目	内容
当初見積もり	4〜5時間(プラポリ2h・免責1h・プロフィール1h・お問い合わせ+メニュー30min)
実作業時間	約30分(運営者側、ほぼ承認ボタン係)
作成ページ数	4(プロフィール / プライバシーポリシー / 免責事項 / お問い合わせ)
副産物	アバター画像1枚(自動生成 PNG, 512×512)、フッターメニュー1つ、Application Password(WordPress 操作用の使い捨て合鍵)の一時発行と削除
ハマったところ	プラポリのスラッグ衝突(WordPress 初期ドラフトと競合)。Claude が自動で対処
葛藤	「持っていかれた」感。プラポリは自分の言葉で書きたかった気持ち

「AI に丸投げして30分で4ページ」と聞こえはいいけど、内側はもう少し複雑です。

第1章:なぜ Claude Code に丸投げしたか

固定ページ4ページは、アフィリエイト ASP の審査(A8.net、もしもアフィリエイトなど)に進むための前提条件。揃っていないと、ほぼ確実に落ちる。逆に揃っていれば、申請を始められる。

第2記事を書きながら、私はこの4ページの作業を「次の宿題」として並べていました。手元のメモはこんな感じ。

プラポリのテンプレートを探す → 自分のサイト用に書き換える(2時間)
免責事項の雛形をカスタマイズ(1時間)
プロフィールを自分の言葉で書く(1時間)
お問い合わせは、メアド記載で一旦OK(15分)
フッターメニューに登録(15分)

合計4〜5時間。週末を半日潰す覚悟でした。

ところが、第2記事を書き終えた直後、ふと頭をよぎったのが「これ、Claude Code に丸投げできるんじゃないか?」という一点。WordPress には REST API がある、Claude Code はファイル操作も外部 API へのリクエストもできる、自分の手作業より速くなるはず — 理屈の上ではそう。

迷ったのは正直 5分くらいです。「自分の言葉で書く」と申し送りしていたプロフィールについては、AI に下書きをさせていいのか、という引っかかりがありました。プラポリも、法律と関わるところで、自分で調べたい気持ちはあった。

ただ、4〜5時間が30分になる可能性があるなら、まずは試してみたい。書きながら違和感が出たら止めればいい。そう判断して、Claude Code のターミナルに向かいました。

補足:この時点で私の Claude Code は、WordPress を REST API 経由で操作できる状態に事前接続してあります(Application Password を発行して渡してある状態。詳しくは第5章)。Claude Code を入れたばかりだと、まだこの接続はされていません。接続の仕組み自体は、第4記事で詳しく書く予定です。

入力したのは、たったの1行に近い指示です。

「プラポリ・免責事項・プロフィール・お問い合わせの4ページを作って、フッターメニューに登録するところまで一気にやって」

ここから、約30分のドキュメンタリーが始まります。

第2章:何が起きたか(時系列で)

最初に手をつけたのはプロフィール

Claude は4ページのうち、最初にプロフィールから着手しました。「他の3ページ(プラポリ・免責・お問い合わせ)はある程度テンプレ化できますが、プロフィールはこのサイトの個性に直結します。先に方針を決めましょう」というのが理由。

文面の方針として出てきたのは、こんな組み立て:

福岡在住の非エンジニア会社員
パソコン操作はメール・Excel 程度のスタートライン
AI(Claude Code)を相棒に副業ブログを始めた経緯
同じ立場の30代会社員に向けて書いていること
ハンドルは @nonenlab

私が第1・第2記事に書いてきた前提とほぼ一致。「これで進めて」と返しました。

アバター生成の波瀾

プロフィールには顔写真代わりのアバターが要る、ということで、Claude が画像を1枚生成してきました。

これが、率直に言ってうさんくさかった。

帽子をかぶったキャラっぽい絵で、髪と帽子の境目が曖昧で、顔が前にせり出している。「副業ブログの運営者です」と並べるには、どう見ても怪しい。

📷 画像予定:スクショ予定:Claudeが最初に生成した1案目のアバター(却下したやつ)(後日追加します)

Claude が一拍置いて聞いてきました。

「率直に、前作のアバターはどうでしたか?」

私の返事はこう。

「うさんくさい。帽子より顔が前にでてる」

すぐに返ってきたのが、これ。

「確かに変ですね。髪を描いたつもりが帽子に見えて、顔とのバランスが崩れていました。」

そこから Claude は、いきなり画像を作り直すのではなく、5名のペルソナでの会議形式に切り替えました。ファシリテーター・SEOエディター・エンジニア・アフィリエイター・読者代表の5人。

各ペルソナの観点で「副業ブログの運営者として信頼感が出るアバター」を議論したうえで、3案が並びました。

案A:知的ビジネス系。3/4アングル。黒縁メガネ。Vネック。控えめな笑顔。
案B:フレンドリー系。正面。メガネなし。
案C:落ち着き大人系。3/4アングル。ラウンドメガネ。無精ヒゲ。タートルネック。

私は案Aを選びました。理由は、自分のサイトで扱う「Claude Code × 非エンジニア × 副業」という温度感に一番近かったから。フレンドリーすぎるとブログの内容と合わないし、大人すぎても近寄りがたい。中間が欲しかった。

このアバター事件、後で振り返ると、この記事の核にあたる場面だったと思います。詳しくは第3章で。

プロフィールページ作成

採用したアバター画像を、WordPress のメディアライブラリにアップロード。プロフィール本文の中に、サイズ 320px・中央寄せで埋め込み(アイキャッチではなく本文中に置きました)。

ページ自体は Gutenberg のブロック構造で組み立てて、/profile/ に公開。

「プロフィールに『運営者:@nonenlab』のハンドル明記、サイト方針との整合性を取りました。」

と Claude。確認 → OK。

残り3ページの一括処理

ここからが速かった。

私の手元には、第2記事の頃に下書きしておいた3つのローカル Markdown ファイルがありました。

pages/privacy-policy.md
pages/disclaimer.md
pages/contact.md

Claude はこの3ファイルを読み込み、Markdown を Gutenberg ブロックに変換し、それぞれを /privacy-policy/、/disclaimer/、/contact/ として一括公開。

このタイミングで、内部リンクも自動解決されました。例えば contact ページの本文に「プライバシーポリシー」という文字列があれば、最初の出現1箇所だけを /privacy-policy/ へのリンクに変換する。「同じ単語が3回出てきたら3回ともリンクするのは過剰」というのが Claude の判断でした。読者向けに親切な処理です。

スラッグ衝突 → 自動対処

ここで唯一のハマりが起きました。詳細は第4章に分けます。一行で言うと、「WordPress には初期状態で『プライバシーポリシー』というドラフト固定ページが存在していて、そのままだと新ページのスラッグが privacy-policy-2 になってしまった」。Claude が検出 → 自動でゴミ箱移動 → 新ページのスラッグを privacy-policy に修正、で解決。

フッターメニューの作成

4ページが出揃ったあと、Cocoon のメニュー位置 navi-footer と navi-footer-mobile の両方に、新規メニュー「フッターメニュー」を割り当て。並び順は、プロフィール → プライバシーポリシー → 免責事項 → お問い合わせ。

PC とモバイル両方のフッターを確認、リンクが正しく飛ぶことも確認。終了。

📷 画像予定:スクショ予定:フッターメニュー設定の画面(後日追加します)

整合性の同期と仕上げ

最後に、ローカルの Markdown ファイル群とサイト本体の文言を同期。運営者名は「@nonenlab」で統一しました(別の表記が混ざらないように)。

ここまで通しで、私が手を動かした時間は約30分。「OK」「進めて」「ここは違う」を10回弱押した記憶です。

第3章:アバター1案目で、私は固まった

アバター事件をもう少し丁寧に書き残します。技術的には小さなエピソードだけど、この記事のなかで一番、私が自分について考えた瞬間でした。

最初に出てきた1案目を見て、私は一瞬、画面を凝視しました。

「これを自分のサイトの顔として置くのは、無理だ」

帽子と髪の境目が曖昧で、顔だけ前に出ている。シルエットが整っていない。「副業ブログの運営者の自己紹介ページ」に貼った瞬間、訪問者は1秒で離脱する絵柄でした。

ここで Claude に流されて「まあ AI が出したやつだし、こういう感じでいいか」と妥協していたら、たぶん私はこの記事を書けていない。「持っていかれた」感の象徴になっていたと思います。

却下しました。

「うさんくさい。帽子より顔が前にでてる」

Claude の返しは、言い訳をしませんでした。

「確かに変ですね。髪を描いたつもりが帽子に見えて、顔とのバランスが崩れていました。」

これ、地味だけど大事な反応だと思います。AI に対して「ダメだ」と言ったとき、その理由を即座に翻訳して返してくれる。「人間の指摘 → 構造的な原因の特定 → 次の改善方針」が一周するのが速い。

そこから5名のペルソナ会議に入って、3案を作り直してきました。並べてみると、それぞれの案が「どんな読者にどう見えるか」をはっきり持っていて、選びやすかった。私は案Aを採用。

このやり取りで分かったのは、AI を使うときに「ダメだ」と言える自分が、自分の中にあるかどうか、これが効くということ。

「うさんくさい」という言葉が口から出たのは、私が自分のサイトの読者像と温度感を、自分の中に持っていたから。これがなかったら、私は1案目をそのまま採用していました。そうしたら、このサイトの第一印象は、永遠にうさんくさいまま固定されていた。

📷 画像予定:スクショ予定:5名ペルソナ会議で再設計された3案のアバター比較画面(後日追加します)

ぞっとする話です。

第4章:スラッグ衝突 — 自動で対処された話

技術的なハマりはここだけでした。地味な話だけど、Claude の挙動として面白かったので残します。

プライバシーポリシーのページを作ろうとして、Claude が REST API 経由で固定ページを作成した直後、こう言ってきました。

「WordPressデフォルトの空ドラフト(ID=3)が原因。削除して、新ページ(ID=19)を正しいスラッグに直します。」

何が起きていたか、初心者向けに分解します。

WordPress の初期状態には、最初から「プライバシーポリシー」というタイトルのドラフト固定ページが入っている。これは GDPR(EU の個人情報保護法)対応のために、WordPress が「ユーザーがすぐにプラポリを書けるように」と用意してくれているテンプレなのですが、放置されたまま下書き状態で残っているケースが多い。

このドラフトのスラッグが privacy-policy を占有しているため、私が新しく作った「プライバシーポリシー」ページは、WordPress の自動採番で privacy-policy-2 になってしまった。

状態	ページ	スラッグ
Before	初期ドラフト(ID=3)	`privacy-policy`(ドラフトのまま)
Before	新規ページ(ID=19)	`privacy-policy-2`(欲しいのはこっち)
After	初期ドラフト	ゴミ箱へ
After	新規ページ	`privacy-policy` に修正

これ、自分で気づかずに放置していたら、ASP 審査で「プラポリの URL は /privacy-policy-2/ ですか?それは普通じゃないですよね?」と引っかかった可能性があります。少なくともダサい。

Claude が REST API のレスポンスから「あれ?スラッグに数字が付いてる」と検知 → ID 3 のドラフトを発見 → 衝突原因を特定 → ゴミ箱に移動 → 新ページのスラッグを privacy-policy に修正、まで自動で進めました。

私は「OK」を一回押しただけ。

📷 画像予定:スクショ予定:スラッグ衝突を検出したClaudeの応答(後日追加します)

学び: WordPress の初期ドラフトは、固定ページ一覧を一度ちゃんと見て掃除しておく。気づかないまま新ページを作ると、スラッグが微妙にずれる。

第5章:Application Password を発行・削除した話

ここはセキュリティの話なので、初心者向けに分解しておきます。

Claude Code が WordPress を直接操作するには、WordPress 側に「この Claude さんに操作させていいよ」という許可を渡す必要があります。これに使うのが Application Password(アプリケーションパスワード)。

例えるなら、家の合鍵を一時的に渡すようなものです。普段使いのログインパスワードを渡すと、紛失したら家全体が乗っ取られる。だから、「このアプリ専用」「いつでも取り消せる」合鍵を別に作って、それだけ渡す。これが Application Password の発想です。

実際にやったこと:

1. WordPress 管理画面 → ユーザー → プロフィール → 一番下の「アプリケーションパスワード」欄 2. 名前を「Claude Code(固定ページ作成用)」と入れて発行 3. 表示された 24 桁の文字列を、Claude Code 側に渡す 4. Claude が REST API 経由で4ページ作成・メニュー設定・スラッグ修正など全部終わらせる 5. 作業終了後、すぐに同じ画面でその Application Password を取り消し

ステップ5、これが大事。「使い終わった合鍵は、すぐ回収する」が、セキュリティの基本姿勢です。Application Password は発行したまま放置すると、万が一どこかから漏れたときに、そのキーで WordPress に入られる(=管理画面のログイン情報がバレていなくても、操作される)。

Claude もこれを意識していて、作業の最後に「Application Password はもう不要なので削除をおすすめします」と能動的に言ってくれました。私はその場で削除して、画面のスクショを撮って終了。

学び: 自動化のために発行した認証情報は、用が済んだら必ず取り消す。Claude Code に作業を任せるとき、この「終わったら鍵を回収する」という習慣だけは自分で持っておく。

第6章:私はその間、何をしていたか — 承認ボタン係の30分

ここまで読むと「Claude すごい」みたいな話に見えますが、私の側の話を残しておきます。

私はその30分、ほぼ承認ボタン係でした。

PC の前に座って、Claude の出力を読んで、「OK」「進めて」「ここは違う」のどれかを返す。それだけ。

途中、コーヒーを淹れ直しました。福岡は4月の終わりで、窓を開けると風がぬるい。生活ディテールを書いておくと、その日は土曜の午前中で、家族はまだ寝ていて、私はマグカップを持ってリビングのテーブルに戻ってきたところでした。

画面の中では、Claude が REST API を叩き、JSON を返し、固定ページが1つ、また1つ生成されていく。手元では、私はマグカップに口をつけて、画面の文字を目で追っているだけ。

「自分の手応えがこんなに薄いのに、サイトはちゃんと前進している」という体験は、初めてでした。

第1記事(Claude Code 導入とサーバー契約)は、自分が画面に張り付いて、コマンドを打って、PATH を設定して、SSL の警告画面に焦って、合計5〜6時間。あれは確かに「自分が手を動かした」実感がありました。

第2記事(WordPress 初期設定)も、合計2〜3時間。プラグインを選び、コメントをOFFにし、Cocoon の子テーマを有効化した。これも自分の作業でした。

今回の30分は、毛色が違いました。「私の作業時間」と呼んでいいのか、迷うところがある。実際に手を動かしているのは Claude で、私は判断だけしていた。判断と作業の重みは、頭では別だと分かっていても、身体ではまだ整理しきれていません。

第7章:この経験で考えたこと

正直に書きます。複雑な気持ちでした。

ひとつには、「自分でやるはずだったことを、AI に持っていかれた」感。プラポリは法律と関わるところで、自分の言葉で書きたい・自分で調べたいという気持ちはあった。免責事項もそう。一行ずつ、なぜそう書くのかを腹落ちさせながら書きたかった。

もうひとつは、「これでいいのか」という戸惑い。プロフィールについては「自分の言葉で書く」と前の記事の中で自分自身に申し送りしていたのに、結局 AI に下書きを書いてもらった。文面は自分の前提と一致していて、嘘は書かれていない。それでも、「最初の一行を、自分のキーボードで打ったわけではない」という事実は残ります。

一方で、4〜5時間が30分になった事実も無視できません。

アフィリエイト申請に向けた次の動きが、丸1日早くなる。同じ時間で、次の記事に手を付けられる。あるいは、今日の家族との時間に戻れる。圧縮された時間は、別のことに使える資産です。

そして、内容は私が確認しています。Claude が出した文面に「ここは違う」「この一行は外して」「アバターはうさんくさい」と言える程度には、サイトの方針も自分の言葉も、自分の中にあった。だから、流されてはいない。

ここから、ひとつだけ自分のなかに残った言葉があります。

AI を使う、というのは、自分が何者でどこに向かっているかを把握していないと、ただ流される。

アバター1案目で「うさんくさい」と言えたのは、私の中に「このサイトの読者像」が立っていたから。プロフィールの方針を「これで進めて」と返せたのは、私が第1・第2記事で自分の前提を書いていたから。プラポリの文面に「ここは違う」と引き戻せたのは、自分の運営方針を自分で握っていたから。

逆に言うと、これらが空っぽだったら、私は AI が出したものを「まあいいか」で全部通していた。そうしたら、出来上がるのは「私が運営しているように見える、AI が作ったサイト」になる。

技術的なツールとして、Claude Code は本当に強力です。同時に、それを使う側が空っぽだと、ツールの強さは「持っていかれる速度」に直結する。今回はその境界線を、うっすら感じた経験でした。

つまずきポイント・備忘録

雑多に置いておきます。

スラッグの自動採番に気づくのは、人間には難しい

第4章の話。WordPress が裏で privacy-policy-2 のように番号を振ってくる挙動は、固定ページの一覧画面を注意深く見ないと気づきにくいです。Claude が REST API のレスポンスから即検知してくれたのは助かりました。逆に手作業で4ページ一気に作っていたら、私は気づかずに公開していた可能性があります。

内部リンクは「最初の出現1箇所だけ」が読みやすい

contact ページの本文に「プライバシーポリシー」という単語が複数回出てくると、最初の1回だけリンクにするのが読者に親切。Claude はこの挙動を最初から取り入れていました。SEO 的にも内部リンクの過剰は逆効果なので、この基準は今後も踏襲します。

Application Password は終わったら必ず削除

第5章の話。発行したまま放置すると、リスクが残ります。Claude 側からも「もう不要なので削除を」と言ってくれましたが、これは自分の習慣として身につけておく内容です。

運営者名の表記揺れに注意

「@nonenlab」「nonenlab」「非エンジニアAIラボ」など、表記が混ざりやすい場面でした。Claude に「@nonenlab で統一」と1回伝えれば、4ページ全部とローカル .md にも反映してくれます。最初に決めておく。

「自分の言葉」と「AI の下書き」の境目

これは備忘録というより、自分への申し送り。プロフィールは AI に下書きをさせたうえで、最終的に自分の言葉で書き直してもいいタイミングがある、と思っています。今回はそこまでやっていません。今後、サイトの色がはっきりしてきたら、プロフィールだけは自分で書き直す予定です。

終わりに

固定ページ4ページが揃ったので、ようやくアフィリエイト ASP 審査に進めます。A8.net、もしもアフィリエイト、バリューコマース — 大手3社にエントリーしていきます。サイトの中身がスカスカでは審査に通らないので、記事数も並行して増やします。

[アフィリ挿入:ASP紹介(将来差し替え)] — 大手 ASP は登録無料です。本ブログでも実際に使う予定で、申請の通過/不通過の記録は別記事に残します。同じく副業ブログを始める方が「どこから登録すればいいか」を迷わないように、自分の検証結果ベースでまとめます。

今回の経験を一行でまとめると、こうなります。

AI に作業は預けられる。判断は預けられない。

判断の中身が空っぽだと、預けたつもりの作業ごと、自分から流れていく。逆に、判断の中身を自分で握っていれば、AI は本当に頼れる相棒になる。アバター1案目を「うさんくさい」と却下できた30秒が、この30分の中で一番大事だったと、今は思っています。

1記事目はこちら — Claude Code 導入と WordPress 立ち上げの全記録。

次の記事(第4記事)について

第2記事で「次は WordPress × Claude Code 連携編に戻る」と書いて、今回もう1本挟みました。次こそ、ようやくそこに戻れます。

第4記事は「ローカル原稿を直接 WordPress に投稿する仕組み」を予定しています。この記事も、ローカルで Markdown を書いて、Claude Code 経由で WordPress に投稿しています。その仕組みを記事化する番です。

つまずきも、葛藤も、判断の根拠も、引き続き全部記録していきます。同じ立場で何かを始めようとしている方の役に少しでも立てば。