WordPress 插件开发入门指南:从零开始创建你的第一个插件

3 分钟阅读时间
2026-03-13
2026-06-03
2,076
通过下方链接进行购物时,您无需支付额外费用,我就能获得佣金。.

准备工作与环境搭建

在開始編寫程式碼之前,你需要確保擁有一個合適的開發環境。這包括一個本地的 WordPress 安裝和一個程式碼編輯器。本地環境可以讓你在不影響線上網站的情況下自由測試和除錯。常用的本地開發環境軟體有 Local by Flywheel、XAMPP 或 MAMP。

你需要為你的外掛想一個唯一的名稱,這個名稱將被用作外掛的主目錄名和主檔名。例如,如果你的外掛叫做“Hello World”,那麼你的主外掛檔案可以命名為 hello-world.php。確保你的外掛名稱和描述在 WordPress 外掛目錄中是獨一無二的,這能有效避免與其他外掛衝突。

此外,熟悉 WordPress 的官方開發手冊和程式碼參考是至關重要的。瞭解 WordPress 的核心概念,如動作鉤子(Action Hooks)、過濾器鉤子(Filter Hooks)、短程式碼(Shortcodes)和設定 API,將為你的開發奠定堅實基礎。

推荐阅读 WordPress外掛開發全攻略:從零開始打造專業的PHP外掛

建立第一個外掛檔案

外掛的核心是一個或多個 PHP 檔案。最簡單的情況下,一個外掛可以只由一個 PHP 檔案構成。為了建立一個有效的外掛,你需要在主外掛檔案的頭部新增標準的外掛資訊註釋。這個註釋塊會告訴 WordPress 關於你的外掛的所有元資訊,如名稱、描述、版本、作者等。

UltaHost WordPress 主機
30天退款保證,無限頻寬與資料庫,免費的 DDoS 防護,購買3年優惠50%

編寫外掛頭部資訊

WordPress 透過讀取檔案頂部的特定格式的註釋來識別和顯示外掛資訊。下面是一個最基本的外掛頭部示例:

<?php
/**
 * Plugin Name:       我的第一个插件
 * Plugin URI:        https://example.com/my-first-plugin
 * Description:       这是一个用于学习和演示的简单 WordPress 插件。
 * Version:           1.0.0
 * Requires at least: 5.2
 * Requires PHP:      7.2
 * Author:            你的名字
 * Author URI:        https://example.com
 * License:           GPL v2 or later
 * Text Domain:       my-first-plugin
 * Domain Path:       /languages
 */

將這段程式碼儲存為一個新的 PHP 檔案,例如 my-first-plugin.php。然後,將這個檔案放入你本地 WordPress 安裝目錄的 wp-content/plugins 資料夾中。此時,進入 WordPress 後臺的“外掛”頁面,你應該能看到一個名為“我的第一個外掛”的新外掛出現在列表中,並可以啟用它。目前它還沒有任何功能。

為外掛新增基礎功能

啟用外掛後,我們將為其新增一個簡單的功能:在文章內容的末尾自動新增一段自定義文字。這需要用到 WordPress 的過濾器鉤子 the_content

你可以將以下程式碼新增到剛才的外掛頭部資訊下方:

推荐阅读 零基础入门:WordPress插件开发全流程详解

/**
 * 在文章内容末尾添加自定义文本
 *
 * @param string $content 当前文章内容。
 * @return string 修改后的文章内容。
 */
function mfp_add_footer_text( $content ) {
    // 仅针对主循环中的单个文章页面
    if ( is_single() && in_the_loop() && is_main_query() ) {
        $custom_text = '<p><em>感谢您阅读这篇文章,由“我的第一个插件”呈现。</em></p>';
        $content .= $custom_text;
    }
    return $content;
}
// 将自定义函数挂载到 `the_content` 过滤器上
add_filter( 'the_content', 'mfp_add_footer_text' );

這段程式碼定義了一個名為 mfp_add_footer_text 的函式,它接收文章內容 $content 作為引數。函式內部首先使用條件標籤(is_single(), in_the_loop(), is_main_query())來確保我們只在單個文章頁面的主迴圈中修改內容,避免影響其他頁面如首頁、存檔頁。然後,它建立一段自定義的 HTML 文字,並將其附加到原文內容之後。最後,透過 add_filter 函式將這個自定義函式“掛載”到 WordPress 的 the_content 過濾器上。

儲存檔案後,重新整理前端的一篇文章頁面,你將在文章正文的末尾看到新增的文字。

開發進階功能:建立管理選單與選項頁

一個功能完善的外掛通常需要與管理員互動,這通常透過在後端新增設定頁面來實現。WordPress 提供了豐富的 API 來建立管理選單和選項頁。

hostng.com 共享主机
高效能,配备 AMD EPYC CPU、NVMe SSD 存储和 LiteSpeed,全天候 24 小时专业内部支持,先进的安全措施包括 SSL、暴力破解、恶意软件和 DDoS 防护,节省高达 731 TB/月的带宽成本。

在後臺新增外掛選單項

