WordPress Plugin Development: Building Custom Functional Modules from Scratch

Understanding the basic structure of WordPress plugins

Before delving into the code, it is essential to understand the basic components of a WordPress plugin. A plugin is essentially one or a set of files that are placed in a specific location within the WordPress directory.wp-content/plugins/The PHP files in the directory include a main file that contains the plugin’s metadata. This metadata is communicated to WordPress through a special format of comment blocks, which indicate the presence of the plugin.

The core entry file of the plugin; for example, let's call it…my-first-plugin.phpThe plugin must contain a specific file header comment. This comment block defines information such as the plugin’s name, description, version, and author, and it is the only basis for WordPress to recognize and load the plugin. A very basic plugin can consist of just this one file. It utilizes the APIs provided by WordPress, such as Action Hooks and Filter Hooks, to modify or extend the functionality of the website.

The functionality of a plugin can be very simple—for example, adding a line of text at the bottom of a page—and it can also be extremely complex, such as creating a complete e-commerce system. Regardless of the complexity, the development process follows the same basic pattern: first, create the correct file structure in the appropriate locations; then, write the code and integrate it into WordPress’s lifecycle; finally, perform any necessary configurations and interactions through WordPress’s administrative interface.

Recommended Reading WordPress Plugin Development Beginner’s Guide: Creating Your First Plugin from Scratch。

Create your first plugin

Let’s practice creating the simplest plugin using the classic “Hello World” example. The function of this plugin is to display a greeting message at the top of the article content on every page of the website.

UltaHost WordPress Hosting

30-day refund guarantee, unlimited bandwidth and database usage, free DDoS protection; purchase for 3 years and get a discount of 50%.

access page

First of all, you need to do this either locally or on the server.wp-content/plugins/Create a new folder in the directory and name it…my-hello-pluginThen, create a main PHP file within that folder. We will name it…my-hello-plugin.php。

Write the main file for the plugin.

Open itmy-hello-plugin.phpPlease download the file and enter the following code. This code follows the standard format for WordPress plugins, including the plugin information header and the code that implements the functionality.

<?php
/**
 * Plugin Name:       我的问候插件
 * Plugin URI:        https://yourwebsite.com/my-hello-plugin
 * Description:       这是一个简单的插件，用于在文章内容前输出“您好，读者！”。
 * Version:           1.0.0
 * Author:            你的名字
 * License:           GPL v2 or later
 * Text Domain:       my-hello-plugin
 */

// 防止直接访问文件
if ( ! defined( 'ABSPATH' ) ) {
    exit;
}

/**
 * 在主文章内容前添加问候语。
 *
 * @param string $content 原始的文章内容。
 * @return string 添加了问候语后的新内容。
 */
function my_hello_add_greeting( $content ) {
    $greeting = &#039;<p style="background-color:#f0f8ff; padding:10px; border-left:4px solid #0073aa;"><strong>Hello, readers! Thank you for reading this article.</strong></p>';
    // 只在主循环且是文章页面时添加
    if ( is_single() &amp;&amp; in_the_loop() &amp;&amp; is_main_query() ) {
        return $greeting . $content;
    }
    return $content;
}
// 将函数挂载到 ‘the_content’ 过滤器
add_filter( 'the_content', 'my_hello_add_greeting' );

Activate and test the plugin.

Upload the folder that contains that file to the server.wp-content/plugins/The directory, or if you are developing locally, simply place the file in the corresponding location. Then, log in to your WordPress administration panel and navigate to the “Plugins” menu. You should see “My Greeting Plugin” in the list of plugins. Click the “Activate” button.

Once activated, when you visit any article or page on the website, you will see a greeting message with a light blue background and a left-side border appear before the actual content of the article. This process clearly demonstrates the core steps of plugin development: creating files, using hooks to add functionality, and activating the plugin in the background. You have successfully taken the first step in developing WordPress plugins.

