Préparation et aménagement de l'environnement.
Avant de commencer à écrire du code, il est essentiel disposer d’un environnement de développement stable et efficace. Cela permet non seulement de maintenir une structure claire pour votre plugin au cours des développements futurs, mais aussi d’utiliser des outils modernes pour améliorer votre productivité.
Configuration de l'environnement de développement local
Nous recommandons l’utilisation d’un environnement serveur local, tel que Local by Flywheel, XAMPP ou MAMP. Ces outils vous permettent de mettre en place rapidement un environnement de développement pour WordPress sur votre ordinateur, comprenant Apache/Nginx, MySQL et PHP. Vérifiez que la version de PHP que vous utilisez est compatible avec celle du serveur cible, et activez la fonction de rapport d’erreurs ; cela vous aidera à identifier rapidement les problèmes au début du développement.
Choix d'un éditeur de code et d'outils
Le premier pas consiste à choisir un éditeur de code puissant, tel que Visual Studio Code, PhpStorm ou Sublime Text. Ces outils proposent généralement une mise en évidence du code syntaxique, des suggestions automatiques et une intégration avec des systèmes de contrôle de version. De plus, l’installation d’outils de mise en forme du code (comme PHP_CodeSniffer) et d’outils de débogage (comme Xdebug) améliorera considérablement votre expérience de développement ainsi que la qualité de votre code.
Lectures recommandées Guide complet pour le développement de thèmes WordPress : Construire des sites professionnels de zéro à un。
Créez votre premier plugin.
Maintenant, commençons par créer le plugin le plus simple pour comprendre la structure de base et le mécanisme d’activation des plugins WordPress.
Fichier principal du plugin et informations de tête de base
Chaque plugin WordPress doit disposer d’un fichier PHP principal, qui doit contenir les informations de tête standard du plugin afin que WordPress puisse le reconnaître. Nous allons créer un fichier nommé… my-first-plugin.php Le fichier…
Placez le code dans ce fichier, puis téléchargez-le dans le répertoire d’installation de WordPress. /wp-content/plugins/my-first-plugin/ Dans le dossier.
<?php
/**
* Plugin Name: 我的第一个插件
* Plugin URI: https://example.com/my-first-plugin
* Description: 这是一个用于学习的简单 WordPress 插件。
* Version: 1.0.0
* Author: 你的名字
* Author URI: https://example.com
* License: GPL v2 or later
* Text Domain: my-first-plugin
* Domain Path: /languages
*/ Après l’enregistrement, vous pourrez voir ce plugin sur la page des “ Plugins ” dans l’administration de WordPress, et vous pourrez leactiver en cliquant sur “ Activer ”. Pour l’instant, il n’a aucune fonctionnalité, mais vous avez réussi à créer un plugin reconnu par WordPress.
Ajouter une page de configuration pour le plugin.
Une demande fréquente consiste à ajouter une page de gestion en back-office pour un plugin. Cela peut être réalisé à l’aide des outils fournis par WordPress. add_menu_page() Ou add_options_page() Cela peut être réalisé à l'aide de fonctions.
Lectures recommandées Le guide ultime du développement de plugins WordPress : créer des extensions professionnelles de A à Z.。
Nous continuons à ajouter du code dans le fichier principal pour créer une page de paramétrage simple.
// 钩子:在管理员菜单中添加一个新的页面
add_action('admin_menu', 'mfp_add_admin_menu');
function mfp_add_admin_menu() {
add_options_page(
'我的插件设置', // 页面标题
'我的插件', // 菜单标题
'manage_options', // 所需权限
'my-first-plugin', // 菜单slug
'mfp_settings_page_html' // 用于显示页面内容的回调函数
);
}
// 设置页面的HTML内容
function mfp_settings_page_html() {
// 检查用户权限
if (!current_user_can('manage_options')) {
return;
}
?>
<div class="wrap">
<h1><?php echo esc_html(get_admin_page_title()) ; ? <?php echo esc_html(get_admin_page_title() ; ?</h1>
<p>Bienvenue sur la page de configuration de mon premier plugin !</p>
<form action="/fr/options.php/" method="post" data-trp-original-action="options.php">
<?php
// 输出设置字段(后续可在此添加)
settings_fields('mfp_options_group');
do_settings_sections('my-first-plugin');
submit_button('保存设置');
?>
<input type="hidden" name="trp-form-language" value="fr"/></form>
</div>
<?php
} Ce code utilise add_action() Le « crochet » (hook) permet d’associer une fonction à un événement spécifique. mfp_add_admin_menu Monté sur WordPress admin_menu Sur le plan des actions : lorsque le menu d’administrateur est créé, notre fonction est appelée, ce qui permet d’ajouter un nouvel élément de menu sous le menu principal “ Paramètres ”. En cliquant sur cet élément de menu, l’action correspondante est exécutée. mfp_settings_page_html Une fonction est utilisée pour rendre le contenu de la page.
Comprendre les hooks et les filtres de WordPress
La philosophie fondamentale de WordPress repose sur les “ hooks ” (crochets), qui vous permettent d’insérer du code personnalisé à des moments ou des emplacements précis, afin de modifier ou d’élargir les fonctionnalités de base de WordPress sans avoir à modifier directement les fichiers originaux. Les hooks se divisent principalement en deux catégories : les actions (Actions) et les filtres (Filters).
L'utilisation des crochets d'action.
Les « action hooks » exécutent votre code lorsque des événements spécifiques se produisent, par exemple lors de la publication d’un article, de la chargement de l’interface d’administration ou de l’affichage du pied de page. Ils ne sont pas conçus pour retourner de valeurs et sont principalement utilisés pour effectuer des tâches précises. add_action() Cette fonction permet d’associer une fonction de rappel (callback) à un crochet d’action spécifié.
Par exemple, nous voulons ajouter automatiquement une déclaration de droits d’auteur à la fin de chaque article. Cela peut être réalisé en utilisant… the_content Ce filtre (qui est également un point d’action) permet de réaliser cela. Cependant, afin de présenter l’action de manière plus pure, nous utilisons… wp_footer Le crochet affiche des informations en bas de la page d'accueil du site web.
add_action('wp_footer', 'mfp_add_footer_note');
function mfp_add_footer_note() {
if (is_single()) { // 仅在文章页面显示
echo '<p style="text-align:center; color:#666;">Cet article vous est présenté par mon plugin.</p>';
}
} L'utilisation des filtres hook.
Les hooks de filtre sont utilisés pour modifier les données avant qu’elles ne soient utilisées ou enregistrées dans une base de données. Ils s’attendent à ce que vous receviez une valeur, que vous la modifiiez, puis que vous la retourniez. Nous les utilisons… add_filter() Une fonction est utilisée pour charger (ou « monter ») une fonction de rappel (callback function).
Lectures recommandées Guide de début pour le développement de plugins WordPress : Créez vos propres modules de fonctionnalités personnalisées à partir de zéro。
Un exemple classique est la modification de la longueur de la résumé d’un article. La longueur par défaut du résumé dans WordPress est de 55 mots, et nous pouvons l’ajuster en… excerpt_length Utilisez un filtre pour le modifier.
add_filter('excerpt_length', 'mfp_custom_excerpt_length');
function mfp_custom_excerpt_length($length) {
// 将摘要长度修改为 20 个单词
return 20;
} Dans cet exemple, la fonction… mfp_custom_excerpt_length La valeur de longueur par défaut a été reçue. $lengthEnsuite, nous retournons la nouvelle valeur de longueur que nous avons définie, soit 20. WordPress utilisera cette valeur retournée pour générer le résumé.
La sécurité des plugins et les meilleures pratiques.
Développer un plugin populaire implique de prendre en compte des éléments tels que la sécurité, la maintenance et les performances. Respecter les meilleures pratiques permet d’éviter de nombreux problèmes courants.
Validation, échappement et nettoyage des données
Ne faites jamais confiance aux données saisies par les utilisateurs ou aux données provenant de la base de données. Avant de traiter ces données, il est indispensable de les vérifier, de les nettoyer et de les échapper (c’est-à-dire de les modifier pour éviter qu’elles ne soient interprétées de manière incorrecte par le système).
* 验证(Validation):检查数据是否符合预期的格式或类型(如是否是邮箱、数字等)。可以使用 filter_var() Fonction ou de WordPress sanitize_*() Une série de fonctions.
* 清理(Sanitization):清除数据中的非法或危险字符,使其变得安全。对于表单输入,常用 sanitize_text_field()。
* 转义(Escaping):在将数据输出到 HTML、JavaScript 或 URL 时,根据上下文进行转义,以防止跨站脚本(XSS)攻击。WordPress 提供了丰富的转义函数,如 esc_html()、esc_attr()、esc_url() et wp_kses_post()。
Par exemple, pour afficher de manière sécurisée une variable provenant d'une base de données :
// 假设 $user_input 是从数据库或表单获取的数据
echo '<div class="info">'`. esc_html($user_input)`.'</div>';
// 或者,如果允许一些安全的HTML标签
echo '<div class="info">'`. wp_kses_post($user_input)`.'</div>'; Internationalisation et localisation des plugins
Pour que votre plugin puisse être utilisé par des utilisateurs du monde entier, vous devez y ajouter une prise en charge de la traduction ; ce processus est appelé internationalisation (i18n). WordPress utilise le framework GNU gettext pour cela.
Tout d’abord, il faut envelopper toutes les chaînes de caractères à traduire à l’aide d’une fonction spécifique. La fonction la plus couramment utilisée est… __()(Utilisé pour les valeurs retournées) et _e()(Dédié à l'affichage direct des résultats.)
Modifiez le titre de la page de gestion que nous avons créée précédemment :
function mfp_settings_page_html() {
if (!current_user_can('manage_options')) {
return;
}
?>
<div class="wrap">
<h1><?php echo esc_html(get_admin_page_title()) ; ? <?php echo esc_html(get_admin_page_title() ; ?</h1>
<p><?php _e('欢迎来到我的第一个插件的设置页面!', 'my-first-plugin'); ?></p>
...
</div>
<?php
} Veuillez noter que chaque fonction de traduction contient un paramètre de type texte (‘ my-first-plugin ’), qui doit correspondre à celui défini dans les informations de tête du plugin. Text Domain Entièrement d'accord. Ensuite, vous pouvez utiliser un outil comme Poedit pour analyser les chaînes de caractères pouvant être traduites dans le code du plugin et générer les traductions nécessaires. .pot Créez un fichier modèle et créez-en des versions dans différentes langues. .po et .mo Veuillez traduire le fichier et le placer dans le répertoire des plugins. /languages/ Dans le dossier.
résumés
À travers ce guide, nous avons parcouru de manière systématique les étapes essentielles du développement de plugins pour WordPress. De la mise en place d’un environnement local et de la création d’un fichier principal contenant les informations de tête standard, en passant par l’utilisation des actions et des hooks pour interagir en profondeur avec le noyau de WordPress, jusqu’aux pratiques de sécurité et aux préparatifs pour l’internationalisation, vous avez acquis les connaissances de base nécessaires pour créer des plugins complets, sûrs et fiables. N’oubliez pas que de bons plugins résultent d’une structure de code claire, d’une gestion rigoureuse des aspects de sécurité et d’une expérience utilisateur soignée. La meilleure façon de continuer à apprendre est maintenant de mettre en pratique ce que vous avez appris, en commençant par la création de plugins qui résolvent de petits problèmes concrets, pour ensuite explorer progressivement des API et des fonctionnalités plus complexes.
FAQ Foire aux questions
Pour développer un plugin WordPress, quelles connaissances de base sont nécessaires ?
Vous devez maîtriser le langage de programmation PHP, qui est le langage de développement principal de WordPress. De plus, il est nécessaire de posséder une connaissance de base d’HTML, CSS et JavaScript pour gérer l’affichage et les interactions de l’interface utilisateur. Il est également avantageux de connaître les concepts de base des bases de données MySQL (telles que les opérations CRUD), car WordPress les utilise pour stocker les données. Enfin, il est essentiel de comprendre la structure de base et le processus de fonctionnement de WordPress.
Comment déboguer mon plug-in WordPress ?
Tout d’abord, activez le mode de débogage de WordPress dans le fichier wp-config.php. define('WP_DEBUG', true); et define('WP_DEBUG_LOG', true); Définissez cette valeur sur « true ». Cela permettra d’enregistrer les messages d’erreur dans le fichier /wp-content/debug.log, afin de ne pas les afficher directement aux visiteurs. De plus, en intégrant des outils de débogage professionnels tels que Xdebug à votre éditeur de code (par exemple, VS Code), vous pourrez mettre en place des points d’arrêt et effectuer des débogages pas à pas. En outre, les panneaux réseau et de console des outils de développement du navigateur vous aideront à vérifier les demandes AJAX ainsi que les erreurs de JavaScript du côté client.
Comment puis-je soumettre le plugin que j’ai développé au répertoire officiel des plugins de WordPress ?
Avant de soumettre votre plugin, veillez à ce qu’il respecte strictement les normes de codage et les meilleures pratiques officielles de WordPress, et effectuez une révision complète du code ainsi que des vérifications de sécurité. Vous devez vous inscrire sur un compte WordPress.org, puis soumettre votre fichier compressé de plugin sur la page de soumission des plugins. L’équipe d’audit vérifiera votre code pour s’assurer de son sécurité, de sa légalité et de sa conformité aux directives en vigueur. Une fois l’audit réussi, votre plugin sera inclus dans le catalogue officiel de WordPress, à la disposition des utilisateurs du monde entier pour téléchargement et installation.
Comment ajouter une option de configuration à mon plugin dans le Personalizer de WordPress ?
Le Customizer de WordPress offre une méthode de configuration avec prévisualisation en temps réel. Vous pouvez l’utiliser pour modifier les aspects visuels et les fonctionnalités de votre site web facilement et de manière intuitive. add_action('customize_register', 'your_function'); Un « crochet » (hook) dans une fonction de rappel (callback). your_function Dans ce document, il est mentionné que… (The document states that…) $wp_customize L’objet comprend une section (Section), une option de configuration (Setting) et un contrôleur (Control). Cela permet aux utilisateurs de modifier les paramètres à l’aide de l’interface de personnalisation et de voir en temps réel les effets sur le côté client, ce qui est particulièrement adapté à la gestion des paramètres d’apparence des thèmes et des plugins.
Quelle est la suite, quelle est la suite ?
Lecture approfondie et connaissances pratiques
Les articles suivants sont liés au sujet de cet article et peuvent faire l'objet d'une lecture plus approfondie. Il est souvent préférable de commencer par l'article qui se rapproche le plus de votre problème actuel, puis d'étendre progressivement la lecture aux sujets environnants.
- Guide pour la création de sites web modernes : Processus complet de la conception à la mise en ligne, et choix de la technologie à utiliser
- Analyse du processus central et des technologies clés de la construction de sites web
- Guide essentiel pour les débutants en création de sites web : une étude complète pour construire des sites web à haute performance, de zéro à un.
- Comprendre en profondeur le framework Tailwind CSS : des outils pratiques aux pratiques modernes du développement front-end
- Le guide ultime pour la création de sites web en 2026 : La procédure complète pour construire des sites web à haute performance à partir de zéro