Le site est en ligne depuis 305 jours. 23 articles sont publiés / 25 commentaires au total.

Comment créer votre premier plugin WordPress ?

L’idée vous a peut-être déjà traversée l’esprit … Et pourquoi ne pas créer votre propre plugin WordPress si aucun ne colle à vos besoins ? C’est une très bonne idée, et nous allons découvrir ça ensemble étape par étape !

Les bases du développement WordPress

WordPress est connu pour sa flexibilité et sa puissance (et un méga store avec des millions d’extensions), mais ce n’est pas un hasard !

La conception d’extensions ou de thèmes est très largement facilitée grâce à des notions propres à WP, et qu’il nous faudra maitriser pour développer le meilleur des plugins, parmi les plus importantes :

  • Les hooks (ou actions),
    • Qui sont « simplement » des points d’encrages sur lesquels vous allez pouvoir ajouter un callback lors de l’exécution de certaines actions.
      • Par ex. : Déclarer une fonction qui sera déclenchée lors de la soumission d’un formulaire, et qui vous enverra un SMS en suivant.
  • Les filtres,
    • Comme son nom l’identique, il vous permettra de « filtrer » certaines données directement utilisées par WordPress, avec vos propres fonctions.
      • Par ex. : Une fonction qui remplacera toutes les émojis par leur équivalent texte, en connectant un filtre à the_content de WP

Nous verrons plus tard plus en détail comment les utiliser, mais gardez ces deux noms dans un petit coin de votre tête !

Une autre ressource très utile, qui vous fera gagner des précieuses minutes d’espérance de vie : le codex WordPress.

Le codex, c’est l’encyclopédie des développeurs, vous retrouverez là bas tout ce dont vous avez besoin :

  • Une liste + doc de toutes les fonctions internes de WP,
  • Des guides de bonnes pratiques,
  • Des explications détaillées sur le fonctionnement interne,

Une extension WordPress, comment ça fonctionne ?

Alors, dans le principe, c’est « tout simple ». On parle d’un répertoire ajouté dans le chemin wp-content/plugins.

Ce dossier sera composé d’au moins un fichier php (portant le nom du plugin par convention), et qui contiendra tous les imports/fonctions nécessaires à son fonctionnement.

La déclaration de toutes les « métas » (titre/description/auteur …) se trouve dans ce fichier PHP (à travers un commentaire en haut de fichier, dans un certain formattage) + dans un README placé à la racine.

Le plugin sera alors listé dans les extensions disponibles, et pourra être utilisé et désactivé à la guise des utilisateurs !

Créer l’architecture de notre premier plugin

Et avant de commencer, on va parler de l’objectif de notre extension fictive : mettre en gras toutes les conjonctions de coordination dans les articles publiés (oui, je sais, on a fait mieux).

Une extension en somme toute assez basique, mais qui nous permettra de découvrir les notions importantes en terme de conception de plugin.

Voici le workflow littéral de son fonctionnement : Activation de l’extension → Filtrage de the_content lors de son déclenchement → Recherche des occurrences de conjonctions de coordination → Mise en gras → Retour de the_content

Ce plugin de démo s’appellera : Ornicar ?

Création du répertoire

Pour commencer, la première étape est de créer un répertoire au sein de votre arborescence WordPress : wp-content/plugins/ornicar

Une fois créé, vous pouvez ouvrir votre IDE préféré, et créez un fichier ornicar.php dans la racine de ce dossier.

Entêtes obligatoires

C’est une des étapes les plus importantes dans la création d’un plugin ! Comme dit plus tôt, c’est là qu’on va définir le nom du plugin, sa licence, sa description etc …

Ces entêtes doivent respecter une certaine forme, et se retrouver dans le fichier ornicar.php :

/*
 * Plugin Name:       Ornicar
 * Plugin URI:        https://lesvlogsdundev.com/
 * Description:       Plugin qui vous permettra de mettre en gras toutes les conjonctions de coordination 
 * Version:           1.0
 * Requires at least: 5.2
 * Requires PHP:      7.2
 * Author:            Rémi LVDD
 * Author URI:        https://lesvlogsdundev.com/
 * License:           GPL v2 or later
 * License URI:       https://www.gnu.org/licenses/gpl-2.0.html
 */
PHP

Chaque attribut parle de lui même, entre Plugin Name, Plugin URI, Description, Version

