Hướng dẫn nhập môn phát triển plugin WordPress: Xây dựng tiện ích mở rộng đầu tiên của bạn từ con số không

Tại sao nên chọn phát triển plugin cho WordPress?

WordPress, với tư cách là hệ thống quản lý nội dung (CMS) phổ biến nhất trên thế giới, sở hữu khả năng mở rộng mạnh mẽ nhờ vào cấu trúc plugin của mình. Việc tự phát triển plugin cho phép bạn thoát khỏi những hạn chế của các plugin có sẵn, từ đó đáp ứng chính xác những nhu cầu cụ thể của trang web hoặc khách hàng. Dù là thêm một đoạn mã ngắn (short code) đơn giản hay xây dựng một bảng điều khiển quản lý phức tạp, plugin đều giúp tách biệt logic chức năng khỏi giao diện trang web (theme), đảm bảo rằng các chức năng vẫn hoạt động bình thường ngay cả khi theme được cập nhật.

Từ góc độ học tập, việc hiểu rõ về quá trình phát triển plugin là con đường bắt buộc để bạn có thể hiểu sâu hơn về cốt lõi của WordPress. Qua đó, bạn sẽ tiếp xúc với hai khái niệm cốt lõi là Action Hooks và Filter Hooks – những công cụ giúp WordPress thực hiện tính mô-đun hóa và khả năng mở rộng. Việc nắm vững kỹ năng phát triển plugin không chỉ giúp bạn nâng cao năng lực kỹ thuật mà còn mở ra nhiều cơ hội nghề nghiệp mới, thậm chí có thể giúp bạn tạo ra những sản phẩm số có thể được bán trên thị trường.

Các công việc chuẩn bị trước khi phát triển

Trước khi bắt đầu viết dòng code đầu tiên, bạn cần một môi trường phát triển phù hợp. Môi trường này thường bao gồm một máy chủ cục bộ (như Local by Flywheel, XAMPP hoặc MAMP), một trình soạn thảo mã (như VS Code, PhpStorm), và một trang web thử nghiệm đã cài đặt WordPress. Hãy đảm bảo rằng phiên bản PHP trong môi trường thử nghiệm của bạn tương đồng với phiên bản PHP được sử dụng trên môi trường sản xuất trực tuyến, để tránh các vấn đề về tương thích.

Đọc thêm Nắm vững kỹ năng cốt lõi của WordPress: Hướng dẫn thực hành toàn diện từ thiết lập đến tối ưu hóa。

Hiểu cấu trúc cơ bản của plugin

Một plugin WordPress cơ bản nhất có thể chỉ chứa một tệp PHP duy nhất. Tuy nhiên, một plugin được thiết kế tốt thường bao gồm nhiều thư mục và tệp khác nhau để đảm bảo tính tổ chức tốt hơn. Cấu trúc thông thường của một thư mục plugin có thể bao gồm các phần sau:
– Tệp tin plugin chính (ví dụ:…) my-first-plugin.phpĐây là điểm nhập vào (entry point) của plugin, chứa thông tin về phần đầu của plugin (plugin header information).
- includes/ Thư mục: Lưu trữ các tệp lớp hoặc hàm cốt lõi.
- admin/ Mục lục: Chứa các đoạn mã liên quan đến giao diện quản trị nền (backend management interface).
- public/ Mục lục: Chứa các đoạn mã dành cho phần trước của trang web (front-end).
- assets/ Thư mục: Lưu trữ tài nguyên tĩnh như JavaScript, CSS và hình ảnh.
- languages/ Mục lục: Nơi lưu trữ các tệp dịch thuật quốc tế (.po/.mo).

UltaHost – Nhà cung cấp dịch vụ máy chủ WordPress chuyên nghiệp

Bảo đảm hoàn tiền trong 30 ngày, băng thông và cơ sở dữ liệu không giới hạn, bảo vệ DDoS miễn phí, mua 3 năm ưu đãi 50%

