Formation PUB020 : WordPress, 2023 Les hooks (points d'ancrage)

26.1 Qu'est-ce qu'un « hook » ?


Un hook ou, en français, un point d'ancrage (parfois appelé crochet, emprise, point d'accroche ou point d'entrée), est un mécanisme qui permet aux développeurs d'effectuer une action précise à un moment particulier. Les développeurs de WordPress ont ainsi prévu de placer un point d'accroche à différents endroits, comme par exemple lors de l'affichage du titre d'une page. Ceci permet au développeur d'un thème ou d'une extension de modifier la façon dont le titre de la page est affiché sans avoir à modifier le noyau WordPress ni les fichiers modèles du thème parent.

▼Publicité Le texte se poursuit plus bas

Action vs filtre

Les points d'accroche sont classés en deux catégories : les actions et les filtres.

Les actions sont basées sur des événements. Par exemple, le point d'accroche publish_post permet d'ajouter des fonctionnalités qui seront exécutées à chaque fois qu'un article est publié.

Les filtres, quant à eux, permettent de modifier le texte qui sera affiché à l'écran ou enregistré dans la BD. Par exemple, le point d'accroche the_title permet d'ajuster la façon dont le titre d'un article ou d'une page sera affiché à l'écran.

Illustration d'un point d'accroche de type filtre

Tentons d'illustrer le fonctionnement d'un point d'accroche de type filtre.

Prenons une fonction hypothétique définie dans le noyau WordPress. Disons que cette fonction s'appelle une_fonction(). Elle s'occupe de récupérer une donnée dans la base de données puis de l'afficher à l'écran.

Mais avant d'afficher la donnée, elle met à la disposition des développeurs un point où ils pourront s'accrocher pour intervenir sur la donnée avant qu'elle ne soit affichée.

Le point d'accroche est illustré ici par un cercle mais dans les faits, le code utilise la fonction apply_filters(). pour les hooks de type filtre et do_action() pour les hooks de type action.

Fonction noyau WordPress définissant un hook

Sans même utiliser les points d'accroche, un thème peut utiliser cette fonction pour afficher la donnée à l'endroit où il le souhaite.

Fichier modèle qui appelle une fonction de l'API

Toujours sans utiliser les points d'accroche, il est possible, pour un thème enfant, d'apporter une modification à cette donnée avant qu'elle ne soit affichée en copiant le fichier modèle dans le thème enfant. Le thème enfant pourrait, par exemple, appliquer une classe CSS différente selon que la donnée est affichée dans une page ou dans un article.

Fichier modèle copié puis adapté dans le thème enfant

Le problème avec cette approche, c'est que lors de la mise à jour du thème parent, si des ajouts ont été apportés à ce fichier modèle, il faudra recopier ces ajouts dans le thème enfant pour qu'ils soient effectifs.

C'est ici que les points d'accroche deviennent intéressants : plutôt que de recopier le fichier modèle, on lancera notre crochet au point d'accroche prévu par la fonction afin d'y apporter les ajustements souhaités­. Ainsi, lorsque le fichier modèle du thème parent appellera la fonction, la donnée affichée sera celle retournée par la fonction associée au point d'accroche.

Exemple d'utilisation d'un hook

Liste des points d'accroche existants

L'utilisation des points d'accroche n'est pas complexe en soit. Il faut cependant apprendre quels points d'accroche utiliser. La liste est longue : il y a plus de 1500 points d'accroche. La liste de Adam R. Brown constitue un matériel de référence précieux.

Le Codex WordPress documente lui aussi les point d'accroche de type filtre et de type action :

Quelques exemples d'utilisation des points d'accroche

Rien de mieux qu'un exemple concret pour comprendre.

Voici comment utiliser un point d'accroche de type action qui permet d'envoyer un courriel à chaque fois qu'un article est ajouté au blogue1.

WordPress (PHP)

/**
 * Send email to my friends.
 * Source : https://developer.wordpress.org/reference/functions/add_action/
 *
 * @param int $post_id Post ID.
 * @return int Post ID.
 */
function monprefixe_email_friends( $post_ID ) {

   $friends = 'bob@example.org, susie@example.org';

   wp_mail( $friends, "sally's blog updated", 'I just put something on my blog: http://blog.example.com' );

 

   return $post_ID;

}

 

add_action( 'publish_post', 'monprefixe_email_friends' );

Voici maintenant un exemple d'utilisation d'un point d'accroche de type filtre. Son rôle est d'englober le titre d'un article dans un <div> afin de pouvoir contrôler son apparence par CSS.

Remarquez que la fonction reçoit en paramètre ce qui aurait été affiché sans le point d'accroche et qu'elle retourne ce qui sera effectivement affiché.

WordPress (PHP)

/**
 * Entoure le titre d'une division.
 * @author Christiane Lagacé <christiane.lagace@hotmail.com>
 *
 * @param string $titrearticle Titre original de l'article.
 *
 * @return string Titre de l'article entouré d'une division avec la classe titre.
 */
function monprefixe_englober_titre_dans_div( $titrearticle ) {

    return '<div class="titre">' . $titrearticle  . '</div>';

}

 

add_filter( 'the_title', 'monprefixe_englober_titre_dans_div' );

Dans ce dernier exemple, on utilise un filtre pour que les nouvelles pages et les nouveaux articles aient chacun leur texte par défaut quand ils sont créés dans le tableau de bord WordPress

Remarquez l'utilisation de global pour accéder à une variable définie par WordPress, donc en dehors de la fonction.

WordPress (PHP)

/**
 * Ajoute un texte par défaut aux nouveaux articles et aux nouvelles pages.
 * @author Christiane Lagacé <christiane.lagace@hotmail.com>
 *
 * @param string $content Contenu original (sera normalement vide).
 *
 * @return string Contenu par défaut.
 */
function monprefixe_texte_par_defaut_pour_pages_et_articles( $content ) {

    global $post_type;

 

    if ( $post_type == 'page' ) {

        $content = "Contenu par défaut pour les pages";

    } else {

        $content = "Contenu par défaut pour les articles";

    }

 

    return $content;

}

 

add_filter('default_content', 'monprefixe_texte_par_defaut_pour_pages_et_articles');

Source

1. « Function Reference/add action ». Codex WordPress. http://codex.wordpress.org/Function_Reference/add_action

Pour plus d'information

« Demystifying the WordPress Hook System ». SitePoint. http://www.sitepoint.com/wordpress-hook-system/

Veuillez noter que le contenu de cette fiche vous est partagé à titre gracieux, au meilleur de mes connaissances et sans aucune garantie.
Par Christiane Lagacé
Dernière révision le 18 novembre 2022
Merci de partager !

Site fièrement hébergé chez A2 Hosting.

Soumettre