目次
読了時間: 約10分
バイブコーディングが提唱されてますが、みなさん、クリエイティブに勤しんでますか？
もはやバイブスで制作活動ができる素敵な環境になりつつある今日この頃。WixやJindoに頼らなくてもワードプレスでそれなりなテーマを自作できてしまうというお話。
そんなわけで、ノリで作ってしまったワードプレスのテーマですが「使ってくれる人・改造してくれる人がいれば幸い」と、いうお話です。
ワードプレスのテーマCocoonに感銘を受けて
Cocoonに出会ってからずっとCocoon一筋だった私です。
サイトスピードが速い！かゆいところに手が届くウィジェットたち！個別に設定できるタイトルタグとディスクリプション！非常にいいテーマです。
サイトとしてはへなちょこで、月間PV数なんてとても口に出せないようなサイトですが、個別の記事でいうと特定のキーワードではそこそこ評価をされていたりします。そんな私の記事を支えてくれたのは間違いなくCocoonです。フォーラムの質問の受け答えを眺めながら、わいひらさんのちょっとつっけんどんな感じとかも好きでした。
しかしながら、非常に高機能なCocoonではあるのですが、表示側についてはシンプル故の悩みが…自分好みの設定にしようと思うとどうしてもCSSを書き加えなければならない。シンプルゆえに加筆可能なテーマといえば確かにそうなのですが「コードは基本シンプルな構成が良い」というSEO観もあるわけで。。。
併せて、プラグイン「Site Kit」の出現が大きい。Googleが出してるプラグインなだけあって、Google関連の必要な設定がプラグインを入れるだけでほぼ済んでしまう。Cocoonでも設定できるわけだが、機能が重複してしまう部分ともなり、Site Kitを使おうと思うとCocoonのせっかくの機能が活用されないという。。。サイト運営において、使わない機能をそのままサーバーに置いておくことをあまり好ましく思わない私としては、どうしても気持ち悪さがあり「いっそ自分用にテーマを作ってしまえ！」と、なった次第。
とはいえ、いまだにCocoon愛は強いです。なんだかんだ完成度の高さは別格だと思ってます。
Antigravityによるバイブコーディング
これが、まぁまぁすごい！そして楽しい。
Antigravityの使い方に関しては割愛しますが、なんとなく私が行った手順だけ軽く触れておきます。
一応、お作法通り「Antigravityとは」については以下に触れておきます。
Antigravityとは？ 非エンジニアでも使えるAI開発ツール
「Antigravity（アンチグラビティ）」とは、主に Google が開発した、次世代の「エージェント型」AI コーディング支援ツールです。
このツールは、AI が自律的にタスクを計画し実行する「エージェント」としての能力に特化しています。従来の AI チャットや補完ツールとは異なります。
主な特徴と機能は以下の通りです。
自律的な開発プロセス: タスクの分解、実装方針の立案、コードの書き込み、アプリの起動、動作確認、エラー修正などを一連のプロセスとして自律的に行います。
エージェントファースト設計: ブラウザ制御機能や非同期インタラクションにより、AI が複雑なソフトウェアタスクを主導できます。
マルチモデル対応: Google の Gemini を中心に、Anthropic の Claude や OpenAI のモデルも利用できます。
VS Code との互換性: Visual Studio Code の拡張機能を利用できます。
利用料金は以下の通りです。
無料プラン: 基本機能を無料で試用できます。
有料プラン（Google AI Pro）: 月額料金で、使用制限の緩和や高度なモデルを利用できます。AIモードによる回答
ソース
https://zenn.dev/minedia/articles/cc718542d8cc73
https://www.youtube.com/watch?v=_YgAIXSH-Gg 他
まぁ、要するに「おしゃべりしてる間にAIがコード書いてプログラムみたいに動くものを作ってくれるぞ！」と、そんなツールです。
WordPressのテーマをAIで作る手順
基本的に通常のWeb制作と変わらないと思うのですが「制作コンセプトの策定→仕様・要件の洗い出し→設計・仕様書の作成→デザイン・コーディング→デバッグ→リリース」の、流れです。
ただ、この中で設計以降の重たいプロセスはAIが実行してくれるので、こちらは「あーでもない。こーでもない」を口出しするだけで制作が進行するという。しかもコーディングは人がやるわけではないのでムチャクチャ早いわけです。
人がやると、機能を一つ要望出したところで2・3日かかるものですが、AIが作業してくれるところでは数分のうちに答えが返ってきます。当然エンジニアではないので、私が問題個所を指摘できるわけでもなく、技術的な問題で差し戻しをすることもないのですが、それを考えても早いです。
プロンプトの参考になるかはわかりませんが、以下参考まで。
ワードプレスのテーマを新規に作成したい。
Cocoonをベースに、多機能かつSEO対策に長けた、シンプルで使い勝手の良いワードプレスのテーマを制作する。
自身のブログに適用しつつ、一般公開することも視野に入れながら汎用的に使えるワードプレステーマとする。
Antigravityを利用するためのディレクトリ準備や、現行サイトからのデータベースバックアップ、Cocoonのテーマフォルダの設置、自分のサイトに適用している個別のCSSの書き出し等、細かい作業有。
加えて、Cocoonのテーマで採用されされている機能の中で、思いつく機能をリストアップ。
※ここからAIまかせです。
プロンプト（例）
「ワードプレスのテーマを新規に作成したい。以下は、コンセプトであり、必要なディレクトリはその後にリストを記載する。ファイルを読み取り、制作進行に必要な仕様書を作成せよ。
コンセプト
Cocoonをベースに、多機能かつSEO対策に長けた、シンプルで使い勝手の良いワードプレスのテーマを制作する。
自身のブログに適用しつつ、一般公開することも視野に入れながら汎用的に使えるワードプレステーマとする。
以下、資料格納フォルダ
C:\Users\~~~~~」
「仕様書に従い、作業計画書を作成、進行を可視化したうえで制作を開始してください」
※この作業はそこそこに大変です。
要望した機能・体裁が守られているのか一つずつ確認し、要望と異なる箇所、気になる体裁等をひとつひとつつぶしていきます。
実際の自分のサイトに適用し、公開。
スピードインサイトでのテストやサーチコンソールへの対応も忘れずに。
デバッグは正直、作業工数が減る印象はありません。AIであってもバランスのいい配置や美しい見せ方を理解しているわけではないですし、機能に関しても彼らが作るものは「彼らが使い方を理解しているもの」であって、「人間が」使いやすいレイアウトや操作性みたいな配慮は期待しないほうがいいです。
エラーではまった時にも抜け出すのには適切な指示が必要になります。
そういった観点では「誰でも簡単」とは少々言い切れない気もしますが、制作のハードルが格段に下がったことは間違いありません。
ワードプレステーマ「AW-Base」誕生
ってなわけで、それなりに苦労はしましたが、一旦「AW-Base」については世に出してみることにしました。
いまご覧になっているこのサイトは、実際にAW-Baseで動かしています。
性能
ページスピードインサイトの点数は、テーマだけの実装で93点。
現在の私のサイトで測ったところ52点でした。Adsense広告が入っているところでガクッと落ちます。
機能
ざっくりとした主要な機能だけ書き出します。
- タイトル・ディスクリプションの個別設定
- ブログカード・FAQ・タイムライン等、ブロック6種
- AIロボットのクローリング集計
- XMLサイトマップ・LLMsテキストの出力
- 各種構造化データ出力
- 画像遅延読み込み・コード圧縮等の高速化
- ヘッダーまわりのレイアウト変更
- カラーテーマの設定6種
注目機能と展望
個人的に面白いと思っているのは、AIボットのアクセスをトラッキングする機能です。
4種のAIボットが、どのような目的でクロールしてきたのかを集計します。
一応欲しい機能等、気づいたタイミングで更新はかけていくつもりではいますが、それほど多くの機能を追加するつもりはありません。執筆した記事が体裁よく表示できていればおおよそ十分といった気持でいます。
テーマダウンロード
以上の内容をご理解いただき「面白そうじゃん！使ってやるよ！」と、いう方がいらっしゃれば、是非使ってみてください。
親テーマ：「AW-Base」
子テーマ：「AW-Base Child」
※尚、テーマご利用による事故等につきまして、当方では一切責任を負いかねます（作業前のバックアップを推奨します）のでご了承ください。
一応コメントは解放しておきますので、何かあれば書き込みをお願いします。
SEO関連の自作ツール
ついでに、検索対策のツールとして、いくつかの記事を公開していますので、ご興味ある方はご覧になってください。
まとめ
今回、テーマを作ってみて感じたのは、「AIを活用すれば、ワードプレスの知識に自信がなくても、自分の『やりたいこと』を極めて具体的に形にできる」ということ。
最近は特に「今さらワードプレスに学習コストを割くのは無駄」「ノーコードツールの方がAIを使えて便利」といった記事を見かけます。確かに、記事作成をAIに頼る方には、AIが実装されたCMSは便利なのかもしれません。しかし、記事作成以外で自分のやりたいことを実現するために「AIを相棒にして作ってしまう」ということができるのは「ワードプレスならでは」ではないでしょうか。
Antigravityで「バイブコーディング」に挑戦したわけですが、前提の知識は多少必要にせよ、全くワードプレスに未来がないといったことはないように感じました。
むしろ、システム側の都合に自分を合わせる必要がないので、可能性はいくらでも広がる気がします。
追記
今回、テーマを制作したことで、私は以前使っていたプラグインを3つか4つ削除することができました。