Truy cập trang

Thông tin cần thiết về tiêu đề plugin (Plugin Header Information)

Mọi plugin WordPress đều phải chứa phần ghi chú tiêu đề plugin tiêu chuẩn ở đầu tệp PHP chính của nó; đây là yếu tố then chốt để WordPress nhận diện plugin đó. Dưới đây là một ví dụ cơ bản nhất:

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

Trong đó,Plugin Name Đây là các trường bắt buộc phải điền; những trường còn lại đều là tùy chọn. Tuy nhiên, để đảm bảo tính hoàn chỉnh và khả năng bảo trì của plugin, chúng tôi khuyên bạn nên điền đầy đủ tất cả các thông tin liên quan.Text Domain Dùng cho mục đích quốc tế hóa (internationalization).Domain Path Địa chỉ thư mục chứa các tệp ngôn ngữ.

Hãy xây dựng plugin đầu tiên của bạn: một chức năng chào hỏi đơn giản.

Hãy cùng thực hành thông qua một ví dụ cụ thể nhé. Chúng ta sẽ tạo một tiện ích mở rộng (plugin) để hiển thị một thông điệp chào hỏi có thể được tùy chỉnh ở phía trên nội dung bài viết trên trang web.

Tạo tệp tin plugin và thư mục

Trước hết, trong thư mục cài đặt WordPress của bạn… wp-content/plugins/ Trong thư mục đó, hãy tạo một thư mục mới và đặt tên cho nó là… my-greeting-pluginSau đó, hãy tạo một tệp PHP chính bên trong thư mục đó, đặt tên nó là… my-greeting-plugin.phpVà sao chép thông tin tiêu đề plugin nói trên vào đó.

Đọc thêm Làm thế nào để lựa chọn và phát triển plugin WordPress chất lượng cao: Hướng dẫn từ cơ bản đến nâng cao。

Sử dụng các “hook” (các công cụ hoặc lệnh đặc biệt) để thêm chức năng mới vào hệ thống.

WordPress hoạt động dựa trên hệ thống các “hook” (khớp nối). Nếu chúng ta muốn thêm thông tin trước nội dung bài viết, chúng ta cần sử dụng các hook phù hợp. the_content Hook bộ lọc. Trong tệp plugin chính của bạn, thêm hàm và lệnh gọi hook sau:

/**
 * 在文章内容前添加问候语
 *
 * @param string $content 原始的文章内容。
 * @return string 修改后的文章内容。
 */
function mgp_add_greeting_to_content( $content ) {
    $greeting_text = get_option( 'mgp_greeting_text', '欢迎阅读！' ); // 从数据库获取设置，默认为“欢迎阅读！”
    $custom_greeting = '<div class="mgp-greeting"><p><strong>'`. esc_html($greeting_text)`.'</strong></p></div>';

// 仅对主循环中的单篇文章页面生效
    if ( is_single() &amp;&amp; in_the_loop() &amp;&amp; is_main_query() ) {
        return $custom_greeting . $content;
    }
    return $content;
}
// 将函数挂载到 `the_content` 过滤器
add_filter( 'the_content', 'mgp_add_greeting_to_content' );

Đoạn mã này định nghĩa một hàm. mgp_add_greeting_to_contentNó nhận nội dung bài viết và thêm một container DIV chứa lời chào ở phía trước nội dung đó. add_filter() Chúng ta sẽ tự định nghĩa một hàm và sau đó gắn nó vào hệ thống WordPress. the_content Các bộ lọc được áp dụng một cách chính xác. Các điều kiện logic bên trong hàm đảm bảo rằng lời chào chỉ xuất hiện trong vòng lặp chính của trang bài viết đơn lẻ trên giao diện người dùng, và không ảnh hưởng đến các trang lưu trữ hoặc các công cụ hỗ trợ khác.

Tạo trang cài đặt quản lý đơn giản