Recommended Reading WordPress Plugin Development: Building Powerful Website Extensions from Scratch。

Expand functionality using hooks and filters.

The flexibility and scalability of WordPress are largely due to its “Hooks” system. Hooks are divided into two categories: Action Hooks and Filter Hooks. Understanding and mastering their use is key to developing advanced plugins.

Action hooks allow you to insert and execute your own code at specific moments in the WordPress workflow, such as when an article is published or a page is loaded. For example,save_postThe action is triggered when the article or page is saved to the database. You can do this by…add_action()The function “mounts” your custom function to this hook.

Filter hooks allow you to modify the data that WordPress generates during its processing. You register a function with a filter, and when WordPress encounters that filter, it passes the data to all the registered functions and receives the processed return values. This is what was used in the example above.the_contentIt’s a typical filter hook that allows you to modify the content of the article before it is displayed.

hosting.com Shared Hosting

High performance with AMD EPYC CPUs, NVMe SSD storage and LiteSpeed, 24/7, 24x7 expert in-house support, advanced security measures including SSL, brute force, malware and DDoS protection, savings of up to 73%

access page

Create a simple management option.

A truly useful plugin usually requires some user-configurable options, which involves interacting with the WordPress backend. We will demonstrate how to add a custom settings page through a simple example.

First of all, we use…add_action(‘admin_menu’, …)Register a function that will create a new menu item in the administration backend.

/**
 * 在WordPress后台添加一个自定义菜单页面。
 */
function my_hello_add_admin_menu() {
    add_menu_page(
        ‘问候插件设置’， // 页面标题
        ‘问候插件’，     // 菜单标题
        ‘manage_options’， // 所需权限
        ‘my-hello-plugin’， // 菜单slug
        ‘my_hello_admin_page_html’， // 用于显示页面内容的回调函数
        ‘dashicons-format-chat’， // 图标（可选）
        80 // 菜单位置（可选）
    );
}
add_action( ‘admin_menu‘, ’my_hello_add_admin_menu’ );

/**
 * 自定义设置页面的HTML输出。
 */
function my_hello_admin_page_html() {
    // 检查用户权限
    if ( ! current_user_can( ‘manage_options’ ) ) {
        return;
    }
    ?>
    <div class="“wrap”">
        <h1></h1>
        <form action="/en/“options.php”/" method="“post”" data-trp-original-action="“options.php”">
            <?php
            // 输出设置字段、安全性和保存更改按钮
            settings_fields( ‘my_hello_options’ );
            do_settings_sections( ‘my-hello-plugin’ );
            submit_button( ‘保存问候语设置’ );
            ?>
        <input type="hidden" name="trp-form-language" value="en"/></form>
    </div>
    &lt;?php
}

Registration and Output Settings Fields

Just having a page is not enough; we also need to create options that can be saved. This requires the use of…add_action(‘admin_init’, …)…as well asregister_setting()、add_settings_section()andadd_settings_field()a series of functions.

Recommended Reading From Beginner to Expert: A Complete Guide to WordPress Plugin Development。

/**
 * 初始化插件的设置。
 */
function my_hello_settings_init() {
    // 注册一个设置项到数据库的‘my_hello_options’键下
    register_setting( ‘my_hello_options‘, ’my_hello_greeting_text’ );

// 在页面中添加一个设置区域
    add_settings_section(
        ‘my_hello_section’， // 区域ID
        ‘问候语设置’，        // 区域标题
        ‘my_hello_section_html’， // 区域描述的回调函数
        ‘my-hello-plugin’ // 所属页面slug
    );

// 在区域内添加一个具体的设置字段
    add_settings_field(
        ‘my_hello_field’， // 字段ID
        ‘自定义问候语’，    // 字段标签
        ‘my_hello_field_html’， // 用于渲染字段HTML的回调函数
        ‘my-hello-plugin’， // 所属页面slug
        ‘my_hello_section’ // 所属区域ID
    );
}
add_action( ‘admin_init‘, ’my_hello_settings_init’ );

