Guide pratique complet de développement de plugins WordPress, de zéro à la création de votre premier plugin

Dans l’immensité d’Internet, WordPress occupe une place de premier plan parmi les systèmes de gestion de contenu, grâce à sa grande flexibilité et à sa capacité d’extension. Au cœur de cette flexibilité se trouvent les plugins. Grâce au développement de plugins pour WordPress, vous pouvez ajouter à votre site toutes les fonctionnalités que vous pouvez imaginer. Cet article vous guidera pas à pas pour créer votre premier plugin WordPress, en vous expliquant en détail sa structure de base et son processus de développement.

Base des plugins WordPress et installation de l'environnement de développement

Avant de commencer à coder, il est essentiel de comprendre la nature des plugins WordPress et de mettre en place un environnement de développement approprié. Un plugin est essentiellement un ou plusieurs fichiers PHP qui respectent les spécifications de WordPress et fonctionnent en utilisant des mécanismes spécifiques définis par ce système.钩子(Ces « hooks ») interagissent avec les systèmes centraux.

Définition de base d'un plugin

Chaque plugin doit disposer d’un fichier principal unique, et cette information doit être déclarée dans une note au format spécifique en début de fichier. Ces notes servent de base à WordPress pour identifier et afficher les métadonnées du plugin, telles que le nom, la description, la version, etc., sur la page de gestion des plugins.

Lectures recommandées Découvrez les secrets du développement de plugins : construisez votre première extension à partir de zéro.。

Configuration de l'environnement de développement local

Pour développer de manière efficace et sûre, il est fortement conseillé d’utiliser un environnement serveur local. Vous pouvez choisir des outils tels que XAMPP, MAMP, Local by Flywheel ou Docker. Les exigences essentielles sont l’installation de PHP (une version compatible avec votre serveur cible), de MySQL/MariaDB, ainsi que d’Apache/Nginx. Ensuite, téléchargez les fichiers du noyau de WordPress les plus récents et effectuez l’installation.

Hébergement WordPress par UltraHost

Garantie de remboursement dans les 30 jours, bande passante illimitée et base de données, protection gratuite contre les attaques DDoS. Avantage de 501 TP4T pour les achats sur 3 ans.

page d'accès

Créez votre premier plugin : une petite utilité pour des salutations.

Maintenant, allons créer un plugin simple. La fonction de ce plugin sera d'ajouter automatiquement un salut personnalisé à la fin du contenu des articles sur le site web.

Tout d’abord, dans WordPress… wp-content/plugins Dans le répertoire, créez un nouveau dossier et nommez-le… my-first-greeting-pluginEnsuite, créez le fichier PHP principal dans ce dossier. Il peut être nommé… my-first-greeting-plugin.php。

Déclaration des informations de la tête du plugin

Ouvrez le fichier principal et saisissez le code suivant pour définir le plugin :

<?php
/**
 * Plugin Name:       我的第一个问候语插件
 * Plugin URI:        https://yourwebsite.com/my-first-greeting-plugin
 * Description:       这是一个练习用的插件，用于在文章末尾添加问候语。
 * Version:           1.0.0
 * Author:            你的名字
 * Author URI:        https://yourwebsite.com
 * License:           GPL v2 or later
 * Text Domain:       my-first-greeting-plugin
 */

Après avoir enregistré le fichier, accédez à la page des “ Plugins ” dans l’administration de WordPress. Vous devriez voir ce nouveau plugin dans la liste des plugins disponibles et pourrez l’activer. Bien sûr, pour l’instant, il n’a aucune fonctionnalité.

Lectures recommandées 10 astuces clés et guide pratique pour optimiser les performances d’un site e-commerce WooCommerce。

Utiliser des « hooks » pour ajouter des fonctionnalités essentielles.

Le fonctionnement de WordPress dépend fortement du mécanisme des “ hooks ” (ou « crochets »), qui sont divisés en plusieurs catégories :动作钩子(Action Hooks) et过滤器钩子(Filtre d’hook) Nous devons ajouter du texte après le contenu de l’article, et pour cela, nous devons utiliser… the_content Ce filtre hook.