Để người dùng có thể tự định nghĩa văn bản chào hỏi, chúng ta cần thêm một trang cấu hình đơn giản. Điều này đòi hỏi sử dụng API của menu quản trị WordPress. Hãy tiếp tục thêm đoạn mã sau vào tệp tin chính của plugin:

Hosting.com - lưu trữ chia sẻ

Hiệu năng cao, được trang bị CPU AMD EPYC, lưu trữ SSD NVMe và LiteSpeed, hỗ trợ chuyên gia nội bộ 24 giờ/ngày, các biện pháp bảo mật tiên tiến bao gồm SSL, chống brute force, phần mềm độc hại và bảo vệ DDoS, tiết kiệm tới 73%.

Truy cập trang

/**
 * 注册插件设置菜单和页面
 */
function mgp_register_admin_menu() {
    add_options_page(
        '问候语设置',           // 页面标题
        '问候语插件设置',       // 菜单标题
        'manage_options',      // 所需权限
        'my-greeting-plugin',  // 菜单slug
        'mgp_render_settings_page' // 用于输出页面内容的回调函数
    );
}
add_action( 'admin_menu', 'mgp_register_admin_menu' );

/**
 * 渲染设置页面的内容
 */
function mgp_render_settings_page() {
    ?>
    <div class="wrap">
        <h1>Cài đặt plugin cho lời chào hỏi</h1>
        <form method="post" action="/vi/options.php/" data-trp-original-action="options.php">
            <?php
            settings_fields( 'mgp_settings_group' ); // 输出设置组和非ce字段
            do_settings_sections( 'my-greeting-plugin' ); // 输出设置区域
            submit_button(); // 输出提交按钮
            ?>
        <input type="hidden" name="trp-form-language" value="vi"/></form>
    </div>
    <?php
}

/**
 * 初始化插件设置
 */
function mgp_initialize_settings() {
    // 注册一个设置
    register_setting(
        'mgp_settings_group', // 设置组名
        'mgp_greeting_text',  // 选项名，对应数据库中的键
        array( // 可选的验证回调函数
            'sanitize_callback' => 'sanitize_text_field',
            'default' =&gt; '欢迎阅读！'
        )
    );

// 添加一个设置区域
    add_settings_section(
        'mgp_main_section',           // 区域ID
        '主要设置',                   // 区域标题
        null,                         // 区域介绍的回调函数（此处不需要）
        'my-greeting-plugin'          // 页面slug
    );

// 向区域中添加一个字段
    add_settings_field(
        'mgp_greeting_field',         // 字段ID
        '问候语文本',                 // 字段标签
        'mgp_greeting_field_callback', // 用于输出字段HTML的回调函数
        'my-greeting-plugin',         // 页面slug
        'mgp_main_section'            // 区域ID
    );
}
add_action( 'admin_init', 'mgp_initialize_settings' );

/**
 * 渲染问候语文本输入字段
 */
function mgp_greeting_field_callback() {
    $greeting = get_option( 'mgp_greeting_text', '欢迎阅读！' );
    echo '<input type="text" name="mgp_greeting_text" value="' . esc_attr( $greeting ) . '" class="regular-text" />';
    echo '<p class="description">Đoạn văn này sẽ được hiển thị ở phía trên mỗi bài viết trên trang web của bạn.</p>';
}

Đoạn mã này thực hiện những công việc sau:
1. Sử dụng add_action( 'admin_menu', ... ) Một trang menu con đã được thêm vào menu “Cài đặt”.
2. Sử dụng add_action( 'admin_init', ... ) Các thiết lập ban đầu bao gồm tùy chọn đăng ký cơ sở dữ liệu, một khu vực để thiết lập, và một trường nhập liệu.
3. 定义了渲染设置页面表单和字段的函数。
Bây giờ, hãy đăng nhập vào giao diện quản trị WordPress của bạn. Trong menu “Cài đặt”, bạn sẽ tìm thấy tùy chọn “Cài đặt plugin Chào hỏi”. Tại đây, bạn có thể thay đổi nội dung lời chào hỏi, và ngay lập tức thấy kết quả sau khi thay đổi được áp dụng trong các bài viết trên giao diện người dùng.

