Le WordPress d'aujourd'hui, décodé pour les développeurs

Éditeur de site (FSE)

Command Palette et un workflow d’agence : automatiser la création de templates

Enregistrement d'une commande personnalisée dans la Command Palette de WordPress 6.3, pour créer un template type en un clic sur chaque nouveau projet.

Par WordPress Développement • 2 novembre 2023 • 4 min de lecture • Aucun commentaire
Command Palette et un workflow d'agence : automatiser la création de templates

Sept minutes : c’est le temps moyen que passait un développeur d’agence à recréer, projet après projet, le même squelette de template de page de service — en-tête, bloc d’accroche, grille de trois colonnes, appel à l’action — avant que la Command Palette de WordPress 6.3 ne permette d’automatiser cette étape répétitive.

Ce billet décrit l’enregistrement d’une commande personnalisée dans la Command Palette pour créer ce template type en un clic, à partir de patterns déjà enregistrés dans le thème bloc de l’agence. Les commandes natives de WordPress et l’ensemble de l’API des commandes ne sont pas détaillés ici, ce billet se concentrant sur l’enregistrement d’une commande sur mesure.

Le problème d’un geste répété sur chaque projet

L’agence livre régulièrement des sites vitrines à partir d’un même thème bloc de base, personnalisé projet par projet. Le template de page de service revient systématiquement, avec la même structure de blocs, mais un contenu différent à chaque fois. Avant l’automatisation, un développeur créait ce template manuellement dans l’éditeur de site, en insérant un à un les patterns nécessaires depuis l’inserteur de blocs.

La Command Palette, introduite dans WordPress 6.3 et accessible via le raccourci Ctrl+K ou Cmd+K, permet d’enregistrer des commandes personnalisées côté JavaScript via le hook useCommand du paquet @wordpress/commands. C’est ce mécanisme qui a servi de base à cette automatisation.

Enregistrer la commande

La commande est enregistrée depuis un script chargé uniquement dans l’écran de l’éditeur de site, via useCommand, avec un intitulé explicite et une icône reconnaissable dans la palette.

L'essentiel à retenir : Une commande personnalisée crée un template avec ses patterns par défaut ; Gain de temps sur chaque nouveau projet client ; API useCommand plutôt que macro externe
import { useCommand } from '@wordpress/commands';
import { dispatch } from '@wordpress/data';

function CreerTemplateService() {
    useCommand( {
        name: 'wpm/creer-template-service',
        label: 'Créer le template de page de service',
        icon: 'layout',
        callback: async () => {
            await dispatch( 'core' ).saveEntityRecord( 'postType', 'wp_template', {
                slug: 'page-service',
                title: 'Page de service',
                content: wpmContenuTemplateService,
                status: 'publish',
            } );
        },
    } );

    return null;
}

La constante wpmContenuTemplateService contient le balisage de blocs complet du template type, généré une fois pour toutes depuis un template existant exporté via wp template list --format=json puis nettoyé de ses identifiants spécifiques au projet d’origine.

Rendre la commande disponible dans l’éditeur

Le composant CreerTemplateService est monté via un filtre editor.BlockEdit détourné en point d’ancrage discret, une pratique acceptée en attendant une API de montage dédiée plus explicite dans les versions ultérieures de Gutenberg. Il est enfilé uniquement sur l’écran site-editor.php, pour ne pas alourdir les autres écrans d’administration.

  • La commande apparaît dans la Command Palette dès la frappe des premiers caractères de « service » ou « template ».
  • Un seul clic crée le post wp_template complet, patterns inclus, prêt à recevoir le contenu spécifique au projet en cours.
  • Le développeur n’a plus qu’à remplacer les textes d’exemple par le contenu réel du client, la structure de blocs étant déjà correcte.

Étendre à d’autres templates récurrents

Le même mécanisme a ensuite été dupliqué pour deux autres templates récurrents de l’agence : une page de contact avec formulaire et une page d’équipe avec grille de profils. Chaque commande reste indépendante, ce qui permet de les activer ou de les retirer projet par projet selon les besoins spécifiques du client.

Automatiser un geste répété dix fois par mois libère un temps de développement modeste par occurrence, mais significatif cumulé sur une année d’activité.

Limites de l’approche

Cette commande reste un outil interne à l’agence, distribué manuellement dans le thème de base et non publié comme extension. Elle suppose une discipline de mise à jour : toute évolution du template type doit être répercutée dans la constante de contenu, sous peine de voir la commande créer un template obsolète par rapport aux standards visuels actuels de l’agence.

Notre verdict

La Command Palette de WordPress 6.3 ouvre un espace d’automatisation interne peu exploité par les agences, souvent réservé aux grandes commandes natives de navigation. Pour un studio qui répète les mêmes structures de site d’un client à l’autre, quelques commandes personnalisées bien choisies suffisent à réduire une friction quotidienne sans nécessiter le développement d’une extension complète.

Laisser un commentaire

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

Partager :

À propos de l'auteur

WordPress Développement

Développeur WordPress, passionné par Elementor, le FSE et l’automatisation par IA.

Voir tous ses articles

Dans la même veine

À lire aussi