/**
 * 设置区域的描述信息。
 */
function my_hello_section_html() {
    echo ‘<p>Here, you can set the greeting message that will be displayed at the beginning of the article.</p>’;
}

/**
 * 渲染设置字段的HTML。
 */
function my_hello_field_html() {
    // 从数据库获取已保存的值，如果没有则使用默认值
    $greeting = get_option( ‘my_hello_greeting_text‘, ’您好，读者！欢迎阅读本文。’ );
    ?&gt;
    <input type="‘text’"
           id="‘my_hello_greeting_text’"
           name="‘my_hello_greeting_text’"
           value="“NO NUMERIC NOISE KEY" 1000”
 class="“regular-text”" />
    <p class="“description”">Please enter the greeting you would like to display before the article content.</p>
    &lt;?php
}

Now, we already have a background settings page with an input field. Next, we need to modify the original functional functions.my_hello_add_greetingLet it read the greeting from the options in the database.

function my_hello_add_greeting( $content ) {
    // 获取保存的自定义问候语，如果不存在则使用默认值
    $custom_greeting = get_option( ‘my_hello_greeting_text‘, ’您好，读者！欢迎阅读本文。’ );
    $greeting = ‘<p style="“background-color:#f0f8ff;" padding:10px; border-left:4px solid #0073aa;”><strong>’ . esc_html( $custom_greeting ) . ‘</strong></p>’;
    if ( is_single() &amp;&amp; in_the_loop() &amp;&amp; is_main_query() ) {
        return $greeting . $content;
    }
    return $content;
}

At this point, a plugin with basic backend configuration functionality is complete. Users can freely modify the greeting text in the “Greeting Plugin” menu in the backend, and the latest settings will be automatically applied to the articles on the frontend.

InterServer Shared Hosting

Shared hosting $2.50 USD per month , first month $0.1 USD promo code tryinterserver, 461 cloud apps scripts, one click install.

access page

Best Practices and Security for Plugin Development

Developing a WordPress plugin for others to use requires not only that the plugin has comprehensive functionality but also that it adheres to the best practices regarding security, performance, and maintainability.

Security considerations

Security is the primary principle. Never trust user input. All data obtained from users (such as…)$_GET、$_POST、$_COOKIEBefore using the data for database queries, displaying it on a page, or performing file operations, it must be properly cleaned, validated, and escaped.

For the data that is output to an HTML page, useesc_html()、esc_attr()Orwp_kses_post()Escape functions such as `escape()` should be used for these variables. For variables that are used in database queries, it is mandatory to apply this escape mechanism.$wpdb->prepare()When performing parameterized queries using a method, never directly concatenate variables into the SQL statement. In plugins, it is always advisable to use parameterized queries instead.defined(‘ABSPATH’) or die;This is to prevent the files from being accessed directly.

Code Organization and Internationalization

As the functionality of plugins grows, it becomes difficult to maintain all the code in a single main file. A more reasonable approach is to split the code into separate files based on its functionality. Typically, the main file is responsible for defining the hooks and core processes, while the settings pages, functional functions, class definitions, and other components are placed in separate files.includes/Oradmin/、public/In such subdirectories, and through…require_onceIntroduce.

In order for your plugin to be used by users around the world, it should support internationalization (i18n). This means that all text strings displayed within the plugin should utilize WordPress’s translation functions.__()、_e()Wrap it up, and also…Text DomainSet a unique identifier (such as the plugin directory name). We have already defined it in the comment block at the beginning of the file.Text Domain: my-hello-pluginThis is how it should be used in the code:

$greeting = ‘<p><strong>’ . esc_html__( ‘您好，读者！欢迎阅读本文。’ , ’my-hello-plugin’ ) . ‘</strong></p>’;

In this way, the translators can use it..poand.moThe file contains translations for your plugin in different languages.

performance optimization