Những thực hành tốt nhất và các bước nâng cao trong việc phát triển plugin

Sau khi hoàn thành các chức năng cơ bản, việc tuân theo các thực hành tốt nhất (best practices) sẽ giúp plugin của bạn trở nên chuyên nghiệp hơn, an toàn hơn và dễ bảo trì hơn.

An ninh là ưu tiên hàng đầu.

Đừng bao giờ tin tưởng vào dữ liệu do người dùng nhập vào. Trong các plugin, mọi dữ liệu được lấy từ bên ngoài (chẳng hạn như…) $_GET、$_POST、$_COOKIE Dữ liệu từ các nguồn như các bảng dữ liệu (database tables) hoặc truy vấn cơ sở dữ liệu (database queries) đều phải được xác thực (validate), làm sạch (clean), hoặc được xử lý bằng các thao tác escape trước khi được hiển thị hoặc sử dụng.
- Escape đầu ra: sử dụng esc_html()、esc_attr()、esc_url() 和 wp_kses_post() các hàm, v.v.
Dọn dẹp đầu vào: Sử dụng sanitize_text_field()、sanitize_email()、intval() các hàm, v.v.
– Bảo mật cơ sở dữ liệu: Sử dụng các biện pháp bảo mật hiện đại để bảo vệ dữ liệu khỏi sự xâm nhập trái phép. $wpdb Bạn có thể sử dụng các phương thức của lớp để thực hiện truy vấn, hoặc áp dụng chúng theo cách thích hợp. prepare() Sử dụng các phương thức để thực hiện truy vấn có tham số nhằm ngăn chặn tấn công SQL injection (xâm nhập dữ liệu vào truy vấn SQL).
– Kiểm tra quyền: Trước khi truy cập trang quản trị hoặc thực hiện các thao tác nhạy cảm, hãy sử dụng chức năng kiểm tra quyền. current_user_can() Kiểm tra quyền hạn của người dùng, và sử dụng chúng. check_admin_referer() Xác thực trường `nonce` nhằm ngăn chặn hành vi giả mạo yêu cầu từ trang web khác (Cross-Site Request Forgery – CSRF).

Đọc thêm Nắm vững các kỹ thuật cốt lõi của WordPress để tạo ra những trang web chuyên nghiệp vừa hiệu quả về chức năng vừa đẹp mắt.。

Thực hiện hóa đa ngôn ngữ (Internationalization – i18n)

Để plugin của bạn có thể được sử dụng bởi người dùng trên toàn thế giới, bạn cần hỗ trợ dịch sang nhiều ngôn ngữ. Điều này đòi hỏi bạn phải sử dụng các hàm dịch của WordPress để bao bọc tất cả các chuỗi văn bản dành cho người dùng. Hãy thay đổi cách hiển thị các chuỗi văn bản trong mã nguồn hiện tại.

// 在插件头信息中已定义 Text Domain: my-first-plugin
$greeting_text = get_option( 'mgp_greeting_text', __( '欢迎阅读！', 'my-first-plugin' ) );

// 在管理菜单函数中
add_options_page(
    __( '问候语设置', 'my-first-plugin' ),
    __( '问候语插件设置', 'my-first-plugin' ),
    'manage_options',
    'my-greeting-plugin',
    'mgp_render_settings_page'
);

Sau đó, bạn có thể sử dụng các công cụ như Poedit để trích xuất các chuỗi từ mã nguồn của plugin và tạo ra những tài liệu cần thiết. .pot các tệp mẫu, từ đó các dịch giả có thể tạo ra các tệp .po 和 .mo Tệp tin đó sẽ được đưa vào plugin. /languages Mục lục.

