WordPress 7.1 « Mary Lou » : styles responsives, médias et API pour les développeurs

WordPress 7.1, dont le nom de code est « Mary Lou », met l’accent sur les gestes quotidiens dans l’administration, la conception de sites et le travail collaboratif. Cette version rend les styles responsives accessibles depuis l’éditeur, refond le flux d’édition des médias et étend plusieurs API destinées aux développeurs.

La version rend hommage à Mary Lou Williams, pianiste, arrangeuse et compositrice de jazz. Elle a traversé le swing, le bebop et le jazz sacré, tout en renouvelant continuellement son style et en faisant de son appartement de Harlem un lieu d’échange pour les musiciens de bebop dans les années 1940.

Télécharger WordPress 7.1 wordpress-7.1.zip

Adapter les blocs à chaque écran

WordPress 7.1 ajoute des contrôles de style responsive dans l’éditeur de site. Vous pouvez définir l’apparence d’un bloc selon la taille de l’écran, soit depuis les styles globaux, soit dans les réglages du bloc, sans écrire de CSS personnalisé.

Les options de style responsive s’ajoutent aux réglages existants qui affichent ou masquent les blocs. L’éditeur propose aussi un aperçu à plusieurs tailles de viewport pendant la conception, ce qui permet de vérifier directement l’adaptation des mises en page aux différents appareils.

Retrouver la barre d’administration dans tous les éditeurs

La barre d’administration accompagne désormais vos déplacements dans tous les éditeurs. Elle conserve ainsi les outils habituels et les repères de navigation, que vous écriviez une publication ou modifiiez la conception du site.

WordPress ajuste également légèrement son rendu visuel afin d’unifier davantage cette expérience entre le tableau de bord et les éditeurs.

Éditer les images dans une fenêtre dédiée

Le bouton « Recadrer » ouvre toujours l’outil d’édition des images, mais WordPress le présente maintenant dans une fenêtre dédiée plutôt que dans l’interface de recadrage intégrée précédente. Ce flux centralise les opérations liées à l’image.

Vous pouvez recadrer librement ou selon un ratio, retourner l’image horizontalement ou verticalement, régler précisément sa rotation ou l’aligner par incréments, puis modifier ses métadonnées au même endroit.

Collaborer avec des notes plus précises

Les notes prennent désormais en charge le texte enrichi et les mentions. Vous pouvez mettre du texte en gras ou en italique, insérer du code ou des liens, puis saisir @ pour mentionner un collaborateur et le notifier.

Vous pouvez attacher une note à une sélection de texte, et non plus seulement à un bloc entier. Un même bloc peut héberger plusieurs conversations, tandis que les longues notes se replient pour conserver une marge lisible pendant la relecture.

Traiter davantage de médias dans le navigateur

WordPress compresse, redimensionne et génère maintenant les miniatures des images dans le navigateur. Le serveur traite donc moins de données, les fichiers produits sont plus petits et les envois volumineux évitent les limites de mémoire PHP ainsi que les délais d’expiration.

Le traitement s’appuie sur une compilation WebAssembly de libvips. WordPress 7.1 prend aussi en charge nativement les images AVIF et HEIC, ainsi que les gain maps HDR, des formats que produisent déjà les appareils photo et téléphones récents.

Utiliser les nouveaux blocs et contrôles de présentation

Créer des playlists

Le nouveau bloc Playlist rassemble plusieurs pistes audio dans une même liste de lecture. Vous pouvez ajouter une forme d’onde facultative pour donner aux auditeurs un repère visuel pendant la lecture de chaque piste.

Définir les points de rupture dans theme.json

Les thèmes de blocs peuvent maintenant définir leurs propres points de rupture mobile et tablette dans theme.json. Ces valeurs remplacent les valeurs par défaut utilisées par les styles responsives et par la visibilité des blocs.

Organiser du contenu en onglets

Le nouveau bloc Onglets organise des contenus liés dans des panneaux à onglets. Il évite d’afficher toutes les informations simultanément et réduit ainsi l’encombrement d’une page.

Ajouter des icônes personnalisées

Vous pouvez enrichir la bibliothèque d’icônes de WordPress avec vos propres collections. Elles deviennent disponibles dans l’ensemble de l’éditeur aux côtés de la bibliothèque intégrée, notamment pour le bloc Icône.

Définir les états interactifs des boutons

Les contrôles de style de l’éditeur permettent maintenant de définir les états hover, focus et active du bloc Bouton. Vous pouvez régler ces styles pour un seul bouton ou les appliquer à tous les boutons.

Rendre le canevas d’édition plus fiable

L’éditeur de publications s’exécute désormais entièrement dans une iframe, comme l’éditeur de site. Son canevas reste séparé de l’interface d’administration, ce qui empêche les styles d’administration d’interférer avec le contenu.

Les unités relatives au viewport et les media queries ciblent directement ce canevas. Les mises en page responsives se comportent donc de manière plus prévisible pendant la conception, avec une expérience cohérente quel que soit le thème.

Étendre WordPress avec les nouvelles API

Enregistrer des icônes SVG

L’API d’icônes SVG devient une API publique. Elle permet d’enregistrer des collections et des icônes, puis de les réutiliser dans l’éditeur avec wp_register_icon_collection(), wp_register_icon() et wp_get_icon().

Automatiser avec l’Abilities API

L’Abilities API enrichit l’infrastructure introduite dans WordPress 6.9 avec un cycle d’exécution filtrable, une validation personnalisée et une découverte partagée. Ces ajouts simplifient la création d’intégrations et d’automatisations au-dessus de WordPress, y compris des outils qui s’appuient sur l’IA.

Harmoniser les interfaces d’administration

Un nouveau Design System apporte une base pour thématiser les interfaces d’administration WordPress. Il couvre notamment les couleurs, l’arrondi et les styles de curseur.

Les développeurs peuvent employer des design tokens sémantiques et le composant React ThemeProvider afin de construire des interfaces d’administration personnalisées cohérentes avec l’environnement WordPress.

Étendre les thèmes et les vues de données

Les auteurs de thèmes accèdent aux styles responsives et aux pseudo-états hover, focus, focus-visible et active via theme.json. De nouveaux filtres permettent également de configurer les écrans DataViews et DataForm qui alimentent les vues Pages, Modèles, Parties et Compositions dans l’éditeur de site.

Améliorer l’accessibilité

WordPress 7.1 ajoute les fonctions wp_get_tooltip() et wp_get_toggletip() pour proposer des infobulles accessibles dans davantage de zones de l’administration. Elles concernent notamment les boîtes de métadonnées des publications et l’écran de connexion.

Les lecteurs d’écran bénéficient de libellés plus explicites et d’une navigation plus prévisible dans les tableaux de listes de publications. Les blocs Onglets et Playlist, ainsi que les améliorations de navigation et d’interaction dans l’éditeur, complètent ce travail d’accessibilité.

Configurer les améliorations de performance

La conversion facultative des GIF en vidéos produit généralement des fichiers plus petits. Des indicateurs de progression et des tentatives automatiques renforcent aussi la fiabilité des envois lorsque la connexion se coupe.

La bibliothèque de médias active par défaut le défilement infini. Chaque utilisateur peut toutefois revenir à la pagination dans ses propres réglages.

Les hébergeurs et propriétaires de sites peuvent définir les valeurs par défaut du chargement spéculatif à l’aide de variables d’environnement ou de constantes. Ils configurent ainsi la manière dont WordPress précharge les pages sans développer d’extension.

Préparer votre mise à jour vers 7.1

Téléchargez WordPress 7.1, puis vérifiez vos thèmes de blocs, vos styles responsives et les interfaces d’administration personnalisées avant le déploiement. Consultez aussi les notes de version pour l’installation, les améliorations, les corrections, les ressources d’apprentissage et la liste des fichiers modifiés.

Le Field Guide de WordPress 7.1 détaille les changements destinés aux développeurs. Pour explorer les fonctionnalités depuis l’interface, les ressources de Learn WordPress proposent des vidéos pratiques, des ateliers interactifs et des plans de cours.

Vous pouvez également parcourir la présentation des fonctionnalités de WordPress 7.1 pour visualiser l’ensemble des nouveautés de cette version.