Claude CodeでWordPressのLPを1週間で作った話

AIを使えば、かんたんにLPができあがる!

そんな時代がとうとう来ましたね。

私も情報だけはいろいろと収集してはいたものの、会社でもAI禁止されてるし、なかなか実践できずにいました。

「すごそう!便利そう!」

だけど

「ほんとにすごいの?便利なの?」

ということで、WordPressの保守サービス用のLPを作ってみました。

LPを作ろうと思った理由

「WordPressの保守サービス」やりたいなぁって思ってるんですよね。

ただ、まだ細かいところまでは考えてない。

そもそも保守サービスだけじゃ、物足りないけれど、それも含めてAIに相談して作るところをやってみました。

構成を決めた(12/15)

まずは月曜日。
構成を考えました。

よくあるような内容ですが

トップページ
 ├── サービス内容
 ├── 料金プラン
 ├── お問い合わせ
 └── ブログ(別で運用)

こんな形でどうかと、AIにも相談してみたところ、いいんじゃないかと返答もらいました。

でもちょっと待てよと。

あえてページを分ける必要もないんじゃないか?
内容も大してないし、LP風にしてしまったほうがいいんじゃないか?

と考え直して、再度AIに相談。

完璧な判断です!
LP(ランディングページ)1ページ構成、最初はこれが絶対に正解です。

おぉ、だったら最初からそう言ってくれよ…。

そこからはさらに進めて、各セクションに掲載する内容を決めていきました。

Claude Codeを初めて使った(12/16)

今まで使っていたのはClaude。

そしてProプランに加入しているのは、Claude Codeを使ってみたかったから。
そしてようやくその時が来ました。

何か月支払ったことか…。

ほかのサイトを参考に、Claude Codeを無事インストール。
サブスクリプションプランになってるはずだから、料金も安心。

これで、私もAI使える人に一歩近づいた気がします。

なんでもAIさんが開発してくれるぜ!
そんな気分です。

1日で全セクション生成(12/18)

サイトの構成も決まって、各セクションの内容も決まった。
Claude Codeもインストールできた。

となれば…

やることは…

Claude Codeにサイトを作ってもらう!

各セクション同じような感じでプロンプトを繰り返します。

「サービス内容」セクションのHTMLとCSSを作ってください。
site-plan.mdの内容をしっかり把握して、反映してください。

そうそう、構成と内容をsite-plan.mdというのにまとめておいて、それをClaude Codeに参考にしてもらって、LPを作ってもらいました。

何度か繰り返して、ようやく完成。

見た目は、 AIっぽいデザインだけど、まず完成を優先ということで、OKです。

さぁ、次はWordPressに組み込んでいきましょう。

コメント

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です