WordPress開発でのAI活用事例7選（ChatGPTやClaudeなど）

ChatGPT、Claude、Cursor のような人工知能（AI）ツールは今日、WordPress開発者が日常的に使用するツールになっています。カスタムプラグインの構築、Gutenbergブロックを使った作業、WP-CLIによるタスクの自動化など、AIは開発作業の質を損なうことなく、コードの記述、デバッグ、リファクタリングを効率化してくれます。

今回は、開発者がAIを使ってWordPressの開発ワークフローを効率化する7つの活用事例をご紹介します。

1. カスタムプラグインコードの記述とデバッグ

WordPress開発者がAIを使用する最も一般的かつ効果的な方法の1つは、カスタムプラグインコードの記述とトラブルシューティングです。

何かをゼロから構築する場合、あるいは深刻なエラーを投げている顧客の古くなったプラグインを扱う場合も、ChatGPTやClaudeのようなツールを活用することで、作業を劇的に高速化することができます。

プラグインの雛形を構築

AIを使って、ヘッダー、フック、ファイル構成を含むプラグインの構造全体のフレームワークを作成することができます。いつもコピー＆ペーストしているプラグインを使う代わりに、必要なものを記述するだけでOKです。

例えば、以下のようになります。

「Event」というカスタム投稿タイプを登録するWordPressプラグインを作成してください。タイトル、エディタ、サムネイルをサポートし、日付と場所のカスタムメタフィールドを持つもので、REST APIを使用してこれらのメタフィールドを登録するコードを含めてください。

Claudeでは、単なるコードの取得だけでなく、以下のようなものも手にすることができます。

• オブジェクト指向でクリーンに構造化されたプラグインの完全なフレームワーク
• 各部分を説明するインラインコメント
• 適切なインデントと余白（一見当然だがこれが叶わないツールも多数）
• register_post_meta()を介して登録されたREST対応のメタフィールド
• イベントの日付と場所をキャプチャするためのメタボックスを備えた管理UI
• その他多数

プラグインエラーのデバッグ

空の画面やプラグインの致命的なエラーに遭遇した際には、AIを使って問題を素早く特定することができます。ChatGPT （特にGPT-4）はスタックトレースの説明が得意で、足りない関数呼び出しやタイプミス、非推奨関数を見つけてくれます。

以下は、ChatGPTへの指示例です。

カスタムプラグインで次のエラーが発生しました。
"Uncaught Error: Call to undefined function get_field() in /wp-content/plugins/my-plugin/plugin.php on line 42"
問題と解決策を教えてくれますか？

ChatGPTは以下のようなことを実行してくれます。

• get_field()がAdvanced Custom Fields（ACF）の機能であることを正しく認識
• このエラーの一般的な原因をすべてリストアップ
• init やwpのようなフックで関数をラップし、呼び出す前にfunction_exists()をチェックするようなベストプラクティスを提案

プラグインファイル全体をCursorのようなツールに貼り付けて、「WordPressのベストプラクティスのためにコードを監査して」や「最新のPHPとWPコーディング標準に従うようにこれを書き換えて」などと指示することも可能です。

既存プラグインの機能変更

例えば、80%必要なものを揃えたプラグインの開発を行う場合、出力の微調整やフォーム送信へのフック、マルチサイトへの対応などを行う必要があるかもしれません。

手作業でコードベースを調べる代わりに、エディター内でCursorやGitHub CopilotのようなAIツールを使えば、より高速かつ安全に変更を加えることができます。例を見てみましょう。

このプラグインはカスタム投稿タイプ「お客様の声」を作成して、ショートコードを使ってそれを表示するものです。コンテンツの下に太字でお客様の名前も出力するように変更してください。以下はショートコードの出力機能です。
[...関数を貼り付け...]

あるいは以下のようなパターンもあります。

このプラグインがマルチサイト上で動作しないように更新してください。マルチサイトの場合は、管理者に通知してプラグインを無効にしてください。