En dessous des commentaires situés en tête du fichier principal, ajoutez les fonctions et les hooks suivants :

// 定义向文章内容添加问候语的函数
function mfgp_add_greeting_to_content( $content ) {
    // 确保只在主循环的单篇文章页面显示
    if ( is_single() && in_the_loop() && is_main_query() ) {
        $greeting = '<p style="color:#666; font-style:italic;">Merci de lire cet article ! Je vous souhaite une belle journée !</p>';
        $content .= $greeting;
    }
    return $content;
}
// 将函数挂载到 ‘the_content’ 过滤器钩子上
add_filter( 'the_content', 'mfgp_add_greeting_to_content' );

Après avoir enregistré le fichier et activé l’extension, ouvrez n’importe quel article sur le site web, faites défiler la page jusqu’en bas, et vous devriez voir le message de salutation que vous avez ajouté. À travers cet exemple simple, vous avez mis en pratique les concepts les plus fondamentaux du développement d’extensions : la déclaration de l’extension, la rédaction des fonctions de fonctionnalité, ainsi que le processus permettant d’intégrer ces fonctionnalités dans le site.add_filterOuadd_actionMontez la fonction sur le crochet (hook) approprié.

hosting.com Hébergement partagé

Hautes performances avec les CPU AMD EPYC, stockage SSD NVMe et LiteSpeed, support interne expert 24h/24 et 7j/7, mesures de sécurité avancées, notamment SSL, protection contre la force brute, les logiciels malveillants et le DDoS, économies pouvant aller jusqu'à 73%.

page d'accès

Amélioration des fonctionnalités des plugins : ajout d'une page de gestion des paramètres.

Un plugin mature permet généralement aux utilisateurs de le configurer en arrière-plan. Nous allons maintenant ajouter une page de paramétrage simple au plugin des salutations, afin que les administrateurs puissent personnaliser le texte affiché.

Créer des éléments de menu de gestion

Tout d’abord, nous devons utiliser…add_actionLe crochet appelle une fonction, et cette fonction utilisera… add_options_page La fonction ajoute une sous-page dans le menu “ Paramètres ” du back-end de WordPress.

Continuez à ajouter le code suivant dans le fichier principal :

Lectures recommandées De zéro à un : guide complet et tutoriel pratique pour le développement de plugins WordPress.。

// 添加设置菜单
function mfgp_add_admin_menu() {
    add_options_page(
        '问候语插件设置',          // 页面标题
        '自定义问候语',           // 菜单标题
        'manage_options',         // 权限要求（管理员）
        'my-greeting-plugin',     // 菜单 Slug
        'mfgp_settings_page_html' // 用于输出页面内容的回调函数
    );
}
add_action( 'admin_menu', 'mfgp_add_admin_menu' );

Construire la page de configuration et la logique de sauvegarde

Maintenant, nous devons définir la fonction de rappel mentionnée ci-dessus. mfgp_settings_page_html Il s’agit de rendre la page HTML contenant le formulaire de configuration et de gérer l’enregistrement des données saisies dans ce formulaire. WordPress propose une API de configuration pour simplifier ce processus, mais afin de mieux comprendre les étapes, nous allons utiliser une méthode plus basique pour commencer.

// 定义设置页面的 HTML 结构
function mfgp_settings_page_html() {
    // 检查用户权限
    if ( !current_user_can( 'manage_options' ) ) {
        return;
    }

// 处理表单提交（非设置API方式）
    if ( isset( $_POST['mfgp_greeting_text'] ) ) {
        // 验证 Nonce 确保请求来源安全
        check_admin_referer( 'mfgp_save_settings' );
        // 清理并保存输入的数据
        $greeting_text = sanitize_textarea_field( $_POST['mfgp_greeting_text'] );
        update_option( 'mfgp_custom_greeting', $greeting_text );
        echo '<div class="notice notice-success is-dismissible"><p>Les paramètres ont été sauvegardés !</p></div>';
    }

// 获取已保存的问候语
    $saved_greeting = get_option( 'mfgp_custom_greeting', '感谢您阅读本文！祝你拥有美好的一天！' );
    ?&gt;
    <div class="wrap">
        <h1></h1>
        <form method="post" action="">
            <?php wp_nonce_field( 'mfgp_save_settings' ); ?>
            <table class="form-table">
                <tr>
                    <th scope="row"><label for="mfgp_greeting_text">Salutation personnalisée</label></th>
                    <td>
                        <textarea name="mfgp_greeting_text" id="mfgp_greeting_text" rows="5" cols="50" class="large-text"><?php echo esc_textarea( $saved_greeting ); ?></textarea>
                        <p class="description">Cet texte sera affiché à la fin de chaque article.</p>
                    </td>
                </tr>
            </table>
            <?php submit_button( '保存更改' ); ?>
        <input type="hidden" name="trp-form-language" value="fr"/></form>
    </div>
    &lt;?php
}