我們將為外掛建立一個獨立的管理選單頁面,用於配置一些選項。這需要使用 add_action 鉤子和 admin_menu 動作。

在你的外掛主檔案中繼續新增以下程式碼:

/**
 * 在 WordPress 后台管理菜单中添加一个新的顶级菜单项
 */
function mfp_register_admin_menu() {
    add_menu_page(
        '我的插件设置',          // 页面标题
        '我的插件',             // 菜单标题
        'manage_options',       // 所需权限
        'my-first-plugin',      // 菜单 slug
        'mfp_render_settings_page', // 渲染页面的回调函数
        'dashicons-admin-plugins', // 图标(可选)
        80                      // 菜单位置
    );
}
add_action( 'admin_menu', 'mfp_register_admin_menu' );

add_menu_page 函式用於註冊一個新的頂級選單。其中,manage_options 是一個許可權標識,意味著只有具有“管理選項”許可權的使用者(通常是管理員)才能看到這個選單。mfp_render_settings_page 是我們接下來要定義的、用於輸出設定頁面 HTML 內容的函式名。

推荐阅读 WordPress 外掛開發終極指南:從零構建你的第一個自定義外掛

構建設定頁面的內容

現在,我們需要定義上面提到的回撥函式 mfp_render_settings_page 來渲染一個簡單的設定頁面。

/**
 * 渲染插件设置页面的内容
 */
function mfp_render_settings_page() {
    ?>
    <div class="wrap">
        <h1></h1>
        <form action="/zh-tw/options.php/" method="post" data-trp-original-action="options.php">
            <?php
            // 输出设置字段、安全 nonce 字段等
            settings_fields( 'mfp_settings_group' );
            do_settings_sections( 'my-first-plugin' );
            submit_button( '保存设置' );
            ?>
        <input type="hidden" name="trp-form-language" value="zh-tw"/></form>
    </div>
    &lt;?php
}

這個函式輸出了一個基本的 WordPress 管理頁面結構,包含標題和一個表單。它使用了 WordPress 設定 API 的兩個核心函式:settings_fields 以及 do_settings_sections。為了使其工作,我們還需要註冊設定、節和欄位。

InterServer 共享主机
虚拟主机的月费为1TB+5TB,价格为2.50美元。首月优惠价为1TB+5TB,价格为0.1美元。优惠码为"tryinterserver"。平台提供461个云应用脚本,一键安装便捷。

使用設定 API 註冊選項

WordPress 設定 API 提供了一種安全、標準化的方式來處理表單選項的註冊、儲存和驗證。我們繼續新增以下程式碼來註冊一個簡單的文字欄位。

/**
 * 初始化插件的设置
 */
function mfp_settings_init() {
    // 注册一个新的设置项 `mfp_options` 到数据库
    register_setting( 'mfp_settings_group', 'mfp_options' );

// 在页面内添加一个新的节
    add_settings_section(
        'mfp_section_basic',
        '基础设置',
        'mfp_section_basic_callback',
        'my-first-plugin'
    );

// 向节中添加一个字段
    add_settings_field(
        'mfp_field_custom_text',
        '自定义页脚文本',
        'mfp_field_custom_text_callback',
        'my-first-plugin',
        'mfp_section_basic',
        array( 'label_for' => 'mfp_field_custom_text' )
    );
}
add_action( 'admin_init', 'mfp_settings_init' );

/**
 * 节描述的回调函数(可以为空)
 */
function mfp_section_basic_callback() {
    echo '<p>在这里配置插件的基础选项。</p>';
}

/**
 * 字段 `mfp_field_custom_text` 的回调函数,用于输出 HTML 输入框
 */
function mfp_field_custom_text_callback() {
    // 从数据库获取现有值
    $options = get_option( 'mfp_options' );
    $value = isset( $options['custom_text'] ) ? $options['custom_text'] : '';
    ?>
    <input type="text"
           id="mfp_field_custom_text"
           name="mfp_options[custom_text]"
           value="<?php echo esc_attr( $value ); ?>"
           class="regular-text" />
    <p class="description">这段文字将显示在文章末尾。</p>
    &lt;?php
}

現在,我們需要修改之前的 mfp_add_footer_text 函式,讓它使用我們新建立的選項值,而不是硬編碼的文字。

function mfp_add_footer_text( $content ) {
    if ( is_single() &amp;&amp; in_the_loop() &amp;&amp; is_main_query() ) {
        $options = get_option( 'mfp_options' );
        $custom_text = isset( $options['custom_text'] ) ? $options['custom_text'] : '';
        if ( ! empty( $custom_text ) ) {
            $content .= '<p><em>'您好,欢迎访问我们的网站!如果您有任何疑问或需要帮助,请随时联系我们。感谢您的光临!'</em></p>';
        }
    }
    return $content;
}

至此,你的外掛擁有了一個完整的後臺設定頁面。管理員可以在“我的外掛”選單下找到設定頁,輸入自定義的頁尾文字,並儲存。這個文字將動態地顯示在網站前端的文章末尾。

外掛最佳化與安全實踐

開發外掛時,遵循最佳實踐對於安全性、效能和維護性至關重要。這裡介紹幾個核心原則。