これにより、AIによって以下のような操作が行われます。

• ファイル内の正確な関数やフックを検索
• 全体を書き直しではなく、必要最小限の変更を提案
• ロジックをプラグインの構造にスコープしておく（特にCursorを使っていてコードベース全体を読んでいる場合）
• 必要に応じてis_multisite()やfunction_exists()のような安全チェックを追加

また、「お客様の名前の表示を任意にしますか？」や「お客様の名前は投稿メタかショートコード属性のどちらを使いますか？」のような開発者を理解した質問が返されるかもしれません。

2.カスタムGutenbergブロックの作成

Gutenbergブロックの開発は、特にReact精通していない場合は面倒なことが多く、Webpackのセットアップ、ブロックの登録、レンダリングロジックの間で停滞しがちです。ここでもAIツールを活用することで、作業を効率化することができます。

カスタムブロックの生成

例えば、Claudeに引用文、著者名、著者画像をサポートした「お客様の声」というGutenbergブロックの作成を依頼します。

「お客様の声」というGutenbergブロックを作成してください。引用文、著者名、著者画像のフィールドが必要です。エディタでプレビューを表示し、PHPを使ってフロントエンドでレンダリングし、後でスタイルを設定できるように、基本的なマークアップとクラス名でブロックを出力してください。

Claudeはプラグインを以下のような複数の構成要素に分割してくれます。

• PHPプラグインファイル（testimonial-block.php）：register_block_type()でブロックを登録
• JSファイル（block.js）：TextControl、MediaUpload、useBlockPropsなどでブロックのUIを設定
• CSSファイル（editor.cssとstyle.css）：エディタとフロントエンドの両方に適用されるスタイル

また、各ファイルの保存場所や/wp-content/plugins/内のフォルダの構成方法も説明してくれるため、すぐにテストを行うことができます。

組み込みのブロックを使っていて、@wordpress/scriptsを毎回ゼロから設定するのが面倒な場合は、このようなAIの活用で80%は解決可能です。マークアップやフィールド構造は、後からいつでもカスタマイズできます。

レイアウトを変更するには、「著者画像を引用文の横ではなく上に表示して」や「著者画像を画像URL入力に置き換えて」などと指示を出せばOKです。

既存ブロックの変更

ブロックをゼロから作成するときと同じように、ClaudeやChatGPTを使って既存のGutenbergブロックを微調整することも。他の開発者が始めたプロジェクトに取り組んでいる際や数ヶ月前に書いたブロックを見直す際に特に便利です。

例えば、シンプルなテキスト入力のブロックがあり、出力を強調するかどうかをコントロールするトグルを追加したいとします。edit()やsave()、PHPのrender_callbackを自分で調べたりする代わりに、AIにブロックの該当箇所を渡して探してもらうことができます。

以下はGutenbergブロックのedit()関数です。「Highlight」というラベルのToggleControlを追加して、これがオンの場合は、ブロックのラッパーにCSSクラス「highlighted」を追加するようにしてください。
[...関数を貼り付け...]

また、既存のコードスタイルに従うこともできます。ブロックがuseBlockProps()を使用している場合は、それを維持し、生のdivマークアップをレンダリングしている場合は、レイアウトを書き直すのではなくそれに従います。

3. 自動化用のWP-CLIコマンドの作成

WordPress開発者にとって、WP-CLIはレベルアップツールと言えます。管理画面をクリックしたり、一時的な管理画面を書いたりする代わりに、適切なアプリのようにWordPressをスクリプト化することができます。

AIはすべての過負荷を取り除いてくれるため、WP-CLIのドキュメントに目を通したり、クラス形式を推測したり、別のプロジェクトから古いコードをコピーしたり、微調整に時間を費やしたりする必要がなくなります。

たとえば特定のメタキーですべての投稿を一括公開したい場合は、以下のようになります。

