準備作業と環境設定
コードの作成を始める前に、適切な開発環境が必要です。これには、ローカルにインストールされたWordPress、コードエディタ、そして基本的なPHPの知識が含まれます。ローカル開発環境としては、XAMPP、MAMP、Local by Flywheelなどのツールが推奨されます。これらのツールを使用すると、PHPとMySQLを備えたサーバー環境を簡単にローカルコンピュータ上に構築することができます。
プラグインを作成するための基本ディレクトリとファイルを作成します。
すべてのWordPressプラグインには、プラグインの入口点となるメインファイルが必要です。まず、WordPress内で… wp-content/plugins ディレクトリ内に新しいフォルダを作成します。例えば: my-first-pluginその後、そのフォルダ内にメインのPHPファイルを作成します。このファイルの名前は通常、フォルダの名前と同じになります。 my-first-plugin.php。
このメインファイルの冒頭には、標準的なプラグイン情報を記載したヘッダーアノテーションを含める必要があります。WordPressはこれらの情報を読み取ることで、バックエンドの管理インターフェース内であなたのプラグインを識別し、表示します。
推薦図書 ゼロからワンへ:WordPressプラグイン開発の核心技術をマスターするための手順。
<?php
/**
* Plugin Name: 我的第一个插件
* Plugin URI: https://example.com/my-first-plugin
* Description: 这是一个用于学习 WordPress 插件开发的示例插件。
* Version: 1.0.0
* Author: 你的名字
* Author URI: https://example.com
* License: GPL v2 or later
* Text Domain: my-first-plugin
* Domain Path: /languages
*/ WordPressプラグイン開発の基本的な構造を理解する
機能が完全なプラグインは通常、1つのファイルだけで構成されていません。メインファイルの他に、JavaScriptファイル、CSSファイル、画像などのリソースファイル、そして国際化のための言語ファイルも存在することがあります。適切なディレクトリ構造は、コードの整理と保守を容易にします。
推奨される構造は以下の通りです:
- my-first-plugin/ (プラグインのルートディレクトリ)
- my-first-plugin.php (メインファイル)
- includes/ (コア機能クラスや関数のファイルが格納されている場所)
- admin/ (バックエンド管理インターフェースに関連するコードが保存されています)
- public/ (フロントエンドの表示に関連するコードが保存されています)
- assets/ (CSS、JavaScript、画像などのリソースを保存する場所)
- languages/ (国際化翻訳ファイルの保存場所)
コアPHPコードの作成
プラグインのすべての機能ロジックはPHPコードによって実現されています。WordPressは多数のプラグインを提供しています。动作钩子と过滤器钩子これは、プラグインがWordPressのコアと相互作用するための基盤となるものです。
シンプルなショートコード機能を実装しましょう。
ショートコードとは、ユーザーが記事やページにプラグインの機能を簡単に組み込むための強力なツールです。ここでは、ページ上に挨拶文を表示するという簡単なショートコードを実装してみましょう。
あなたのメインファイルの中で my-first-plugin.php ヘッダーのコメントの下に、以下の関数とフックを追加してください:
推薦図書 WordPressプラグイン開発の徹底解説:ゼロから始めて、あなたの最初の機能拡張を構築する。
// 注册短代码
function mfp_greeting_shortcode( $atts ) {
// 使用 shortcode_atts 设置默认参数并合并用户传入的参数
$atts = shortcode_atts( array(
'name' => '访客',
), $atts, 'mfp_greeting' );
// 返回要显示的内容
return '<p>こんにちは、' . esc_html($atts['name']) . '!私の最初のプラグインをお使いいただき、ありがとうございます。</p>'コードを追加するには:
php-code-snippets.js
function mfp_greeting_shortcode(atts) {
return 'こんにちは';
}
add_shortcode( 'mfp_greeting', 'mfp_greeting_shortcode' ); 現在、ユーザーは記事編集器にテキストを入力することができます。 [mfp_greeting name=“小明”]その場合、フロントエンドには「こんにちは、小明!私の最初のプラグインをご利用いただきありがとうございます。」と表示されます。“
バックエンドに設定オプションを追加します。
プラグインの機能を設定可能にするためには、通常、設定ページを追加する必要があります。ここでは、「設定」メニューにサブメニューページを追加する方法をデモンストレーションします。
まず、私たちは以下の方法を使用します: add_action フックは、管理者がシステムを初期化する際に設定として登録されます。
// 初始化插件设置
function mfp_settings_init() {
// 注册一个新的设置 section
add_settings_section(
'mfp_settings_section', // section ID
'我的插件设置', // 标题
'mfp_settings_section_callback', // 回调函数,用于输出 section 描述
'general' // 显示在哪个设置页,这里是“常规”设置页
);
// 在 section 内注册一个字段
add_settings_field(
'mfp_default_greeting', // 字段 ID
'默认问候人名', // 字段标题
'mfp_default_greeting_callback', // 渲染字段输入框的回调函数
'general', // 设置页面
'mfp_settings_section' // 所属 section
);
// 在 WordPress 的 `option` 表中注册这个设置
register_setting( 'general', 'mfp_default_greeting' );
}
add_action( 'admin_init', 'mfp_settings_init' ); その後、上で使用した2つのコールバック関数を定義し、インターフェースをレンダリングします。
// Section 描述的回调函数
function mfp_settings_section_callback() {
echo '<p>ここで、私の最初のプラグインに関連するオプションを設定します。</p>';
}
// 字段输入框的回调函数
function mfp_default_greeting_callback() {
// 从数据库获取已保存的值,如果没有则使用默认值
$option = get_option( 'mfp_default_greeting', 'WordPress 用户' );
// 输出一个输入框
echo '<input type="text" name="mfp_default_greeting" value="' . esc_attr( $option ) . '" />';
} 現在、WordPressの管理画面(バックエンド)の「設定 → 一般」ページの下部にこの設定オプションが表示されています。
フロントエンドリソースの管理とAjaxとのインタラクション
現代のプラグインでは、通常、独自のスタイルやインタラクションロジックが必要とされます。WordPressでは、CSSやJavaScriptファイルを安全に登録し、読み込むための標準的な方法が提供されています。
推薦図書 ゼロから始める:なぜWordPressプラグイン開発を選ぶのか。
CSSおよびJavaScriptを安全に読み込む方法
絶対に、PHPファイル内で直接そのような処理を行ってはいけません。 <link> または <script> タグ内でリソースパスをハードコードするのは避けるべきです。代わりに、動的にリソースパスを取得する方法を使用するべきです。 wp_enqueue_style と wp_enqueue_script 関数。
// 注册并加载前端资源
function mfp_enqueue_public_assets() {
// 加载一个 CSS 文件
wp_enqueue_style(
'mfp-public-style', // 样式表句柄
plugin_dir_url( __FILE__ ) . 'assets/css/public-style.css', // 样式表 URL
array(), // 依赖项
'1.0.0' // 版本号,可用于清除缓存
);
// 加载一个 JavaScript 文件
wp_enqueue_script(
'mfp-public-script', // 脚本句柄
plugin_dir_url( __FILE__ ) . 'assets/js/public-script.js', // 脚本 URL
array( 'jquery' ), // 依赖项,这里依赖 jQuery
'1.0.0',
true // 是否在页面底部加载
);
// 重要:将 PHP 变量安全地传递到 JavaScript
wp_localize_script(
'mfp-public-script',
'mfp_ajax_object', // 在 JS 中访问的对象名
array(
'ajax_url' => admin_url( 'admin-ajax.php' ),
'nonce' => wp_create_nonce( 'mfp_ajax_nonce' ),
'default_name' => get_option( 'mfp_default_greeting', 'WordPress 用户' )
)
);
}
// 在前端页面加载资源
add_action( 'wp_enqueue_scripts', 'mfp_enqueue_public_assets' );
// 在后台管理页面加载资源(如果需要)
// add_action( 'admin_enqueue_scripts', 'mfp_enqueue_admin_assets' ); 实现一个简单的 Ajax 请求
Ajaxにより、ページを更新することなくサーバーとやり取りを行うことができます。WordPressには内蔵のAjax処理機能があります。
まず、フロントエンドのJavaScriptファイルにおいて… public-script.js リクエストを送信します:
jQuery(document).ready(function($) {
$('#my-button').on('click', function(e) {
e.preventDefault();
$.post(
mfp_ajax_object.ajax_url, // WordPress 提供的 Ajax URL
{
action: 'mfp_get_server_time', // 触发的 PHP 钩子标识
nonce: mfp_ajax_object.nonce, // 安全随机数
},
function(response) {
if (response.success) {
$('#result-container').html('服务器时间:' + response.data);
} else {
alert('请求失败:' + response.data);
}
}
);
});
}); その後、PHP側でこのリクエストを処理します。ログインしているユーザーとログインしていないユーザーのために、それぞれ別々の(または同時に)登録処理関数を用意する必要があります。
// 处理 Ajax 请求的函数
function mfp_ajax_get_server_time() {
// 验证 nonce,防止 CSRF 攻击
check_ajax_referer( 'mfp_ajax_nonce', 'nonce' );
// 处理逻辑
$server_time = current_time( 'mysql' );
// 返回成功响应(JSON 格式)
wp_send_json_success( $server_time );
}
// 为登录用户注册处理函数
add_action( 'wp_ajax_mfp_get_server_time', 'mfp_ajax_get_server_time' );
// 为未登录用户注册处理函数(如果功能允许)
add_action( 'wp_ajax_nopriv_mfp_get_server_time', 'mfp_ajax_get_server_time' ); プラグインの国際化と公開準備
あなたのプラグインを世界中のWordPressユーザーが利用できるようにするためには、国際化(i18n)は欠かせないステップです。また、公開する前に十分なテストと最適化を行うことも非常に重要です。
gettext関数を使用してテキストの翻訳を実現します。
WordPress は GNU gettext フレームワークを使用して翻訳を行っています。ユーザーに表示されるすべてのテキストは、指定された関数を使用してラップする必要があります。
以前の短いコード関数を修正し、翻訳機能をサポートするようにしましょう。
function mfp_greeting_shortcode_i18n( $atts ) {
$atts = shortcode_atts( array(
'name' => __( '访客', 'my-first-plugin' ), // 默认值也可翻译
), $atts, 'mfp_greeting' );
// 使用 sprintf 和 __ 函数组合翻译字符串
return '<p>' . sprintf( __( '你好,%s!欢迎使用我的第一个插件。', 'my-first-plugin' ), esc_html( $atts['name'] ) ) . '</p>'php
add_shortcode('mfp_greeting', 'mfp_greeting_shortcode_i18n'); Poeditなどのツールを使用して、プラグイン内にあるすべての類似のコードをスキャンする必要があります。 __(‘文本’, ‘my-first-plugin’) の文字列を生成します。 .pot テンプレートファイルを用意し、その後、中国語などの各言語ごとに対応するファイルを作成します。 .po そしてコンパイル後の .mo そのファイルを取り出し、適切な場所に置いてください。 /languages カタログ
最終テストを実施し、コードを整理します。
プラグインを公開する前に、必ず以下のチェックを行ってください:
1. 機能テスト:新しくインストールしたWordPressサイトでプラグインを有効にし、すべての機能(ショートコード、設定、Ajaxなど)が期待通りに動作するかをテストします。
2. コードレビュー:すべてのユーザー入力が適切に処理されているかを確認する esc_html, esc_attr, wp_kses_post これらの関数を使用して安全にエスケープ処理を行います。すべてのデータベースクエリでこれらの関数が使用されていますか? $wpdb クラス内で準備文を実行することで、SQLインジェクションを防ぐことができます。
3. パフォーマンスチェック:スクリプトやスタイルが必要なページのみでロードされるようにする(条件付きタグなどを使用するとよい)。 is_admin(), is_single() (判断を行う)。ページが読み込まれるたびに不必要なデータベースクエリを実行するのを避けてください。
4. ファイルの整理:開発過程で使用されたデバッグコード、不要なコメント、および未使用のファイルを削除します。
5. README ファイル:詳細な内容を記載した README ファイルを作成してください。 readme.txt このファイルは、WordPress.orgの要件に準拠した形式でなければなりません。ファイルには、プラグインの説明、インストール手順、よくある質問などが含まれています。これは、プラグインを公式のディレクトリに提出するために必要なファイルです。
概要
通过本指南,你完成了从一个空白文件到构建一个具备短代码、后台设置、前端资源加载、Ajax交互及国际化支持的完整 WordPress 插件的旅程。核心步骤包括:搭建环境并创建带有标准头部的主文件;利用动作钩子和过滤器钩子注入功能;安全地管理资源文件;实现前后端异步通信;以及为全球发布做好翻译和测试准备。记住,安全(转义、验证、nonce)、性能(按需加载)和标准(遵循 WordPress 编码规范)是开发高质量插件的三大支柱。持续学习和实践更高级的 API,如自定义文章类型、REST API 和 Blocks 编辑器开发,将使你的插件更加强大。
FAQ よくある質問
プラグイン開発にはオブジェクト指向プログラミングを使用しなければならないのでしょうか?
必ずしもそうとは限りません。シンプルなプラグインの場合は、プロセス指向のプログラミング(一連の関数)を使用することも完全に可能であり、よりシンプルで直感的な方法です。しかし、中規模から大規模な複雑なプラグインにおいては、オブジェクト指向プログラミング(OOP)やクラス構造を採用することでコードをより効果的に整理し、カプセル化や再利用を実現でき、名前の衝突を減らすことができるため、より推奨される方法です。
WordPressプラグイン内の問題をデバッグする方法
まず、確認してください。 wp-config.php ファイルを開く WP_DEBUG と WP_DEBUG_LOG 「定数を使用することで、エラーメッセージが記録されるようになります。」 /wp-content/debug.log そのファイルはユーザーには表示されません。次に、以下の方法を使用することができます: error_log() 関数が変数の値をログに出力します。Ajaxや複雑なロジックの場合、ブラウザの開発者ツールにある「ネットワーク」および「コンソール」パネルは非常に重要なデバッグツールです。
私のプラグインは、テーマや他のプラグインとどのように互換性を持たせることができるのでしょうか?
コンパチビリティを維持するための最善の慣行は、WordPressの公式APIおよびコーディングスタンダードを厳格に遵守することです。また、作成する関数、クラス、アクションフックの名前には一意なプレフィックス(例:`prefix_`)を付けることをお勧めします。 mfp_)衝突を避けるために、どんなグローバル変数や関数を使用する前に、それらが存在するかを確認してください(使用方法は以下の通りです)。 function_exists() または class_exists());そして、ドキュメント内で明確に説明してください。あなたが作成したプラグインによって生成されたデータベースのテーブルについて。选项または 用户元数据。
WordPress.org のディレクトリにプラグインを提出するには、どのような条件が必要ですか?
你需要拥有一个 WordPress.org 账号,并确保插件完全符合官方的要求。这包括:代码符合 GPL 兼容许可证(通常就是 GPLv2+);插件必须 100% 开源且不依赖外部付费服务才能运行核心功能;包含标准格式的 readme.txt ファイル内には悪意のあるコードや不要なデータは含まれておらず、また人の目による審査も受けています。提出する前に、公式のプラグイン開発マニュアルおよび提出ガイドラインをよくお読みください。
次はどうする?
拡大読書と実践的知識
以下は、この記事のトピックに関連しており、さらに深く読むのに適している。あなたの現在の問題に最も近い記事から優先順位をつけ、徐々に周辺のトピックに広げていく方が良い場合が多い。