Plugins should minimize their impact on website performance as much as possible. Avoid performing a large number of database queries or complex calculations with each page load, especially on the front end. Make reasonable use of WordPress’s Transients API to store the results of expensive queries that do not change frequently. For example, if you want to cache the results of an API request, you can do the following:

$data = get_transient( ‘my_plugin_api_data’ );
if ( false === $data ) {
    // 数据不存在或已过期，从API获取
    $data = wp_remote_retrieve_body( wp_remote_get( ‘https://api.example.com/data’ ) );
    // 将数据存储12小时
    set_transient( ‘my_plugin_api_data’, $data, 12 * HOUR_IN_SECONDS );
}
// 使用 $data

In addition, make sure to load your CSS and JavaScript files only on the pages where they are needed. Use…wp_enqueue_script()andwp_enqueue_style()Functions, along with the appropriate hooks (such as…)wp_enqueue_scripts) to load front-end resources; for back-end resources, the following method is used:admin_enqueue_scriptsHooks.

summarize

Following the step-by-step guidance in this article, we completed the entire development process from a simple “Hello World” plugin to a practical plugin that offers backend configuration options and adheres to basic security and code organization principles. The key lies in understanding and utilizing WordPress’s core mechanism: the hook system. This system allows us to extend the platform’s functionality in a modular and non-invasive manner. Whether it’s modifying content (through filters) or performing specific tasks (through actions), hooks serve as the bridge that connects your code to the WordPress ecosystem.

Remember: Developing excellent plugins is not just about making the features work. It also involves strict security measures for user input, clear and well-organized code, support for internationalization (i18n), and careful consideration of website performance. Every step – from creating a plugin with a well-defined file structure, to using standard APIs to create menus and settings, to securely escaping the output – affects the quality, security, and user experience of the plugin. By continuing to explore WordPress’s numerous APIs and functions in depth, you will be able to build plugins that are both powerful and robust.

FAQ Frequently Asked Questions

What are the basics required for plugin development?

You should have a basic understanding of the PHP programming language, including core concepts such as variables, functions, arrays, conditional statements, and loops. It would also be helpful to have a basic knowledge of HTML and CSS, as plugins often need to generate or modify the front-end user interface. Familiarity with the basic usage and backend structure of WordPress can make the development process smoother.

How to debug my WordPress plugin?

First of all, make sure that your…wp-config.phpThe WordPress debug mode has been enabled in the file. This was done through the relevant settings.define('WP_DEBUG', true);anddefine('WP_DEBUG_LOG', true);The error message will be recorded.wp-content/debug.logIn the file, this is more secure than displaying the information directly on the page. Additionally, it can be used in combination with other methods.error_log()The function prints the value of the variable, or you can use the “Network” and “Console” panels in the browser’s developer tools to check for issues with the front-end scripts and styles.

Can the plugin I developed be uploaded to the official plugin directory?

Sure, but you need to meet the official WordPress plugin submission requirements. This includes ensuring that your plugin complies with the GPL-compatible license, follows WordPress’s coding standards, guarantees the security of the code (and does not contain any malicious content), and provides clear documentation. Before submitting, it is recommended that you carefully read the official plugin developer manual and submission guidelines. The submission process involves reviewing your plugin through WordPress.org’s plugin submission system.

What are the differences between the functions of plugins and themes? When should one develop a plugin?

The “Theme” primarily controls the appearance and layout of a website, and is usually responsible for the template files, style sheets, and some display-related features. On the other hand, “Plugins” are used to add or modify website functionality, and their impact is (in most cases) independent of the currently used theme. A good principle to follow is: If a feature is directly related to the website’s appearance (such as page layout or color scheme), it should be considered for inclusion in the theme. However, if a feature is generic and independent (such as a contact form, SEO optimization, or caching), it should be developed as a plugin so that it remains available regardless of the theme being used. This helps to maintain a separation between functionality and design, thereby enhancing the flexibility of the website.