カスタムメタキー「event_date」が過去にある「event」タイプの投稿をすべてループして公開する「publish_scheduled_events」というカスタムWP-CLIコマンドを書いてください。

これにより、AIはWP_CLI::add_command()が適切に登録されたクラスとWP_Queryを使用するメソッド、meta_queryフィルターなどを返します。通常このコードは、実際のメタキー値の比較の微調整を除けば、すぐに本番環境で使えるものになっています。

また、WP-CLIコマンドを要求することも可能です。

• Transientのクリア
• パーマリンクの再保存
• 画像サイズの再生成
• 環境間でのオプションの同期
• カスタムインポートジョブのスケジュール実行

例えば、以下のような指示が考えられます。

wp_optionsテーブルの期限切れのTransientをすべて削除し、いくつ削除したかを記録するWP-CLIコマンドを記述してください。

すでにWP-CLIコマンドを書いているが、何らかの問題がある場合（引数を認識しない、正しくない出力が出るなど）、コードを貼り付けて質問することもできます。

このWP-CLIコマンドが --user_id引数 を正しく解析しません。何か間違っていますか？

4. WPクエリやカスタムデータベースコードでのSQLクエリ最適化

何千もの投稿と肥大化したwp_postmetaテーブルを持つサイトを実際に実行するまでは問題なく見えるクエリを扱うことは多々あるはず。パフォーマンスが低下して初めて事態は急速に悪化します。

ChatGPT、Claude、Cursor（完全なコードベースで作業している場合）のようなツールは、SQLやWP_Query設定をレビューし、非効率なパターンを指摘したり、クエリを完全にリファクタリングしたりするのに役立ちます。

WP_Query設定のボトルネックを見つける

カスタムのメタフィールドで今後のイベントを表示する複雑なWP_Queryを書き、その読み込みが遅い場合には、以下のように質問することができます。

以下はカスタムメタフィールド 「event_date」でソートされたイベントのWP_Queryです。イベントがたくさんある時に遅くなるのですが、どうすれば最適化できますか？
[...WP_Queryの引数を貼り付け...]

この場合、以下のような回答を得ることができます。

• meta_queryはインデックス化されていないことを念頭に置く。そのため大規模なデータセットをクエリする場合は、常に高コストになる。
• できればorderby => 'meta_value'の使用を避ける。
• パフォーマンスを考慮し、正規化された日付をカスタムDBカラムまたはタクソノミーに格納する。
• SQLを直接変更するためにpre_queryフックを使用するようにロジックを書き換える。

生SQLの分析とリファクタリング

レポート、分析、プラグインロジックなど、WP_Queryを完全にバイパスすることがあります。例えば、wp_postsとwp_postmetaを結合する生のSELECTクエリを書いたが遅い、あるいは重複した結果を返すとします。

この場合は、以下のような質問を行うことができます。

以下のSQLクエリが遅いのですが、最適化してもらえますか？
SELECT p.ID, p.post_title, m.meta_value 
FROM wp_posts p 
JOIN wp_postmeta m ON p.ID = m.post_id 
WHERE m.meta_key = 'event_date' 
AND m.meta_value >= CURDATE() 
AND p.post_type = 'event' 
AND p.post_status = 'publish'

クエリが実際に何をしているのかを説明してもらう

大きなSQLクエリを実行する古いプラグインやテーマのコードを渡された場合（そしてそれが何をしているのかわからない場合）もまた、ChatGPTやClaudeに質問可能です。

以下のWordPressのSQLクエリが何をしているのかを説明してください。また、もっと効率化できますか？

これに対し、以下のような回答を得ることができます。

• どのテーブルがなぜ結合されているのか
• 各WHERE節が何をフィルタリングしているか
• クエリのどの部分が冗長かどうか
• LIMIT、ORDER BY、GROUP BYに問題があるかどうか

SELECT *、デカルト結合、LIKE節の非効率的な正規表現など、改善点も提示してくれます。