Mettre à jour la fonction d'affichage de l'interface utilisateur (front-end).

Enfin, nous devons modifier la fonction de sortie de l’interface utilisateur existante afin qu’elle récupère les options directement à partir de la base de données.get_optionLes salutations sont lues à partir d’un fichier, plutôt que d’utiliser du texte codé en dur.

Hébergement partagé InterServer

Hébergement mutualisé $2.50 USD par mois, premier mois $0.1 USD code promo tryinterserver, 461 scripts cloud apps, installation en un clic.

page d'accès

function mfgp_add_greeting_to_content( $content ) {
    if ( is_single() && in_the_loop() && is_main_query() ) {
        // 从数据库选项中获取问候语，如果没有则使用默认值
        $greeting_text = get_option( 'mfgp_custom_greeting', '感谢您阅读本文！祝你拥有美好的一天！' );
        if ( ! empty( $greeting_text ) ) {
            $greeting = '<p style="color:#666; font-style:italic;">'`. esc_html($greeting_text)`.'</p>';
            $content .= $greeting;
        }
    }
    return $content;
}

Maintenant, l’administrateur peut modifier librement le texte affiché sur la page “ Paramètres ” -> “ Salutations personnalisées ”, et l’affichage sur l’interface utilisateur est mis à jour en temps réel.

Préparation à la publication des plugins : internationalisation et renforcement de la sécurité

Avant de partager les plugins avec d’autres personnes ou de les soumettre au répertoire officiel, il reste quelques tâches importantes à effectuer, principalement en matière d’internationalisation et de renforcement de la sécurité.

Internationalisation du texte

L’internationalisation (i18n) permet de traduire vos plugins dans d’autres langues. Vous devez envelopper toutes les chaînes de caractères destinées aux utilisateurs à l’aide de fonctions spécifiques. Modifiez les chaînes de caractères dans notre plugin :

1. Dans les commentaires en tête du plugin, nous avons déjà défini… Text Domain。
2. Dans le code, utilisez… () Ou esc_html() La fonction enveloppe une chaîne de caractères. Par exemple :

    // 在设置页面函数中
    $greeting_text = get_option( 'mfgp_custom_greeting', __( ‘感谢您阅读本文！祝你拥有美好的一天！’， ‘my-first-greeting-plugin’ ) );
    echo ‘<h1>’ . esc_html__( ‘问候语插件设置’， ‘my-first-greeting-plugin’ ) . ‘</h1>’Dans la fonction d’affichage côté client (notez : l’affichage côté client ne nécessite généralement pas de traduction, sauf si c’est décidé par le thème ou l’utilisateur) :
    // Cependant, si le salut lui-même doit être disponible en plusieurs langues, une logique plus complexe pourrait être requise.

3. Utilisez des outils tels que Poedit pour créer… .pot Des fichiers modèles, à partir desquels les traducteurs peuvent créer des traductions. .po et .mo Les documents.

Renforcer la protection de la sécurité

