広大なインターネットの中で、WordPressはその柔軟性と強力なエコシステムにより、コンテンツ管理システムの市場の半分を占めています。その中核となる拡張性は、大きくプラグインに依存しています。開発者にとって、WordPressプラグインの開発をマスターすることで、ウェブサイトの機能を深くカスタマイズするだけでなく、自分のアイデアを再利用可能な製品に変えることもできます。この記事では、ゼロから始めて、実用的な機能を持つWordPressプラグインを作成する方法を手取り足取りご紹介し、プラグイン開発の神秘のベールを取り除きます。
WordPressプラグインの基礎と準備作業
最初のコード行を書き始める前に、WordPressプラグインの基本概念と適切な開発環境の構築を理解することが非常に重要です。WordPressプラグインとは、本質的には1つまたは複数のPHPファイルの集合であり、JavaScript、CSS、画像などのリソースも含むことがあります。プラグインを使用すると、新しい機能を追加したり、既存の機能を変更したりすることができます。また、プラグインはテーマとは独立して動作するため、テーマを変更してもプラグインの機能は通常影響を受けません。
ローカル開発環境（例：Local by Flywheel、XAMPP、MAMP）または開発用のテストサイトが必要です。主要なツールには、コードエディタ（VS Code、PhpStormなど）とデバッグ用のブラウザ開発者ツールが含まれます。WordPressの仕組みを理解していることが求められます。wp-content/pluginsディレクトリ構造の設定が第一歩です。すべてのプラグインはここにインストールされます。
推薦図書 WordPressのプラグイン開発に着手するということは、世界中の人々のためにソフトウェアを開発することを意味します。。
最初のプラグインファイルを作成しましょう。
プラグインのエントリーポイントは、独立したディレクトリ内にあるメインのPHPファイルです。このファイルには標準的なプラグインヘッダーのコメントが含まれている必要があり、WordPressはこのコメントを頼りにバックエンドの管理インターフェースでプラグインを認識し、表示します。
プラグインヘッダー情報の定義
すべてのプラグインは、特定のPHPコメントブロックで始まる必要があります。このコメントブロックには、プラグインのWordPressバックエンドにおける基本的な情報が記載されています。プラグインのディレクトリ内で（例えば…）wp-content/plugins/my-first-plugin）の中で、``という名前のものを作成してください。my-first-plugin.phpのファイルです。
<?php
/**
* Plugin Name: 我的第一个功能插件
* Plugin URI: https://yourwebsite.com/my-first-plugin
* Description: 这是一个学习用的WordPress插件，用于在文章末尾添加自定义提示框。
* Version: 1.0.0
* Requires at least: 5.6
* Requires PHP: 7.4
* Author: 你的名字
* Author URI: https://yourwebsite.com
* License: GPL v2 or later
* Text Domain: my-first-plugin
*/ファイルを保存した後、WordPressの管理画面にログインし、「プラグイン」メニューに移動してください。そこに「My First Feature Plugin」という名前のプラグインがリストに表示されているはずです。このプラグインを有効にすることができます。まだ何の機能もありませんが、これで最初のステップを成功裏に踏み出しました。
プラグインを構築するための基本構造
機能が増えるにつれて、単一のファイルを管理するのが難しくなります。良い慣行としては、整理されたディレクトリ構造を作成することです。例えば、プラグインのルートディレクトリ内にディレクトリを作成するといった方法です。includes/このフォルダには、PHPのコアクラスや関数のファイルが保存されています。assets/フォルダにJavaScriptとCSSのファイルが保存されています。admin/とpublic/バックエンドとフロントエンドのロジックをそれぞれ別々に処理します。メインファイルmy-first-plugin.phpそれはこれらのモジュールを導入し、読み込む役割を果たします。
コア機能の実装：フックとフィルター
WordPressプラグイン開発の核心哲学は「フック（Hooks）」です。これにより、コアファイルを変更することなく、特定のタイミングで自分のコードを挿入することができます。フックには2種類あります：アクション（Action）とフィルター（Filter）です。アクションを使用すると、記事の投稿やフロントエンドの読み込みなど、特定のイベントが発生した際に関数を実行できます。一方、フィルターを使用すると、記事の内容やタイトルなどのデータを変更することができます。
推薦図書 ゼロから始める：WordPressプラグイン開発の完全なガイドと実践的なチュートリアル。
フィルターを使って記事の内容を変更する。
では、プラグインに最初の実用的な機能を追加しましょう：すべての記事の内容の最後に、カスタムのポップアップウィンドウを自動的に表示する機能です。そのために、以下の手順を実行します…the_contentフィルター。
まず、メインプラグインファイル内のヘッダーコメントの下に、以下の関数とフックを追加してください：
// 防止直接访问文件
if ( ! defined( 'ABSPATH' ) ) {
exit;
}
/**
* 在文章内容末尾添加自定义提示框
*
* @param string $content 原始文章内容。
* @return string 修改后的文章内容。
*/
function mfp_add_notice_box( $content ) {
// 仅在主循环的单篇文章页面显示
if ( is_single() && in_the_loop() && is_main_query() ) {
$notice_box = '<div class="mfp-notice" style="background-color: #f0f8ff; border-left: 4px solid #3498db; padding: 15px; margin: 20px 0; border-radius: 5px;">'$notice_box = '<p><strong>ヒント</strong> この記事は、「私の最初の機能プラグイン」によって表示が強化されました。この内容が気に入っていただけると嬉しいです！</p>'$notice_box = '</div>'すべてのページで注意喚起を表示するには、「add_filter( 'the_content', 'mfp_add_notice_box' );」を使用します。;関数mfp_add_notice_box元のコンテンツを受け取ります。$contentパラメータとして、現在の環境が単一の記事ページであるかを確認します。もしそうであれば、ヒント情報を含むHTMLブロックを組み込み、修正後のコンテンツを返します。add_filterこの関数は、このカスタム関数をWordPressにマウントします。the_contentフィルターの上にあります。
アクションを使用して、プラグインに設定メニューを追加します。
プラグインをより完璧なものにするためには、通常、バックエンドでの設定ページを提供する必要があります。ここではアクションフックを使用する必要があります。admin_menuメニュー項目を追加しましょう。
/**
* WordPressバックエンドにプラグイン設定メニューを追加する
*/
関数mfp_add_admin_menu() {
add_options_page(
'マイプラグイン設定', // ページタイトル
'私の最初のプラグイン', // メニュータイトル
'manage_options', // 必須パーミッション
'my-first-plugin', // メニュースラグ
'mfp_render_settings_page' // ページ内容を出力するコールバック関数
);
}
add_action( 'admin_menu', 'mfp_add_admin_menu' )；
/**
* 設定ページのコンテンツをレンダリングする
*/
関数 mfp_render_settings_page() { ?
?>
<div class="wrap">
<h1>私の最初のプラグインの設定</h1>
<form action="/ja/options.php/" method="post" data-trp-original-action="options.php">
<input type="hidden" name="trp-form-language" value="ja"/></form>
</div>
あなたのアカウントは有効です。あなたはログインしています。この例を通じて、アクションフックを利用してWordPressの管理画面を拡張する方法を理解できたでしょう。完全な設定ページの作成には、通常、さらなる設定や処理が必要になります。register_setting, add_settings_sectionとadd_settings_fieldこれらの関数を使用してオプションを定義し保存することで、プラグインのインタラクティビティの基盤が構築されます。
プラグインにスタイルとスクリプトを追加する。
プロフェッショナルなプラグインは、機能が優れているだけでなく、外観も適切でなければなりません。CSSやJavaScriptファイルを正しい方法で読み込む必要があり、テーマや他のプラグインとの衝突を避けなければなりません。
推薦図書 高品質なWordPressプラグインを選択し、開発する方法：入門から上級者までのガイド。
フロントエンドリソースを安全に登録し、読み込む
WordPressは以下のような機能を提供しています：wp_enqueue_styleとwp_enqueue_script関数を使用してリソースを安全に追加するべきです。wp_enqueue_scriptsアクションフックを使用してそれらを読み込みます。
/**
* 注册并加载插件的前端样式和脚本
*/
function mfp_enqueue_public_assets() {
// 获取插件URL
$plugin_url = plugin_dir_url( __FILE__ );
// 注册并排队样式表
wp_enqueue_style(
'mfp-public-style',
$plugin_url . 'assets/css/mfp-public.css',
array(),
'1.0.0'
);
// 注册并排队JavaScript文件（示例）
wp_enqueue_script(
'mfp-public-script',
$plugin_url . 'assets/js/mfp-public.js',
array('jquery'), // 依赖jQuery
'1.0.0',
true // 在页脚加载
);
}
add_action( 'wp_enqueue_scripts', 'mfp_enqueue_public_assets' );まず、プラグインのディレクトリ内にファイルを作成する必要があります。assets/css/mfp-public.cssファイルを使用して、以前に作成したプロンプトボックスを美しく見せるためのスタイルを追加することができます。
/* assets/css/mfp-public.css */
.mfp-notice {
background-color: #f0f8ff;
border-left: 4px solid #3498db;
padding: 15px;
margin: 20px 0;
border-radius: 5px;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, sans-serif;
}
.mfp-notice p {
margin: 0;
color: #2c3e50;
}バックグラウンドリソースの読み込み
バックエンドリソースの登録方法も似ていますが、使用されているフック（hook）は異なります。admin_enqueue_scripts現在のページがあなたのプラグインの設定ページであるかどうかを判断するには、特定の条件をチェックする必要があります。例えば、ページのURLに特定のパラメータが含まれているか、ページのタイトルや内容から判断するなどです。具体的な方法は、使用しているプラグインのドキュメントやソースコードを参照してください。get_current_screen()関数を使用してリソースを選択的に読み込むことで、不必要なパフォーマンスコストを避けることができます。
概要
シンプルなプラグインのヘッダー情報の定義から始め、WordPressの強力なフックシステム（アクションとフィルター）を利用してウェブサイトのコンテンツや構造を動的に変更し、スタイルやスクリプトリソースを専門的に管理するまで、あなたは最初の機能付きプラグインを構築するための全てのプロセスを経験しました。その鍵は、WordPressの開発規格を理解し、それに従うことにあります。つまり、コア部分を直接変更するのではなくフックを使用し、リソースを正しく登録・処理し、明確なファイル構造を作成することです。これはプラグイン開発の始まりに過ぎません。次に、ショートコードの作成、カスタム記事タイプ（CPT）の設定、データベースとのやり取り、REST APIエンドポイントの構築、プラグインの国際化など、より高度な機能を探求することで、あなたのプラグインをより強力でユーザーフレンドリーなものにすることができます。
FAQ よくある質問
WordPressプラグインを開発するには、どのような前提知識が必要ですか？
PHPの基本的なプログラミングスキルが必要です。これには、関数、条件文、ループ、配列の操作の理解が含まれます。また、HTML、CSS、そして少しのJavaScriptについても知識があると非常に役立ちます。特に、フロントエンドのインターフェースを修正する必要がある場合にはそうです。最も重要なのは、WordPressの基本的な仕組みを理解することです。例えば、テンプレートの階層構造、メインループ、データベースの基本構造などです。
私のWordPressプラグインをどのようにデバッグすればいいのでしょうか？
WordPressを有効にするWP_DEBUGパターンはデバッグの最初のステップです。あなたのサイトのルートディレクトリにあるwp-config.phpファイル内で設定を行います。define( 'WP_DEBUG', true );これにより、PHPのエラーや警告が画面に表示されるとともに、ログにも記録されます。wp-content/debug.logファイルの中にあります。また、ブラウザの開発者ツールにある「Console（コンソール）」および「Network（ネットワーク）」パネルを使用すると、JavaScriptやAjaxリクエストのデバッグが容易になります。複雑なロジックについては、それらのツールを活用するとよいでしょう。error_log()関数や専用のデバッグプラグインによって、変数の情報がログに出力されます。
私のプラグインに設定可能なオプションを追加するには、どのようにすればよいでしょうか？
プラグインに設定オプションを追加する標準的な方法は、WordPressの設定APIを使用することです。これには一連の関数が関与します：register_setting()設定オプショングループを登録し、それをデータベースに安全に保存するためのものです。add_settings_section()あなたの設定ページに新しいセクションを追加してください。add_settings_field()ブロック内に具体的なフォームフィールド（入力ボックス、ドロップダウンメニューなど）を追加してください。設定ページのコールバック関数には、これらのフォームフィールドに関連する処理を記述する必要があります。settings_fields()とdo_settings_sections()の呼び出しにより、フォームを正しく生成し、検証することができます。
どうすれば、自分のプラグインが他のプラグインやテーマと衝突しないようにできるでしょうか？
ベストプラクティスに従うことが、コンフリクトを避けるための鍵です。すべての関数、クラス、定数、アクション/フィルターの名前、およびHTMLのCSSクラスには、一意なプレフィックスや名前空間を付けてください。例えば、次のようにします：myplugin_function_nameこのような関数名だけでなく、他にも…function_name使用方法：wp_enqueue_styleとwp_enqueue_scriptリソースを読み込み、スタイルやスクリプトのハンドルが一意であることを確認してください。可能であれば、コードをクラス内にまとめて、変数や関数をさらに分離しましょう。
開発が完了したら、どのようにして自分のプラグインを公開するのでしょうか？
もしプラグインをWordPressの公式プラグインディレクトリに提出したい場合は、そのプラグインがWordPressのコーディング基準およびGPLライセンスを完全に遵守していることを確認する必要があります。WordPress.orgのアカウントを登録し、プラグインを提出して審査を受ける必要があります。審査チームはコードの安全性、機能性、ドキュメントをチェックします。提出する前に、必ず公式のプラグイン開発マニュアルと提出ガイドをよく読んでください。商用プラグインの場合は、自分のウェブサイトや第三者のマーケットを通じて配布することもできます。
次はどうする？
拡大読書と実践的知識
以下は、この記事のトピックに関連しており、さらに深く読むのに適している。あなたの現在の問題に最も近い記事から優先順位をつけ、徐々に周辺のトピックに広げていく方が良い場合が多い。
日本語