Volledige gids voor het ontwikkelen van WordPress plugins: bouw je eerste functionele plugin van scratch

Forbereidende werkzaamheden en omgevingsconfiguratie

Voordat je begint met schrijven van code, heb je een geschikte ontwikkelomgeving nodig. Dit omvat een lokale installatie van WordPress, een code-editor en enkele basiskennis.

Allereerst moet je zorgen dat je een lokale serveromgeving hebt. Je kunt hierbij gebruikmaken van tools als XAMPP, MAMP, Local by Flywheel of Docker om deze snel op te zetten. Nadat je WordPress hebt geïnstalleerd en ingesteld, beschik je over een veilige ‘sandbox’-omgeving waarin je kunt testen zonder dat je de online website beïnvloedt.

Ten tweede heb je een handig code-editor nodig. Visual Studio Code, PhpStorm of Sublime Text zijn allemaal uitstekende keuzen; ze bieden goede ondersteuning voor PHP, HTML, JavaScript en CSS, en beschikken over functies als code-highlighting, automatische suggesties en mogelijkheden voor het oplossen van fouten (debugging).

Aanbevolen leesmateriaal Van nul naar één: Een gids voor het beginnen met het ontwikkelen van WordPress plugins en de beste praktijken。

Ten slotte is het van belang om de basisstructuur van WordPress plugins te begrijpen. Een plugin bestaat in feite uit één of meerdere PHP-bestanden, die zich bevinden in de installatie-map van WordPress. /wp-content/plugins/ De plugins zitten in een map. Elke plugin moet een hoofdbestand hebben dat bevatte specifieke plugin-informatie, waarmee de plugin zich aan het WordPress-systeem kan melden.

Creatie en declaratie van het hoofdbestand van een plugin

Het eerste stap in het maken van een plugin is om een hoofdbestand te maken en de juiste header-commentaren toe te voegen. Dit bestand wordt meestal genoemd naar de functionaliteit van het plugin. my-first-plugin.phpVoor de lokale omgeving: /wp-content/plugins/ Maak een nieuwe map in de map en geef deze de naam my-first-pluginVervolgens maak je in die map de hoofdfile.

Het pluginheader bevat de meta-informatie van het plugin en vertelt WordPress welk naam het plugin heeft, wat de beschrijving is, welke versie het gebruikt, wie de ontwikkelaar is, etc. Hier is een voorbeeld van een zeer basist pluginheader:

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

Na het opslaan van deze bestand, log in je in bij het WordPress-administratiepaneel en ga naar de pagina “Plug-ins”. Hier moet je een nieuwe plugin zien met de naam “Mijn eerste functionaliteit-plugin”. Je kunt deze plugin activeren; hoewel deze voorlopig nog geen echte functionaliteiten heeft.

Core architecture: Action and filter hooks

De kern van de sterke uitbreidingsmogelijkheden van WordPress is het systeem met hooks (haakjes). Dit systeem biedt ontwikkelaars de mogelijkheid om hun eigen code in te voegen op specifieke momenten of voordat/na het gebruik van gegevens. Er zijn twee soorten hooks: actions (acties) en filters (filters).

Aanbevolen leesmateriaal Handboek voor het ontwikkelen van WordPress-themes: bouw je eigen website-template vanaf nul。