Máy chủ chia sẻ của InterServer

Lưu trữ chia sẻ với mức phí $2,50 USD mỗi tháng, giảm giá $0,1 USD trong tháng đầu tiên, mã giảm giá tryinterserver, với 461 ứng dụng đám mây và cài đặt chỉ bằng một cú nhấp chuột.

Truy cập trang

Tổ chức mã nguồn và tối ưu hóa hiệu năng

Khi các tính năng của plugin ngày càng phong phú hơn, việc chia mã nguồn thành các tệp riêng biệt là một quyết định khôn ngoan. Việc sử dụng lập trình hướng đối tượng (Object-Oriented Programming – OOP) và các lớp (classes) để tổ chức mã nguồn sẽ giúp nâng cao mức độ dễ đọc và khả năng tái sử dụng của mã. Đối với các tài nguyên như CSS và JS, nên… wp_enqueue_style() 和 wp_enqueue_script() Hàm được sử dụng đúng trong các “hook” (hoặc điểm kết nối) cần thiết. wp_enqueue_scripts 或 admin_enqueue_scriptsCác thành phần (components) được tải vào theo nhu cầu (on-demand) và phiên bản phụ thuộc (dependencies) được chỉ định rõ ràng. Hãy tránh thực hiện các truy vấn cơ sở dữ liệu tốn kém trực tiếp bên trong plugin; thay vào đó, hãy xem xét sử dụng API Transients để lưu trữ dữ liệu không quan trọng vào bộ nhớ đệm (cache).

Tóm lại

Bạn đã trải qua quá trình xây dựng một plugin WordPress hoàn chỉnh, bắt đầu từ việc tạo một tệp PHP đơn giản và thêm các thông tin tiêu chuẩn liên quan đến plugin, sau đó sử dụng các hook (khúc lệnh được gọi trong chu trình thực thi của WordPress) như action hooks và filter hooks để tích hợp chức năng vào plugin. Tiếp theo, bạn đã xây dựng giao diện quản lý cho plugin và tuân thủ các nguyên tắc bảo mật cũng như quốc tế hóa (internationalization) tốt nhất. Mặc dù plugin “Greeting” này khá đơn giản, nhưng nó đã minh họa rõ ràng các bước cơ bản trong quá trình phát triển plugin: lập kế hoạch cho chức năng, sử dụng các hook để xử lý dữ liệu, và tạo giao diện người dùng. Hãy nhớ rằng việc học hỏi liên tục từ tài liệu chính thức của WordPress, nghiên cứu mã nguồn của các plugin mở nguồn chất lượng cao, và thực hành thường xuyên là những cách tốt nhất để nâng cao kỹ năng phát triển plugin của bạn. Plugin tiếp theo của bạn có thể sẽ giúp giải quyết một vấn đề thực tế phức tạp và thú vị hơn nhiều.

FAQ 常见问题

Một plugin WordPress cần ít nhất bao nhiêu tệp tin?

Một plugin WordPress hoàn chỉnh chỉ cần ít nhất một tệp PHP. Chỉ cần phần đầu của tệp này chứa đầy đủ thông tin tiêu đề plugin (ít nhất là…) Plugin NameKhi bạn thực hiện các thao tác cần thiết, WordPress sẽ tự động nhận diện và kích hoạt plugin đó trong danh sách các plugin ở phía sau hậu trường (backend). Tệp tin này có thể chứa toàn bộ mã nguồn liên quan đến các chức năng của plugin, cũng như mã nguồn cho các trang quản lý (management pages), v.v. Tất nhiên, đối với những plugin phức tạp, việc chia mã nguồn thành nhiều tệp tin và thư mục khác nhau là một phương pháp được khuyến nghị nhằm đảm bảo tính dễ bảo trì.

Làm thế nào để tránh xung đột giữa plugin mà tôi phát triển với các plugin khác?