Je vous laisse ajuster ces informations, et continuer à l’étape suivante ! (si vous souhaitez avoir plus de détails sur tous les attributs possibles : https://developer.wordpress.org/plugins/plugin-basics/header-requirements/

Activation de votre plugin

Maintenant que votre plugin est formé, vous pouvez vous rendre dans le tableau de bord WordPress → Plugins, et cliquer sur Activer.

Tada ! Votre premier plugin est activé, mais … Il ne fait rien, et ça, on va vite y remédier !

Codez votre plugin !

Place au cœur du sujet : le code.

Nous allons utiliser quelques petites lignes de PHP ainsi que les fameux filtres proposés par WordPress directement :

function ornicar_filterContent($content) {
    $content='Je suis du contenu remplacé';
    return $content;
}
add_filter('the_content', 'ornicar_filterContent');
PHP

Nous déclarons une fonction : ornicar_filterContent (habituez vous à mettre un préfixe en début de fonction, avec nom de votre extension / un acronyme).

Celle-ci prend en argument le contenu actuel d’un article lors de son chargement, et pour l’instant le remplace par une chaine de caractère fixe !

On ajoute ensuite le filtrage de the_content via cette fonction, grâce à la dernière ligne !

Et … voici le résultat lorsqu’on recharge un article :

On constate que le contenu de tous les articles est bien remplacé ! Notre plugin fonctionne bien : à nous de le rendre utile pour mettre en gras seulement certains éléments du contenu, comme vu dans notre brief du début !

Rechercher / remplacer dans le filtre

En une seule petite ligne, et un peu d’expression régulière, on va atteindre notre but :

function ornicar_filterContent($content) {
    $content = preg_replace('/\b(et|ou|mais|donc|or|ni|car)\b/i', '<strong>$1</strong>', $content);
    return $content;
}
add_filter('the_content', 'ornicar_filterContent');
PHP

Comme vous pouvez voir, on modifie réellement le contenu avec preg_replace, et on le retourne, et ça suffit !

Voici le résultat sur une page article qui comporte des conjonctions de coordinations :

On reste sur un résultat assez « basique », mais avec un peu d’imagination et de documentation sur le codex, on va pouvoir trouver plus de filtres et d’actions pour réaliser des plugins plus complets !

Poussons un peu plus le plugin

On va pousser un peu plus le développement, et rajouter une boite méta dans l’éditeur WordPress, qui comptera le nombre d’occurrences de ces coordinations :

/* Register the ornicar counter metabox */
function ornicar_registerMetaBox() {
	add_meta_box( 'ornicar-counter', 'Toutes les répétitions des conjonctions de coordination', 'ornicar_counter', 'post' );
}
add_action( 'add_meta_boxes', 'ornicar_registerMetaBox' );

/* Callback of the metabox, counting the occurences and showing the result with an alert level */
function ornicar_counter($post) {
    $occurencesCounter=preg_match_all('/\b(et|ou|mais|donc|or|ni|car)\b/i', $post->post_content, $matches);
    $levelAlert=($occurencesCounter>10) ? 'Trop de conjonctions de coordination' : 'OK';
    echo '<p>Il y a '.$occurencesCounter.' conjonctions de coordination dans cet article. Niveau d\'alerte : '.$levelAlert.'</p>';
}
PHP

Cette fois-ci, on va utiliser une action de WordPress, qui s’appelle : add_meta_boxes

En s’y accrochant dessus, on va pouvoir lui demander de rajouter une boite méta dans l’éditeur de WordPress, sur les type de post : post (donc articles).

Ensuite, le callback appelé sera ornicar_counter, qui comptera toutes les occurrences et l’affichera à l’intérieur de cette méta !

Et voici donc le résultat dans l’éditeur :

Aller plus loin dans le développement

Maintenant que votre premier plugin est créé, la seule limite reste votre imagination.

WordPress (ainsi que beaucoup de plugins), fournis la liste exhaustive de ses hooks / filter : https://developer.wordpress.org/reference/hooks/

En vous basant là dessus, et avec quelques lignes de code, il vous sera possible de créer votre plugin de rêve, qui s’exécutera à un moment précis, et dans le contexte que vous souhaitez !

Je vous partagerais un peu plus tard les étapes pour la publication de votre plugin sur le store WordPress ! En attendant, je vous souhaite un bon développement !

🗞️ Ce contenu vous a plu ? Abonnez-vous à la newsletter !

Des nouveautés et des astuces autour du développement web directement dans votre boîte mail ! 📪


Commentaires

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *