Nouveautés de WordPress 6.4 : Blocks Hooks, amélioration du flux de travail, nouveaux outils de conception, thème par défaut inédit, et bien plus encore
Il est temps d’explorer les fonctionnalités et améliorations les plus notables de la nouvelle version de WordPress, WordPress 6.4.
Parmi les ajouts les plus intéressants, on trouve les Blocks Hooks, une organisation améliorée des modèles, une palette de commandes redessinée et améliorée, des modifications au niveau des pages de pièces jointes, un effet de visionneuse pour les images, ainsi que plusieurs améliorations dans le flux de travail de rédaction.
L’amélioration du chargement des modèles, le raffinement des stratégies de chargement des scripts et d’autres améliorations des performances contribueront à accélérer le fonctionnement de votre site WordPress. Les améliorations de l’affichage en liste et diverses mises à jour de l’interface utilisateur de l’administrateur rendront cette dernière plus conviviale et accessible.
WordPress 6.4 introduit également un nouveau thème par défaut, doté de nombreux modèles prêts à l’emploi, simplifiant ainsi votre processus d’édition.
C’est une liste impressionnante d’innovations, n’est-ce pas ? Alors, ne tardez pas à découvrir tout ce que WordPress 6.4 a à offrir.
Les Block Hooks, anciennement appelés Auto-inserting blocks, offrent la possibilité aux extensions d’interagir automatiquement avec l’éditeur Gutenberg.
Plus précisément, grâce aux Block Hooks, un bloc peut être automatiquement positionné à un emplacement spécifique dès qu’un autre bloc est ajouté au contenu.
Deux principes guident le fonctionnement des Block Hooks :
L’utilisateur ne doit pas être sollicité pour insérer manuellement le bloc dans l’éditeur, et l’insertion du bloc dans la partie publique doit se faire immédiatement après l’activation de l’extension fournissant le bloc accroché. La désactivation de l’extension devrait automatiquement supprimer le bloc.
Le bloc doit être visible dans l’éditeur, et l’utilisateur doit pouvoir contrôler l’insertion automatique.
Pour respecter ces principes et préserver les informations contenues dans le code, les blocs accrochés fonctionnent uniquement dans les modèles et parties de modèles non modifiés, ainsi que dans les modèles fournis par les thèmes, copiés à partir du répertoire des modèles ou enregistrés avec la fonction register_block_pattern. Ils ne fonctionnent pas dans le contenu des messages, les modèles et parties de modèles modifiés, et les modèles créés par les utilisateurs.
Par ailleurs, la note de développement met en garde :
À partir de WordPress 6.4, il n’est pas possible d’insérer automatiquement des blocs qui ont une fonction de sauvegarde, sinon des erreurs de validation de bloc se produiront. En termes simples, cela signifie que les Block Hooks fonctionnent avec des blocs dynamiques, et non avec des blocs statiques.
Vous pouvez mettre en œuvre les Block Hooks de deux manières : en utilisant le fichier block.json ou en utilisant le nouveau filtre hooked_block_types.
Accrocher des blocs via block.json
L’utilisation de block.json représente une méthode simple et rapide pour attacher un bloc tiers, bien que cela ne confère pas une grande flexibilité. Cela signifie qu’un bloc automatiquement inséré via block.json sera attaché à toutes les instances de la cible sans condition.
Vous pouvez intégrer des blocs accrochés en utilisant la nouvelle propriété blockHooks, qui prend un objet de paires clé/valeur. La clé représente le nom du bloc que vous souhaitez attacher, et la valeur spécifie sa position par rapport au bloc cible.
Les positions disponibles sont les suivantes :
before : avant le bloc cible.
after : après le bloc cible.
firstChild : premier enfant du bloc conteneur cible.
lastChild : dernier enfant du bloc conteneur cible.
Par exemple, vous pouvez lier un bloc à chaque bloc d’espacement en utilisant blockHooks de la manière suivante :
{
blockHooks:{
'core/spacer': 'after'
}}
Lorsque vous utilisez firstChild ou lastChild avec block.json, un nouveau panneau « Extensions » dans l’inspecteur de blocs répertorie les blocs censés être insérés automatiquement. Des options sont fournies pour activer ou désactiver l’insertion automatique de ces blocs.
Accrocher des blocs à l’aide de hooked_block_types
Une approche plus flexible pour attacher des blocs à une cible consiste à utiliser le nouveau filtre hooked_block_types. Ce filtre offre la possibilité d’accrocher des blocs de manière inconditionnelle, similaire à la méthode block.json, ou en fonction d’une condition spécifique, comme attacher un bloc à une cible en fonction du modèle, de la partie du modèle, ou de la composition dans laquelle il est situé.
La fonction de rappel de hooked_block_types accepte quatre paramètres :
$hooked_blocks : Un tableau de blocs accrochés.
$position : Il peut être before, after, first_child ou last_child.
$anchor_block : Le nom du bloc d’ancrage.
$context : Le modèle de bloc, la partie de modèle ou la composition à laquelle le bloc d’ancrage appartient.
Améliorations du système de compositions
Les compositions de blocs représentent un outil de conception puissant, permettant la construction de structures complexes de blocs dans votre contenu ou vos modèles de manière simple. Vous pouvez utiliser les compositions fournies par votre thème de bloc ou en ajouter d’autres en les copiant depuis le répertoire des compositions.
Il est également possible de créer vos propres compositions à partir de zéro via l’interface de l’éditeur de site/publication. Pour les utilisateurs familiarisés avec le codage, l’ajout de compositions à votre thème actuel, ou à un thème enfant, peut se faire à l’aide d’un fichier .php. Les compositions jouent un rôle crucial dans l’écosystème WordPress.
Avec WordPress 6.4, des améliorations significatives ont été apportées au système de compositions. Tout d’abord, l’introduction des catégories de compositions. Dans les versions précédentes de WordPress, lors de la création d’une nouvelle composition, vous ne pouviez définir que le nom et le type de composition, qu’il soit synchronisé ou non synchronisé.
Avec la version 6.4, vous avez désormais la possibilité d’ajouter une catégorie à votre composition, ce qui la rend plus facilement identifiable dans l’éditeur de site et de publications. De plus, la modification des catégories est possible lors de la modification de la composition. L’onglet « Compositions synchronisées » de l’outil d’insertion de blocs a été supprimé, et toutes vos compositions sont désormais accessibles depuis le même onglet « Compositions ». Importer ou exporter des compositions au format JSON depuis l’éditeur de site est également plus facile. D’autres ajustements améliorent la compatibilité des compositions avec les thèmes classiques, ouvrant la voie à des implémentations futures.
Twenty Twenty-Four
Twenty Twenty-Four est le nouveau thème WordPress par défaut introduit avec WordPress 6.4. Il s’agit d’un thème multifonctionnel et minimal conçu pour répondre principalement à trois cas d’utilisation : les propriétaires de petites entreprises, les photographes et artistes, ainsi que les écrivains et blogueurs.
À noter que Twenty Twenty-Four n’ajoute pas de fonctionnalités spécifiques à votre site web. Il se présente plutôt comme une collection de modèles et de compositions. Ces éléments, combinés, offrent une grande variété de possibilités pour la création de sites web.
De manière additionnelle, le thème propose un contenu par défaut substantiel, comprenant de nombreux exemples concrets de structures de pages. Vous avez la possibilité d’éditer et de personnaliser ces exemples en fonction de vos besoins spécifiques.
Nouveaux outils et fonctionnalités de conception
Avec WordPress 6.4, divers outils et fonctionnalités de conception font leur entrée. Parmi les plus notables, citons :
Contrôle des couleurs pour le bloc de contenu
Le bloc Contenu, étant un sous-élément du bloc Boucle de requête, trouve une utilité particulière lorsque vous souhaitez personnaliser l’apparence du contenu au sein d’une boucle de requête. Il est accessible dans l’éditeur de publications lors de la modification d’une boucle de requête et dans l’éditeur de site lors de la création ou de la modification d’un modèle.
Avec WordPress 6.4, le bloc Contenu a été amélioré pour prendre en charge les couleurs, permettant ainsi la personnalisation du texte, de l’arrière-plan et des liens.
Prise en charge des blocs d’images d’arrière-plan
Une nouvelle fonctionnalité de prise en charge des blocs d’image d’arrière-plan a été ajoutée avec WordPress 6.4, avec le bloc Groupe activé par défaut.
Lorsqu’un thème utilise la fonctionnalité appearanceTools dans le fichier theme.json, un panneau Arrière-plan affiche le contrôle de l’image d’arrière-plan correspondant, offrant également un aperçu de l’image d’arrière-plan.
La définition d’une image d’arrière-plan ajoute la propriété background-image à l’élément div du bloc, accompagnée d’une déclaration background-size: cover assurant que l’image couvre le bloc du groupe.
Deux méthodes sont disponibles pour ajouter la prise en charge des images d’arrière-plan à vos thèmes. La première, plus simple, consiste à opter pour la propriété appearanceTools, qui permet l’utilisation de divers outils de conception, y compris les images d’arrière-plan.
Si vous avez besoin d’un contrôle plus précis sur les outils de conception, vous pouvez utiliser la propriété backgroundImage dans votre fichier theme.json de la manière suivante :
Une nouvelle fonctionnalité introduite avec WordPress 6.4 est le bouton « Agrandir au clic » dans le panneau Réglages d’image de bloc. Ce bouton vous permet d’activer ou de désactiver l’effet lightbox sur vos images. Il s’agit de la première itération de cette fonctionnalité, qui devrait être améliorée dans les versions à venir.
L’effet de visionneuse fonctionne également avec les filtres duotone, bien que son utilisation puisse être déroutante dans le contexte des galeries d’images. Au moment de la rédaction, il n’est pas possible d’activer l’effet de visionneuse au niveau de la galerie ; vous devez activer cette fonctionnalité individuellement pour chaque image.
Cette fonctionnalité était précédemment implémentée via des extensions dans les versions antérieures de WordPress, mais elle est désormais intégrée au cœur du système, réduisant ainsi le recours à du code tiers pour votre site WordPress.
Orientation verticale du texte
Une autre nouveauté de WordPress 6.4 est l’introduction d’une option d’orientation du texte permettant aux thèmes de prendre en charge le texte vertical. Si votre thème intègre cette fonctionnalité, vous pouvez activer l’orientation du texte de droite à gauche dans les réglages de typographie.
Il est important de noter que cette fonctionnalité est désactivée par défaut. Les développeurs de thèmes peuvent ajouter la prise en charge de l’orientation du texte en intégrant un nouveau réglage writingMode dans leur fichier theme.json.
{
settings:{"typography":{"writingMode":true}}}
Il est également possible de définir un comportement par défaut différent pour des blocs spécifiques. Par exemple, l’exemple suivant montre comment définir l’orientation vertical-rl pour tous les blocs de paragraphe :
Améliorations pour le bloc des notes de bas de page
WordPress 6.4 apporte plusieurs améliorations au bloc Notes de bas de page. Désormais, il prend en charge les couleurs pour les liens, l’arrière-plan et le texte. De plus, il offre des contrôles pour la typographie, les dimensions et les bordures. Les contrôles de couleur du texte et des liens sont étendus par défaut, tandis que les autres contrôles sont réduits au chargement de la page.
Boutons autorisés dans le bloc Navigation
Le bloc Navigation voit une mise à jour avec l’ajout de la possibilité d’inclure des boutons parmi les éléments internes autorisés. Lorsque vous créez un nouvel élément de menu, vous pouvez facilement le transformer en bouton grâce à la barre d’outils du bloc.
Améliorations de l’interface utilisateur et du flux de travail
WordPress 6.4 propose plusieurs améliorations notables pour l’interface de l’éditeur, visant à enrichir l’expérience d’édition et à simplifier le flux de travail. Parmi nos changements préférés, citons :
Palette de commandes améliorée
Introduite pour la première fois avec WordPress 6.3, la palette de commandes facilite le lancement d’actions fréquemment utilisées dans l’interface de l’éditeur de site. WordPress 6.4 marque une nouvelle avancée avec une mise à jour du design et quelques améliorations supplémentaires.
Les images ci-dessous illustrent un exemple de comportement différent de la palette de commandes entre WordPress 6.3 et 6.4.
Cette version introduit également de nouvelles commandes tout en améliorant la cohérence et la dénomination. Les nouvelles commandes comprennent les transformations de blocs, ainsi que les options de duplication, de copie, de suppression et d’insertion avant/après.
Une légère modification consiste à supprimer les verbes au début de nombreuses commandes, améliorant ainsi la recherche et la clarté de plusieurs actions. La nouvelle version ajoute également des commandes de sélection de blocs. Par exemple, en sélectionnant quelques blocs dans l’éditeur de site et en appuyant sur cmd + k (MacOS) ou ctrl + k (Windows), puis en saisissant une clé de recherche telle que « transform », vous verrez les suggestions suivantes :
Vous pouvez effectuer plusieurs commandes sur une sélection de blocs, telles que l’ajout avant, l’ajout après, la suppression, la duplication, le déplacement vers, le regroupement, la dissociation et la transformation en, parmi d’autres.
Amélioration de la vue en liste
La vue en liste vous permet d’explorer le contenu de la page et d’effectuer diverses actions sur les blocs, les groupes et les compositions. Ces actions incluent la copie, la duplication, le regroupement, et bien d’autres. Cette fonction est particulièrement utile pour les structures complexes de blocs imbriqués, vous permettant de développer et de réduire des groupes d’éléments et d’effectuer plusieurs actions sur des blocs, des groupes et des compositions individuelles.
À partir de WordPress 6.4, des améliorations ont été apportées à la vue en liste. Vous pouvez désormais renommer un groupe de blocs, prévisualiser les images pour les blocs Galerie et Image, ainsi que dupliquer des blocs en utilisant le raccourci cmd + shift + d (ctrl + shift + d sur Windows).
Barres d’outils attachées
Lorsque vous éditez des blocs avec plusieurs enfants, travailler avec les blocs internes peut être difficile. Cela est particulièrement vrai pour le bloc Navigation.
Avant WordPress 6.4, lors de la sélection des blocs internes, la barre d’outils du bloc se déplaçait vers une position différente à l’écran, entraînant une expérience utilisateur peu pratique pour des blocs tels que Navigation et Liste.
Depuis WordPress 6.4, la barre d’outils du bloc enfant est attachée à la position du parent. Ainsi, lorsque vous passez d’un bloc à l’autre, la barre d’outils reste fixée au même endroit que le parent. Cette fonctionnalité de barre d’outils attachée est actuellement mise en œuvre dans les blocs Navigation, Liste et Citation.
Améliorations des performances et autres changements pour les développeurs
WordPress 6.4 intègre plus de 100 mises à jour de performance, ainsi que plusieurs changements destinés aux développeurs de thèmes. Voici quelques changements intéressants :
Stratégies de chargement des scripts
Les stratégies de chargement des scripts ont été introduites avec WordPress6.3 pour éviter que les scripts ne soient chargés dans un ordre inattendu dans l’arbre de dépendance des scripts, en utilisant les attributs async et defer.
Avec WordPress 6.4, les stratégies de chargement de scripts sont maintenant implémentées pour les scripts frontend dans les thèmes principaux et les thèmes intégrés.
De plus, à partir de WordPress 6.4, les scripts « chargés avec l’attribut defer » ont été déplacés du pied de page vers la section head, ce qui permet de les découvrir plus tôt pendant le chargement du document et d’accélérer leur exécution une fois le document chargé.
D’autres changements ont été apportés pour améliorer la sécurité de base et la maintenabilité. Pour une compréhension plus technique du chargement des scripts, vous pouvez consulter la note de développement de WordPress 6.4.
Changements dans les pages de fichiers joints
À partir de WordPress 6.4, les pages de fichiers joints sont entièrement désactivées pour les nouvelles installations de WordPress.
Auparavant, WordPress créait automatiquement une page de fichier joint pour chaque fichier multimédia téléversé. Cependant, cela n’était pas pertinent pour de nombreux sites web. Ces pages étaient indexées par les moteurs de recherche, ce qui pouvait entraîner une expérience utilisateur médiocre.
Depuis WordPress 6.4, une option de la base de données, wp_attachment_pages_enabled, permet de contrôler le comportement des pages de fichiers joints.
Cette option est réglée sur 1 pour les sites web existants (pages de pièces jointes activées) et sur 0 pour les nouveaux sites web (pages de fichiers joints désactivées) à partir de WordPress 6.4.
Les administrateurs de site peuvent modifier cette valeur via WP CLI :
wp option set wp_attachment_pages_enabled 0|1
Ou en visitant wp-admin/options.php sur votre site web et en modifiant la valeur de l’option wp_attachment_pages_enabled.
Composant ProgressBar
Un nouveau composant horizontal de base, ProgressBar, a été introduit pour remplacer le composant Spinner utilisé précédemment lors du chargement de contenu dans l’éditeur de site.
Chargement des compositions dans WordPress 6.4
Avant WordPress 6.4, la fonction `_register_theme_block_patterns()` était utilisée pour enregistrer toutes les compositions que le thème actif pouvait fournir dans son répertoire « patterns ». Cependant, en raison des nombreuses opérations de fichiers nécessaires par cette fonction, son utilisation a entraîné un problème de surcharge de ressources, particulièrement perceptible avec les thèmes fournissant de nombreuses compositions, comme Twenty Twenty-Four.
Pour résoudre ce problème, WordPress 6.4 introduit une nouvelle fonction, `_wp_get_block_patterns()`, qui stocke les compositions dans un cache transitoire. Grâce à cette nouvelle fonction, les requêtes suivantes n’ont pas besoin de rechercher des fichiers, améliorant considérablement les performances.
Les développeurs peuvent contourner le cache de compositions en activant le mode développement pour un thème, en mettant à jour le numéro de version du thème, en changeant de thème, ou en appelant la méthode `WP_Theme::delete_caches()`.
Moins de vérifications de l’existence des fichiers
Auparavant, certaines fonctions de l’API des thèmes exécutaient plusieurs vérifications de l’existence de fichiers dans un thème enfant avant de revenir au thème parent. Cela n’était pas optimal car ces fonctions ne tenaient pas compte du fait que le thème en cours était un thème enfant ou non.
Pour éviter les vérifications inutiles de l’existence de fichiers, plusieurs fonctions et méthodes de l’API Themes ont été mises à jour et vérifient désormais si le répertoire de la feuille de style du thème actuel correspond au répertoire du modèle avant de procéder aux vérifications de l’existence de fichiers.
Ces changements devraient considérablement améliorer les performances, en particulier pour les thèmes qui ne sont pas des enfants.
D’autres améliorations des performances concernent les fonctions `get_block_theme_folders()` et `the_header_image_tag()`.
Nouvelle fonction d’options
Les options sont désormais chargées automatiquement par défaut. Cependant, lorsque cela entraîne un trop grand nombre d’options, cela peut ralentir le temps de réponse du serveur et causer des problèmes. Pour remédier à cela, les développeurs d’extensions peuvent désormais profiter de plusieurs nouvelles fonctions pour gérer les options, améliorer les performances et définir un comportement par défaut différent.
Deux fonctions permettent de récupérer plusieurs options avec une seule requête de base de données :
`prime_options()`: Cette fonction récupère plusieurs options en une seule requête de base de données. Les valeurs des options sont stockées dans le cache, évitant ainsi des requêtes supplémentaires à la base de données lors des appels ultérieurs à `get_option()`. Cette fonction prend un tableau de noms d’options et ne renvoie aucune valeur d’option, sa seule responsabilité étant de mettre à jour le cache correspondant.
`prime_options_by_group()`: Fonctionnant de manière similaire à `prime_options()`, cette fonction concerne un groupe d’options spécifique.
Deux autres fonctions permettent de définir les valeurs de chargement automatique des options :
`wp_set_option_autoload_values()`: Utilisée pour définir la valeur de chargement automatique pour une seule option.
`wp_set_options_autoload_values()`: Permet de définir les valeurs de chargement automatique pour plusieurs options.
Changements supplémentaires pour les développeurs
Remplacement des balises de style codées en dur par `wp_add_inline_style()`.
Valeurs minimales et maximales configurables pour la typographie fluide dans `theme.json`.
Désactivation des contrôles de mise en page dans `theme.json`.
Définition du mode d’édition des blocs en utilisant le nouveau crochet `useBlockEditingMode`.
Amélioration de la fonction `wp_get_loading_optimization_attributes()` avec de nouveaux filtres pour contrôler les attributs d’optimisation du chargement.
Introduction de l’API `registerInserterMediaCategory` pour permettre aux développeurs d’extensions d’enregistrer des catégories de médias d’insertion personnalisées.
Deux nouvelles fonctions, `wp_get_admin_notice()` et `wp_admin_notice()`, qui réduisent la charge de maintenance, encouragent la cohérence et permettent le filtrage des arguments et des messages pour toutes les notifications d’administration.
Amélioration du système de mise en cache de WP_Term_Query de WP_Query, réduisant les requêtes de base de données et améliorant l’efficacité globale.
Amélioration du balisage des pages de connexion et d’inscription pour optimiser leur structure et offrir aux développeurs une plus grande flexibilité dans les personnalisations.
Conclusion
La troisième version de WordPress en 2023 présente une gamme étendue de fonctionnalités, des outils de conception inédits et des améliorations significatives de l’interface utilisateur, comprenant des corrections de bugs et divers ajustements. Un nouveau thème par défaut polyvalent et épuré accompagne cette version, offrant une multitude de compositions et de modèles personnalisables pour répondre à des besoins spécifiques.