Chìa khóa để tránh xung đột nằm ở việc sử dụng các tiền tố duy nhất để đặt tên cho tất cả các hàm, lớp, biến, tên tùy chọn, cũng như các hook hành động/filter của bạn. Ví dụ, đừng sử dụng các tiền tố trùng lặp. add_greeting() Một tên hàm như vậy, thực ra nên sử dụng một cái gì đó có tính chất chung, phổ quát hơn… mgp_add_greeting() Những cái tên như vậy (trong đó) mgp Đó là viết tắt của plugin của bạn. Đối với các tùy chọn được lưu trữ trong cơ sở dữ liệu, cũng nên sử dụng một tiền tố duy nhất, ví dụ như… mgp_greeting_textĐiều này có thể giảm thiểu tối đa khả năng xảy ra xung đột giữa các không gian tên (namespace).

Khi kích hoạt hoặc vô hiệu hóa một plugin, bạn nên thực hiện những bước sau:

Khi một plugin được kích hoạt, thường cần thực hiện một số tác vụ một lần, chẳng hạn như kiểm tra phiên bản PHP hoặc WordPress, tạo bảng trong cơ sở dữ liệu, hoặc thiết lập các tùy chọn mặc định. Những tác vụ này có thể được thực hiện thông qua các quy trình tự động được xác định sẵn bởi plugin. register_activation_hook() Các hàm được sử dụng để thực hiện những công việc cụ thể. Tương tự như vậy…register_deactivation_hook() Dùng để định nghĩa các thao tác được thực hiện khi plugin bị vô hiệu hóa (tức là không còn hoạt động), chẳng hạn như xóa các tác vụ được lên lịch (planned tasks). Tuy nhiên, cần lưu ý rằng các hook dùng để vô hiệu hóa plugin thường không được sử dụng để xóa dữ liệu; việc dọn dẹp dữ liệu thường được thực hiện bởi các hook

Làm thế nào để thêm một trang cài đặt cho plugin của tôi?

Việc thêm trang cấu hình cho plugin chủ yếu liên quan đến hai API của WordPress: API Menü (Menu API) và API Cấu hình (Settings API). Đầu tiên, hãy sử dụng… add_action( 'admin_menu', ... ) Gắn một hàm, bên trong hàm đó sử dụng add_menu_page() 或 add_submenu_page() Hãy đăng ký một trang menu cấp cao hoặc cấp dưới. Sau đó, hãy sử dụng nó. add_action( 'admin_init', ... ) Gắn thêm một hàm khác và sử dụng nó bên trong. register_setting()、add_settings_section() 和 add_settings_field() Hãy định nghĩa các tùy chọn cấu hình cụ thể và các trường trong biểu mẫu. Cuối cùng, hãy viết một hàm gọi lại (callback function) để hiển thị biểu mẫu HTML trên trang cấu hình.

Plugin của tôi cần tương thích với phiên bản WordPress nào?

Điều này phụ thuộc vào nhóm người dùng mục tiêu của bạn. Thông thường, khuyến nghị nên hỗ trợ 3 đến 4 phiên bản WordPress chính gần nhất. Bạn có thể sử dụng thông tin này trong phần tiêu đề của plugin (plugin header). Requires at least: Hãy nêu rõ phiên bản WordPress tối thiểu cần được sử dụng. Trong quá trình phát triển, nên tránh sử dụng những hàm mới mẻ chỉ được hỗ trợ bởi phiên bản WordPress mới nhất, hoặc những tính năng mới mà chưa được triển khai trên các phiên bản cũ hơn. function_exists() Thực hiện các kiểm tra điều kiện để cung cấp các giải pháp thay thế tương thích với các phiên bản cũ hơn của WordPress. Đồng thời, việc thường xuyên kiểm thử trên các phiên bản WordPress cũ cũng là một cách hiệu quả để đảm bảo tính tương thích.