確保程式碼安全

所有從前端或管理介面接收到的資料,在輸出到瀏覽器或存入資料庫之前,都必須進行驗證、清理和轉義。這可以防止跨站指令碼(XSS)和 SQL 注入等安全漏洞。

  • 轉義輸出:使用函式如 esc_html(), esc_attr(), esc_url(), wp_kses_post() 來轉義動態內容。
  • 清理輸入:使用函式如 sanitize_text_field(), sanitize_email(), intval() 來處理使用者提交的表單資料。
  • 許可權檢查:在管理員回撥函式中,使用 current_user_can() 進行二次許可權確認。在涉及資料修改的 AJAX 或 REST API 端點,務必使用 nonce(數字令牌)進行驗證。

遵循 WordPress 編碼標準

採用 WordPress 編碼標準可以確保你的程式碼風格與核心程式碼一致,提高可讀性,並方便其他開發者協作。這包括使用正確的縮排、括號風格、命名約定(函式和變數使用小寫字母加下劃線)等。你可以使用 PHP CodeSniffer 配合 WordPress 標準規則來自動檢查程式碼。

实现国际化支持

從一開始就為你的外掛新增國際化支援,可以讓全世界的使用者輕鬆地將其翻譯成自己的語言。這主要透過以下步驟實現:
1. 在外掛頭部註釋中正確設定 Text Domain 以及 Domain Path
2. 在所有需要翻譯的字串周圍使用 WordPress 的翻譯函式,如 (), _e(), esc_html() 等等。
3. 使用工具如 Poedit 來生成 .pot 模板檔案,供翻譯者建立 .po 以及 .mo 翻譯檔案。

例如,將設定頁的描述文字國際化:

function mfp_section_basic_callback() {
    echo '<p>' . esc_html__( '在这里配置插件的基础选项。', 'my-first-plugin' ) . '</p>';
}

总结

本文從零開始,引導你完成了建立一個基礎但功能完整的 WordPress 外掛的全過程。我們涵蓋了從環境準備、建立外掛檔案、編寫外掛頭部資訊,到使用動作鉤子和過濾器鉤子為文章新增內容,再到使用 WordPress 設定 API 構建複雜的後臺管理介面。最後,我們探討了外掛開發中至關重要的安全、編碼標準和國際化等最佳化實踐。

透過這個實踐,你應該已經掌握了 WordPress 外掛開發的核心流程和基本工具。下一步,你可以嘗試開發更復雜的功能,如建立自定義文章型別、自定義資料庫表、使用 jQuery 增強互動,或者將你的外掛提交到 WordPress 官方外掛目錄。記住,持續學習和閱讀核心程式碼是提升開發技能的最佳途徑。

常见问题解答(FAQ)

如何除錯我的 WordPress 外掛?

啟用 WordPress 的除錯模式是首要步驟。在你的 wp-config.php 文件中,将 WP_DEBUG 常量被设置为 true。這將直接在頁面上顯示 PHP 錯誤、警告和通知。

同時,可以使用 error_log() 函式將自定義除錯資訊寫入伺服器的錯誤日誌,或者使用瀏覽器的開發者工具(控制檯和網路選項卡)來除錯 JavaScript 和 AJAX 請求。對於複雜的邏輯,使用如 Xdebug 等專業除錯工具會事半功倍。

我的外掛會和主題或其他外掛衝突嗎?

有可能,尤其是在處理相同的鉤子、使用通用的全域性變數名或類名時。為了最大程度減少衝突,請務必為你的所有函式、類、變數和選項名新增唯一的字首。例如,不要使用 add_footer_text,而是使用類似 myplugin_add_footer_text 的名稱。

在修改全域性內容(如查詢變數)之前,進行充分的檢查和條件限制。在釋出前,儘可能多地在不同環境和不同主題組合下測試你的外掛。

我需要學習哪些技術來開發高階外掛?

除了紮實的 PHP 基礎,你還需要深入瞭解:
- JavaScript:用於前端互動和 WordPress 定製器開發。
- jQuery:儘管 WordPress 正在向現代 JS 框架過渡,但 jQuery 仍被廣泛使用。
- REST API:用於建立解耦的前端應用或與外部服務互動。
- 資料庫知識:瞭解 WordPress 的資料庫結構,以及如何安全地進行自定義查詢或建立新表。
- Composer:用於管理 PHP 依賴包。
- 構建工具:如 Webpack,用於管理現代 JavaScript 和 SASS 的編譯。

如何將我的外掛釋出到 WordPress 官方目錄?

首先,確保你的外掛完全符合官方的外掛開發指南和安全最佳實踐。你需要一個 WordPress.org 賬號。在賬號下提交你的外掛壓縮包進行稽核。稽核過程會檢查程式碼質量、安全性、許可證(必須是 GPL 相容)等。

如果你的外掛透過稽核,它將被新增到 SVN 倉庫中,你可以透過 SVN 來更新和維護你的外掛。釋出後,使用者就可以直接在他們的 WordPress 後臺搜尋、安裝和更新你的外掛了。