5. プラグインのユニットテスト/統合テスト（PHPUnit）の生成

WordPressのコードのテストを書くのは、必ずしも簡単ではありません。WPのテスト環境を初期化し、コア関数をモックして、テストが必要なものを見つけ出すのは手間のかかる作業になります。

AIツールはテストケースの記述に長けており、特に関数やクラスを与えて特定の動作をテストするように要求すると、テストケースを書いてくれます。

例えば、カスタム投稿を作成し、関連するメタデータを保存する関数を書き、以下のテストを行いたいとします。

• 投稿が正常に作成される
• 投稿タイプが適切に割り当てられてる
• メタフィールドが正しく保存される

以下のように指示を出すことができます。

この関数に対して PHPUnitテストを書いてください。この関数は、カスタム投稿タイプ「Event」を作成し、'event_date' と 'event_location' というメタフィールドを保存します。
[...関数を貼り付け...]

admin-post.phpを使って設定を保存するプラグインがあれば、それもテスト可能です。フォームハンドラ関数を貼り付け、以下のように指示を出します。

プラグインの設定フォームの送信を処理するこの関数のPHPUnitテストを書いてください。この関数は、POSTデータに基づいてオプションを保存し、nonce をチェックします。

プラグインが独自のREST APIルートを登録する場合、手作業でのテストは時間がかかり、エラーも起こりやすいものです。AIツールは、wp_remote_get()またはrest_do_request()を直接使用するテストを構築するのにも役立ちます。

カスタムRESTルート '//wp-json/my-plugin/v1/data` にGETリクエストを送信し、200レスポンスと有効なJSON出力をチェックするPHPUnit テストを書いてください。この関数は、POSTデータに基づいてオプションを保存し、nonce をチェックします。

基本的なテストであっても、問題を素早く発見することができます。AIに定型文を処理してもらえば、設定をいじらずにロジックのテストに集中可能です。TDD（テスト駆動開発）にこだわりすぎる必要はなく、「この関数で何をテストすべきか」を考えるだけで問題ありません。それにより、おそらく見落としていたアイデアを得ることができ、テストが開発の延長のような意義のあるものになります。

6. 古いコードのリファクタリングまたは変換

WordPressを数年以上使用している場合は、インラインスクリプト、至る所に存在するグローバル変数、おかしなタイミングの問題、PHPファイルに埋もれた$(document).ready()など、おそらくjQueryを多用したコードに触れた経験があるでしょう。

しかしWordPressは進歩しており、GutenbergはReactを使用し、テーマはブロックベースになり、管理画面のUIでさえ最新のJSの恩恵を受けています。jQueryをクリーンでモジュール化されたJavaScript（あるいは意味のあるReact）にリファクタリングするのは骨の折れる作業になります。

例えば、以下のような古いコードがあるとします。

jQuery(document).ready(function($) {
  $('#open-modal').on('click', function() {
    $('#my-modal').fadeIn();
  });

  $('.close-modal').on('click', function() {
    $('#my-modal').fadeOut();
  });
});

これを依存性のない最新のJSに変換するには、以下のような指示を出してみてください。

以下のjQueryコードを、fadeIn/fadeOutの代わりにaddEventListenerとclass togglingを使った最新のVanilla JSに変換してください。
[...コードを貼り付け...]

ClaudeまたはChatGPTから以下のような回答が返ってくるはずです。

document.addEventListener('DOMContentLoaded', function() {
  document.getElementById('open-modal').addEventListener('click', function() {
    document.getElementById('my-modal').classList.add('visible');
  });

  document.querySelectorAll('.close-modal').forEach(function(btn) {
    btn.addEventListener('click', function() {
      document.getElementById('my-modal').classList.remove('visible');
    });
  });
});

基本的には、以下のようなスタイルを追加することをおすすめします。

#my-modal {
  display: none;
}
#my-modal.visible {
  display: block;
}