Action hooks bieden je de mogelijkheid om zelfgemaakte functies uit te voeren wanneer bepaalde WordPress-evenementen plaatsvinden. Bijvoorbeeld wanneer een artikel wordt gepubliceerd…publish_postTijdens het laden van het menu in de beheeromgeving:admin_menu) of wanneer scripts worden geladen in de hoofdsectie van de webpagina (wp_enqueue_scriptsGebruik het. add_action() Een functie die je eigen functie monteert op de actie-haak (action hook).

Een achtergrondmenu toevoegen met behulp van action-hooks

Stel dat we een instellingenpagina willen toevoegen aan het WordPress-administratiepaneel voor een plugin. We zullen hierbij gebruikmaken van... admin_menu Deze actie-hook: voeg de code toe aan je hoofdbestand, na de informatie over de plugin-hoofd.

// 在管理后台添加菜单
function mfp_add_admin_menu() {
    add_menu_page(
        '我的插件设置',          // 页面标题
        '我的插件',             // 菜单标题
        'manage_options',       // 所需权限
        'my-first-plugin',      // 菜单 slug
        'mfp_settings_page',    // 用于显示页面内容的回调函数
        'dashicons-admin-generic', // 图标（可选）
        80                     // 菜单位置（可选）
    );
}
add_action( 'admin_menu', 'mfp_add_admin_menu' );

// 设置页面的回调函数
function mfp_settings_page() {
    ?>
    <div class="wrap">
        <h1><?php echo esc_html( get_admin_page_title() ); ?></h1>
        <p>Welkom op de instellingenpagina van mijn eerste plugin!</p>
    </div>
    &lt;?php
}

De filter-haken bieden je de mogelijkheid om gegevens te bewerken. Ze nemen een waarde op, verwerken deze met je eigen functie en moeten vervolgens een gewijzigde waarde teruggeven. Een voorbeeld hiervan is het bewerken van de titel van een artikel.the_title), en het bewerken van de inhoud van artikelen (the_content) of de lengte van de samenvatting aanpassen (excerpt_lengthGebruik het. add_filter() Een functie die je eigen functie monteert op de filterhook.

Het inhoud van een artikel bewerken met filters

Laten we een simpel functie maken: automatisch toevoegen van een auteursrechtverklaring aan het eind van elke artikel.

// 在文章内容后添加自定义文本
function mfp_add_copyright_to_content( $content ) {
    // 仅对网站前端的主循环中的文章生效
    if ( is_single() && in_the_loop() && is_main_query() ) {
        $custom_text = '<p><em>Copyrightverklaring: De inhoud van dit artikel is eigendom van deze website. Voor het gebruik van deze inhoud moet de bron worden vermeld.</em></p>';
        $content .= $custom_text;
    }
    return $content;
}
add_filter( 'the_content', 'mfp_add_copyright_to_content' );

Realisatie van specifieke functionaliteiten: shortcodes en abbreviaten

Shortcodes zijn een krachtige functie die WordPress biedt. Ze bieden gebruikers de mogelijkheid om door een eenvoudige tag in een artikel of pagina in te voegen… [my_shortcode]Dit maakt het mogelijk om complexe dynamische inhoud te genereren of bepaalde functies uit te voeren. Hierdoor krijgen contentcreators veel meer flexibiliteit.

Maak en registreer een simpel kortcodesysteem.

Om een shortcode te maken, zijn twee stappen nodig: eerst moet de function die de shortcode verwerkt worden gedefinieerd, en daarna… add_shortcode() De functie wordt geregistreerd in WordPress. Laten we een shortcode maken die de huidige datum en een groet weergeeft.

Aanbevolen leesmateriaal Van het gemakkelijk kunnen gebruiken tot het worden van een expert: een volledig handboek en praktische training voor het ontwikkelen van WordPress-plug-ins。

// 定义简码的处理函数
function mfp_show_greeting_shortcode( $atts ) {
    // 使用 shortcode_atts 定义默认参数，并合并用户传入的参数
    $atts = shortcode_atts(
        array(
            'name' => '访客',
        ),
        $atts,
        'greeting'
    );

// 获取当前时间
    $current_time = current_time( 'mysql' );
    $hour = date( 'H', strtotime( $current_time ) );

// 根据时间生成问候语
    if ( $hour < 12 ) {
        $greeting = '上午好';
    } elseif ( $hour < 18 ) {
        $greeting = '下午好';
    } else {
        $greeting = '晚上好';
    }

// 构建输出
    $output = &#039;<div class="mfp-greeting">'`$output .= sprintf('<p>%s, %s!</p>'`, esc_html($atts['name'])), esc_html($greeting));  
    $output .= sprintf('<p>De huidige tijd is: %s</p>', esc_html($current_time));  
$output .= '</div>';

return $output;
}
// 注册简码，第一个参数是用户使用的标签名
add_shortcode( 'greeting', 'mfp_show_greeting_shortcode' );

Nu kunnen gebruikers dit in de artikelenrediger gebruiken. [greeting name="张三"]Op de pagina wordt dan het volgende weergegeven: “Zhang San, goedemiddag! De huidige tijd is: 2026-…”. Als geen parameters worden opgegeven, wordt standaard “Bezoeker” gebruikt.

Geavanceerde praktijk: Creeren van database-tabels en optiepagina's

Complexe plugins kunnen behoeven hebben om eigen gegevens op te slaan. WordPress biedt twee principiele manieren hiervoor aan: gebruikmaken van de WordPress Options API om eenvoudige sleutel-waarde-paargegevens op te slaan, of het creeren van aangepaste database-tabellen voor het opslaan van gestructureerde gegevens.

Gebruik de Option API om instellingen op te slaan.

De Option API is zeer geschikt om de configuratiegegevens van plugins op te slaan. We zullen de eerder gecreerde backend-instellingenpagina verbeteren, zodat deze in staat is om eenvoudige instellingen op te slaan en te ophalen.

Eerst moeten we een formulier maken. mfp_settings_page() In de functie wordt een simpel formulier toegevoegd om instellingen te kunnen verwerken:

function mfp_settings_page() {
    // 检查用户是否提交了表单
    if ( isset( $_POST['mfp_submit_settings'] ) ) {
        // 安全检查：验证 nonce
        if ( ! isset( $_POST['mfp_settings_nonce'] ) || ! wp_verify_nonce( $_POST['mfp_settings_nonce'], 'mfp_save_settings' ) ) {
            wp_die( '安全验证失败！' );
        }
        // 权限检查
        if ( ! current_user_can( 'manage_options' ) ) {
            wp_die( '权限不足！' );
        }
        // 清理并保存选项
        $custom_message = sanitize_textarea_field( $_POST['custom_message'] );
        update_option( 'mfp_custom_message', $custom_message );
        echo '<div class="notice notice-success is-dismissible"><p>De instellingen zijn gespeeld!</p></div>';
    }

// 从数据库读取现有值
    $saved_message = get_option( 'mfp_custom_message', '这是默认的欢迎信息。' );
    ?&gt;
    <div class="wrap">
        <h1><?php echo esc_html( get_admin_page_title() ); ?></h1>
        <form method="post" action="" data-trp-original-action="">
            <?php wp_nonce_field( 'mfp_save_settings', 'mfp_settings_nonce' ); ?>
            <table class="form-table">
                <tr>
                    <th scope="row"><label for="custom_message">Maak je eigen bericht:</label></th>
                    <td>
                        <textarea name="custom_message" id="custom_message" rows="5" cols="50" class="large-text"><?php echo esc_textarea( $saved_message ); ?></textarea>
                        <p class="description">Deze tekst zal worden weergegeven wanneer de shortcode [show_message] wordt gebruikt.</p>
                    </td>
                </tr>
            </table>
            <?php submit_button( '保存更改', 'primary', 'mfp_submit_settings' ); ?>
        <input type="hidden" name="trp-form-language" value="nl"/></form>
    </div>
    &lt;?php
}

Vervolgens creëren we een nieuwe afkorting om deze opgeslagen bericht te weergeven:

function mfp_show_message_shortcode() {
    $message = get_option( 'mfp_custom_message', '这是默认的欢迎信息。' );
    return '<div class="mfp-custom-message">'. wp_kses_post( wpautop( $message ) ) . '</div>'add_shortcode( 'show_message', 'mfp_show_message_shortcode' );

Nu kunnen beheerders op de instellingenpagina van de plugin de berichten aanpassen, terwijl de auteurs deze berichten alleen maar in hun artikelen hoeven te gebruiken. [show_message] Met slechts een kort code kan deze berichtgeving worden weergegeven.

Wanneer de plugin is geactiveerd, wordt een aangepaste tabel gecreëerd.

Voor plugins die complexe relatiegegevens zoals bestellingen en logs moeten opslaan, is het mogelijk om eigen database-tabellen te creeren. Dit gebeurt meestal wanneer de plugin wordt activeerd. WordPress biedt hiervoor de mogelijkheid. register_activation_hook Definieer de functie die wordt uitgevoerd wanneer het wordt activerd.

Let op: De onderstaande code is slechts een voorbeeld. In de praktische ontwikkeling is een nauwkeuriger foutbehandeling en een abstractielaag voor de database vereist (bijvoorbeeld…) $wpdbDe toepassing van (…)

// 插件激活时运行的函数
function mfp_create_custom_table() {
    global $wpdb;
    $table_name = $wpdb->prefix . 'mfp_plugin_logs'; // 确保表名唯一
    $charset_collate = $wpdb->get_charset_collate();

$sql = "CREATE TABLE IF NOT EXISTS $table_name (
        id mediumint(9) NOT NULL AUTO_INCREMENT,
        log_time datetime DEFAULT CURRENT_TIMESTAMP NOT NULL,
        user_id bigint(20) DEFAULT 0,
        action varchar(255) NOT NULL,
        details text,
        PRIMARY KEY  (id)
    ) $charset_collate;";

// 引入 WordPress 升级 API，用于执行 dbDelta 函数
    require_once( ABSPATH . 'wp-admin/includes/upgrade.php' );
    dbDelta( $sql );
}
// 注册激活钩子
register_activation_hook( __FILE__, 'mfp_create_custom_table' );

Samenvatting

Met deze handleiding hebt u de belangrijkste stappen van het ontwikkelen van WordPress-plug-ins doorlopen. U hebt een omgeving opgezet, de header van het plugin geschreven, en hebt geleerd hoe u de functionaliteit van WordPress kunt uitbreiden met acties en filterhaken. U hebt flexibele manieren van contentinbedrijving voor gebruikers gecreëerd met shortcodes, en u kent de basis van het opslaan van instellingen met de Options API en het maken van aangepaste database-tabelen. Dit zijn de fundamenten voor het bouwen van een functioneel plugin. Vergeet niet dat een goede codestructuur, veiligheid (bijvoorbeeld door nonce-verificatie en toegangscontrole) en het voorbereiden op internationalisering onmisbare onderdelen zijn van professioneel pluginontwikkeling. De volgende stap is om de WordPress REST API te verkennen, aangepaste artikeltypen te gebruiken, metadata (Meta Boxes) te beheren, en om front-end-scripts en -stijlen te implementeren, zodat u nog complexere en krachtigere plug-ins kunt bouwen.

Veelgestelde vragen (FAQ)

Mag een plugin maar één hoofdbestand hebben?

Dat is niet het geval. Een plugin kan bestaan uit meerdere PHP-bestanden. Er moet echter wel een hoofdbestand zijn dat de plugingegevens (de ‘plugin header’) bevat; dit is de plek waar WordPress de plugin herkent. Complexere plugins organiseren de code voor de verschillende functies vaak in meerdere bestanden en roepen deze op via het hoofdbestand op, zodat de code beter te beheren is en het systeem meer modulair is.

Hoe moet je veilig omgaan met de gegevens die gebruikers invoeren in een front-end formulier?

Tijdens het verwerken van door gebruikers ingediende gegevens is het noodzakelijk om deze strikt te verifiëren, te reinigen en te ontsnappen (te 'escape'). Voor invoergegevens moet hiervoor een geschikte methode worden gebruikt. sanitize_text_field()、sanitize_email()、sanitize_textarea_field() Gebruik functies zoals deze voor het schoonmaken van de gegevens. Voor de gegevens die worden weergegeven op een HTML-pagina, moet ervoor worden gezorgd dat... esc_html()、esc_attr() 或 wp_kses_post() Voor het uitvoeren van deze acties is het nodig om de tekst te ontsluiten (of te ‘escape’). Vergeet ook niet om de nonce-mechanisme van WordPress te gebruiken om fraude met cross-site requests (XSRF) te voorkomen. current_user_can() Controleer de gebruikersrechten.

Hoe kan mijn plugin voorkomen dat er conflicten ontstaan met de namen van functies van andere plugins?

De beste praktijk is om namenruimtes (namespace) te gebruiken (PHP 5.3+) of om alle functies, klassen en constanten onder een unieke prefix te plaatsen. In deze handleiding beginnen alle functies bijvoorbeeld met “mfp_” (afkorting van ‘My First Plugin’). Als je objectgericht programmeert, is het ook een goede manier om namenconflicten te voorkomen door de code op te pakken in klassen.

Nadat de plugin is ontwikkeld, hoe kan deze worden verspreid of geplaatst in de officiële catalogus?

Om een plugin in te sturen naar de officiële WordPress.org-plugincatalogus, moet je een plugin-pakket maken dat voldoet aan de vereisten van de catalogus. Dit pakket bevat meestal een gestandardiseerde bestandsstructuur. README.txtJe moet een ontwikkelaarsaccount aanvragen op WordPress.org en vervolgens het codebestand met behulp van het SVN-verwerkingsinstrument naar het aangegeven codearchief indienen. De vertaling moet gedetailleerd zijn, er moeten compatibiliteitsverklaringen worden gegeven, en de code moet voldoen aan de codingstandaarden van WordPress.