La sécurité est de la plus haute importance. Nous avons déjà utilisé certaines fonctions de sécurité, telles que…sanitize_textarea_field、esc_html、esc_textareaetwp_nonce_fieldDe plus, il est également important de noter que :
* 权限检查：在管理页面函数开始处使用 current_user_can Effectuer une vérification.
* 数据验证与清理：对所有用户输入（如 $_POST, $_GET）进行验证（是否符合预期格式）和清理（移除非法字符）。
* 非竞态条件更新：对于重要的选项，考虑使用 wp_options Lors de la création de tables, une méthode plus sûre consiste à utiliser l’API Settings, qui intègre des mécanismes de contrôle anti-concurrentiel (nonce) et des vérifications d’autorisations.

résumés

À travers ce guide, nous avons suivi le parcours complet de création à publication d’un plugin WordPress complet et fonctionnel. Nous avons commencé par comprendre les bases des plugins, en créant le fichier principal contenant les informations de tête standard. Ensuite, nous avons mis en pratique le mécanisme des « hooks » (points d’ancrage) essentiels à WordPress en développant une fonction de salutation simple. Nous avons également ajouté une page de paramétrage en back-office pour permettre aux utilisateurs de personnaliser le plugin. Enfin, nous avons abordé les étapes clés avant la publication : l’internationalisation et le renforcement de la sécurité. Chaque étape a fait appel à des fonctions essentielles de WordPress ainsi qu’à des bonnes pratiques. Une fois que vous maîtriserez ces connaissances de base, vous pourrez essayer de développer des plugins plus complexes et plus créatifs, contribuant ainsi à l’écosystème WordPress à l’échelle mondiale.

FAQ Foire aux questions

Quelles connaissances préalables sont nécessaires pour développer des plugins pour WordPress ?

Vous devez posséder des connaissances de base en programmation PHP, ainsi qu'une compréhension des langages HTML et CSS. De plus, vous devez être familier avec les fonctionnalités de base de WordPress (articles, pages, menus). La maîtrise de la programmation orientée objet (OOP) n'est pas obligatoire, mais elle sera très utile pour le développement de plugins complexes.

Pourquoi mon plugin n’apparaît-il pas dans le menu en arrière-plan après avoir été activé ?

La raison la plus fréquente est un problème de droits d’accès. Veuillez vérifier vos autorisations avant d’appeler la fonction concernée.add_options_pageLors de l’utilisation d’une fonction similaire, il est important de vérifier si le deuxième paramètre (« capability ») a été correctement défini. Par exemple… ‘manage_options’De plus, veillez à ce que votre fonction ait été correctement implémentée et testée.add_action( ‘admin_menu’， ...)Le hook a été correctement chargé, et aucune erreur de syntaxe n’a empêché l’exécution de la fonction. Vous pouvez ajouter ce code en début de fichier.error_logUtilisez des fonctions pour effectuer le débogage.

Comment déboguer mon plug-in WordPress ?

Tout d’abord, assurez-vous que… wp-config.php Le mode de débogage de WordPress est activé dans le fichier : define( ‘WP_DEBUG’， true ); et define( ‘WP_DEBUG_LOG’， true );Ainsi, les messages d'erreur seront enregistrés. /wp-content/debug.log Le fichier se trouve à l’intérieur du dossier correspondant. De plus, il est possible de déboguer le code côté client en utilisant les onglets “ Console ” et “ Réseau ” des outils de développement du navigateur. Pour les logiques complexes, il est conseillé d’appliquer des méthodes de débogage appropriées.error_log( print_r( $variable， true ) );Écrire la valeur d'une variable dans un journal (un fichier de log) est une méthode couramment utilisée.

Comment mon plug-in est-il compatible avec d'autres plug-ins ou thèmes ?

Afin de garantir une compatibilité maximale, votre plugin devrait : 1) utiliser des préfixes uniques pour nommer toutes les fonctions, classes, variables et options (comme nous l’avons fait).mfgp_1) Pour éviter les conflits de nommage. 2) Lorsque vous ajoutez ou modifiez des styles pour l'interface utilisateur ou l'arrière-plan, essayez d'utiliser des noms de sélecteurs uniques. 3) Si possible, fournissez des crochets de filtre.apply_filtersCela permet à d’autres développeurs de modifier le fonctionnement de votre plugin. 4) Evitez de modifier directement les tables ou les fichiers de la base de données centrale de WordPress.