これによりコードのメンテナンスが容易になり、読み込みが高速化され、フロントエンドにjQueryを必要としなくなります。

また、Gutenbergのブロックを構築または変更している際、古いJSがjQueryを使って動的にマークアップを挿入しており、そのロジックをReactに移して、edit()の内部で適切に動作させたいとします。

この場合は、以下のような指示を出すことができます。

このjQueryコードを、投稿データを含む <div> を追加するReactコンポーネントに変換してください。これはGutenbergブロック内で使用されます。
[...jQueryコードを貼り付け...]

コードでwp.apiFetchのようなWordPress APIを使用している場合は、統合方法も確認することができます。より良い非同期パターンを提案してくれたり、より適切にエラーハンドリングを行ってくれたりします。

別の例として、300行の手続き型JavaScriptが1つの<script>に詰め込まれているプラグインを扱っているとします。以下のような指示を出して分割を助けてもらうことが可能です。

以下のJavaScriptコードを再利用可能な関数に分割し、関心ごとに処理を分けてください。DOMのセットアップ、イベントハンドラー、データロジックはそれぞれ個別の関数に分けて整理してください。
[...コードを貼り付け...]

7. サーバー管理とDevOpsの簡素化

WordPress開発はコードを書くだけでは終わりません。デプロイから更新、パフォーマンス、サーバー設定まですべてが含まれます。Kinstaのようなプラットフォームでサイトを管理している場合、AIツールはより迅速な作業とミスの削減にも役立ちます。

KinstaのPHPエラーログやAPMツールで不可解なエラーに遭遇した場合は、以下のようにChatGPTに質問することができます。

KinstaのPHPログでこのエラーが出ました。このエラーの意味と解決方法を教えてください。

深刻なエラー、メモリの問題、プラグインの競合など、ドキュメントやStack Overflowを読み漁るよりも効率的に解決することができます。

Kinstaのドキュメント、プラグインのREADME、.htaccessのルールが解決策にならない場合は、Claudeに以下のように質問してみます。

開発者なのですが、サーバー設定には詳しくないので、以下の部分を説明してください。

AIツールは、GitHub Actions、GitLab CI、またはBitbucket PipelinesのようなGitベースのCI/CDワークフローを生成またはレビューすることも可能です。これらのワークフローは、Kinsta上でテーマのデプロイ、ファイルの同期、SSH 経由のデータベースマイグレーションの実行などに活用できます。

メインブランチにプッシュした後、SSH経由でKinstaサーバーにWordPressテーマをデプロイするGitHub Actionsワークフローを書いてください。

このように、AIはサーバー管理やDevOpsの手間のかかる部分や不明瞭な部分（ログの解読、デプロイのスクリプト化、ドキュメントの解釈など）をアシストしてくれます。

とはいえ、パフォーマンスの問題やエラー、サーバー設定などのサーバー関連の問題を処理するには、専門知識が求められます。何かが破損すればビジネスが停滞し、さまざまなコストが生じるもの。この点を考慮し、Kinstaでは日本語を含む10ヶ国語に対応したエンジニアによるサポートを24時間年中無休で提供しています。経験豊富なスタッフが親身にWordPress用サーバー関連のトラブルシューティング、説明、解決をお手伝いします。

まとめ

AIはWordPress開発者に取って代わるものではなく、開発作業をより効率化し、よりきれいなコードを書き、ちょっとしたミスを軽減するために活用することができます。

重要なのは、AIツールをジュニア開発者のように扱うことです。AIが1回の質問ですべてを解決してくれることは期待せず、ステップに分け、AIが提供してくれる内容を見直し、ステップごとに構築を進めていくことで、AIが提供する効率性の恩恵を受けながら、開発作業をコントロールし続けることができます。

Kinstaではカスタムプラグインの作成、パフォーマンスの最適化、大規模サイトのデプロイなどに必要な速度、ツール、手厚いサポートをご用意しています。