WordPress 6.7 arrive à grands pas, et il est temps de passer en revue les nouvelles fonctionnalités, les changements et les améliorations que la nouvelle version nous réserve.

Cette version comprend 87 améliorations de base, des demandes de fonctionnalités et plus de 200 corrections de bugs.

Huit versions de Gutenberg, de la 18.6 à la 19.3, sont incluses dans le cœur de WordPress 6.7. L’éditeur de blocs reçoit 445 améliorations, 464 corrections de bugs et 55 améliorations de l’accessibilité.

De nouvelles API puissantes pour les développeurs arrivent dans le noyau. L’interface de l’éditeur reçoit plusieurs ajouts et améliorations, y compris des outils qui n’étaient auparavant accessibles qu’en utilisant du code. Des améliorations de la convivialité et de nouveaux outils de conception devraient rationaliser le processus de conception.

WordPress 6.7 présente également un nouveau thème par défaut, Twenty Twenty-Five, qui bénéficie des dernières fonctionnalités embarquées dans la nouvelle version.

Parmi les nombreux ajouts et changements qui arrivent avec WordPress 6.7, nous en avons sélectionné quelques-uns qui nous semblent les plus intéressants pour les développeurs et les utilisateurs. Il y a beaucoup à dire, alors plonge-toi directement dans les nouvelles fonctionnalités.

Mode zoom arrière

WordPress 6.7 propose un nouveau mode Zoom arrière pour t’aider à créer et à modifier du contenu en te concentrant sur des modèles plutôt que sur des blocs individuels. Cela te permet de travailler à un niveau plus élevé et d’avoir une vue d’ensemble de la page en cours de construction.

Les images suivantes montrent la nouvelle fonctionnalité en action. Un nouveau bouton Zoom arrière dans la barre d’outils supérieure te permet d’activer et de désactiver le mode Zoom arrière, ce qui te permet de travailler alternativement sur des modèles ou sur des blocs individuels.

Zoom arrière dans WordPress 6.7
Zoom arrière dans WordPress 6.7
Zoom arrière dans WordPress 6.7
Zoom arrière dans WordPress 6.7

Lorsque le mode Zoom arrière est activé, tu peux effectuer plusieurs actions sur le motif sélectionné. La barre d’outils du bloc propose des commandes pour faire glisser, déplacer vers le haut/bas et mélanger. L’affichage de la liste fournit des liens permettant d’effectuer plusieurs actions, telles que Modifier, Dupliquer et Supprimer le motif sélectionné.

Blocs de motifs dans la vue Liste
Blocs de motifs dans la vue Liste

Lorsque tu travailles avec le zoom arrière activé, l’inserteur de blocs passe par défaut à l’onglet Motifs. La vue Liste reflète également le mode d’édition et affiche les motifs au lieu des blocs.

Pour une liste plus complète des fonctionnalités et des changements liés au mode Zoom arrière, consulte la question de l’itération du mode Zoom arrière et les notes du développeur pour le mode Zoom arrière dans WordPress 6.7.

Boîtes de méta dans l’éditeur d’articles

Dans les versions antérieures à la 6.7, les méta-boîtes empêchaient le canevas de l’éditeur d’articles de se charger dans une iframe. Cela rendait plusieurs avantages indisponibles, tels que l’isolation du bloc et du thème CSS de l’interface utilisateur de l’éditeur et la précision des unités CSS relatives pour les requêtes média et le viewport. En bref, ce problème empêchait l’utilisation de la même feuille de style CSS dans l’éditeur et dans les vues frontales.

À partir de WordPress 6.7, le contenu de l’éditeur et les boîtes méta peuvent coexister dans l’interface de l’éditeur. Grâce à une nouvelle vue fractionnée, le canevas de l’éditeur Post se charge dans une iframe même lorsque le post/la page en cours comporte une ou plusieurs boîtes méta. D’après la note de développement:

Ce changement assure une expérience WYSIWYG cohérente entre l’éditeur et les vues frontales. De plus, il rend les boîtes méta plus facilement accessibles qu’auparavant. Cela permet de faire référence visuellement à n’importe quelle partie du contenu de l’article tout en travaillant avec n’importe quelle boîte méta et vice versa.

Canevas encadré avec boites méta dans WordPress 6.7
Canevas encadré avec boites méta dans WordPress 6.7

Cette implémentation utilise flex pour rendre la vue du contenu et la zone de métaboxes défilables.

Cette amélioration apporte également plusieurs changements à l’interface de l’éditeur d’articles :

  • La hauteur de la zone de la boîte méta est limitée à 50 % par défaut pour éviter qu’elle ne prenne trop de place.
  • La zone de la boîte méta est repliable ou redimensionnable en fonction de la hauteur de la fenêtre de visualisation.
  • L’état de la hauteur redimensionnée et l’état ouvert/fermé sont persistants dans les préférences de l’utilisateur.
Zone de meta box redimensionnable dans WordPress 6.7
Zone de meta box redimensionnable dans WordPress 6.7

Consulte la dev note pour un aperçu plus approfondi à l’intention des développeurs.

Améliorations de l’API Block Bindings

Introduite pour la première fois avec WordPress 6.5, l’API Block Bindings te permet de lier les attributs d’un bloc à une source de données externe. La première itération de l’API Block Bindings permettait de lier les valeurs des champs personnalisés aux attributs des blocs Heading, Paragraph, Button et Image. WordPress 6.6 a ouvert la porte à une nouvelle fonctionnalité puissante basée sur l’API Block Bindings : Pattern Overrides.

WordPress 6.7 nous apporte de nouvelles fonctionnalités et améliorations rendues possibles par l’API Block Bindings et une nouvelle interface par défaut pour la gestion de la méta source des articles.

Nouvelle interface Block Bindings

Cette itération propose une nouvelle interface pour gérer les Block Bindings à partir de la barre latérale des réglages, en utilisant la source intégrée des méta-blocs de post pour les blocs Heading, Paragraph, Button et Image.

Une fois que tu as enregistré tes champs personnalisés et sélectionné l’un des blocs pris en charge, un nouveau panneau Attributs apparaît dans la barre latérale des paramètres du bloc. Lorsque tu ajoutes un ou plusieurs champs personnalisés, le panneau Attributs devient interactif, ce qui te permet de relier les attributs du bloc à tes champs personnalisés.

Le nouveau panneau Attributs dans WordPress 6.7
Le nouveau panneau Attributs dans WordPress 6.7

Cela t’aide à créer des liaisons sans ajouter manuellement le code dans l’éditeur de code.

Par défaut, seuls les administrateurs peuvent créer et modifier les liaisons. Les développeurs peuvent remplacer le comportement par défaut en utilisant les filtres block_editor_settings_all ou map_meta_cap.

La note de développement met en garde contre deux limitations liées à la nouvelle interface Attributs.

  • Cette version ne permet pas encore de connecter les attributs des blocs à des sources personnalisées. Cette amélioration devrait être mise en œuvre dans une prochaine version.
  • Une deuxième limitation concerne le type de champs personnalisés affichés dans le panneau Attributs. Actuellement, seuls les champs de type chaîne ou texte riche sont pris en charge. Là encore, on peut s’attendre à une prise en charge progressive d’autres types de champs personnalisés dans les prochaines itérations.

Voir la note de développement pour un cas d’utilisation intéressant de l’API Block Bindings améliorée avec des modèles de messages personnalisés.

Nouvel attribut de méta-étiquette de l’article

Un nouvel attribut label a été mis en place pour permettre aux développeurs de plugins d’ajouter une étiquette personnalisée pour les champs post meta lors de l’enregistrement. Tu peux maintenant utiliser le code suivant pour enregistrer tes champs personnalisés avec des étiquettes :

register_post_meta( 
	'post', 
	'book_title', 
	array(
		'show_in_rest' => true,
		'type' => 'string',
		'single' => true,
		'sanitize_callback' => 'sanitize_text_field',
		'label' => __('Book title')
	)
);

S’il est défini, le libellé s’affichera à la place de la clé méta dans l’interface utilisateur de Block Bindings. L’image suivante montre le panneau Attributs avec des étiquettes personnalisées :

Le panneau Attributs avec des étiquettes de champ personnalisées
Le panneau Attributs avec des étiquettes de champ personnalisées

Possibilité de modifier les liaisons de blocs

En plus de la nouvelle interface Block Bindings, un nouveau paramètre de l’éditeur canUpdateBlockBindings peut être utilisé pour déterminer si la nouvelle interface est interactive pour les utilisateurs. Par défaut, il s’agit d’une nouvelle capacité edit_block_binding, qui est définie sur true pour les administrateurs et false pour les autres utilisateurs.

Tu peux modifier le comportement par défaut en utilisant le filtre block_editor_settings_all.

Nouvelles API et fonctionnalités pour les développeurs

WordPress 6.7 apporte de nouvelles fonctionnalités permettant aux développeurs d’utiliser des liaisons de blocs dans l’éditeur.

Une nouvelle API de l’éditeur te permet d’enregistrer des sources personnalisées définies sur le serveur avec des valeurs amorcées. En bref, tu peux enregistrer des sources externes et les rendre dans l’interface utilisateur en utilisant les API du serveur.

Twenty Twenty-Five, le nouveau thème par défaut, fournit un bon exemple d’amorçage de source avec le modèle Copyright. Dans le fichier functions.php du thème, tu trouveras le code suivant :

// Registers block binding sources.
if ( ! function_exists( 'twentytwentyfive_register_block_bindings' ) ) :
	/**
	 * Registers the copyright block binding source.
	 *
	 * @since Twenty Twenty-Five 1.0
	 *
	 * @return void
	 */
	function twentytwentyfive_register_block_bindings() {
		register_block_bindings_source(
			'twentytwentyfive/copyright',
			array(
				'label'              => _x( '© YEAR', 'Label for the copyright placeholder in the editor', 'twentytwentyfive' ),
				'get_value_callback' => 'twentytwentyfive_copyright_binding',
			)
		);
	}
endif;

// Registers block binding callback function for the copyright.
if ( ! function_exists( 'twentytwentyfive_copyright_binding' ) ) :
	/**
	 * Callback function for the copyright block binding source.
	 *
	 * @since Twenty Twenty-Five 1.0
	 *
	 * @return string Copyright text.
	 */
	function twentytwentyfive_copyright_binding() {
		$copyright_text = sprintf(
			/* translators: 1: Copyright symbol or word, 2: Year */
			esc_html__( '%1$s %2$s', 'twentytwentyfive' ),
			'©',
			wp_date( 'Y' )
		);

		return $copyright_text;
	}
endif;
add_action( 'init', 'twentytwentyfive_register_block_bindings' );

Ce code rend © YEAR dans l’interface utilisateur par défaut, comme le montre l’image suivante.

Sources personnalisées avec valeurs bootstrapped
Sources personnalisées avec valeurs bootstrapped

Note que le paragraphe dans le canevas du bloc n’est pas dynamique et ne montre que l’étiquette de la source.

Pour vérifier le balisage de ce bloc, tu dois créer une copie du modèle Copyright de Twenty Twenty-Five et ouvrir ta copie dans l’éditeur de code :

<!-- wp:paragraph {
	"metadata":{
		"bindings":{
			"content":{
				"source":"twentytwentyfive/copyright"
			}
		}
	},
	"className":"copyright",
	"textColor":"primary",
	"fontSize":"small"
} -->
<p class="copyright has-primary-color has-text-color has-small-font-size"></p>
<!-- /wp:paragraph -->

Tu peux en savoir plus sur les nouvelles fonctionnalités des Block Bindings dans les Block Bindings de la dev note 6.7.

Ajouts aux vues de données

Data Views est une interface améliorée pour les collections de modèles, de patrons, de pages, etc. Il s’agit également d’un composant et d’une API qui te permettent de rendre les ensembles de données dans l’éditeur de site à l’aide de différents types de mises en page, comme les tableaux, les grilles, les listes, etc.

Liste des mises en page dans WordPress 6.7
Liste des mises en page dans WordPress 6.7

Les vues de données ont été introduites pour la première fois avec WordPress 6.5 et améliorées avec WordPress 6.6. Aujourd’hui, WordPress 6.7 ajoute de nouvelles caractéristiques et améliorations qui les rendent plus flexibles et fonctionnelles.

À partir de WordPress 6.7, une icône en forme d’engrenage s’affiche dans le coin supérieur droit de la vue en grille. Lorsque tu cliques sur cette icône, un panneau Apparence affiche une série d’options d’affichage. Tu peux y trier les éléments de la vue, ajuster la densité de la grille, définir le nombre d’éléments par page et sélectionner les propriétés de l’élément à afficher dans l’aperçu.

Aperçu petite taille
Aperçu petite taille
Aperçu taille moyenne
Aperçu taille moyenne

Un bouton à bascule permet aux utilisateurs d’afficher/masquer les filtres d’affichage, ce qui améliore l’expérience sur les écrans étroits.

Un bouton à bascule pour afficher/masquer les filtres dans les vues Données
Un bouton à bascule pour afficher/masquer les filtres dans les vues Données
Masquer les filtres dans les vues Data dans WordPress 6.7
Masquer les filtres dans les vues Data dans WordPress 6.7

Lorsque tu définis un ou plusieurs filtres, le bouton de basculement des filtres affiche le nombre de filtres actifs.

l'affichage du filtre à bascule dans WordPress 6.7
l’affichage du filtre à bascule dans WordPress 6.7

Les changements supplémentaires apportés aux vues de données comprennent un ratio d’aspect configurable, des options de vue de données hors d’un menu, et bien plus encore.

Bloc Query Loop amélioré

Le bloc Query Loop est l’un des blocs les plus puissants et les plus complexes. Il doit offrir un maximum de fonctionnalités et de possibilités de personnalisation tout en restant intuitif et facile à utiliser. Avec WordPress 6.7, le bloc Query Loop reçoit plusieurs améliorations et ajouts qui le rendent plus polyvalent et plus facile à utiliser.

L’ancien contrôle Inherit query from template setting a été modifié et devrait maintenant être plus intuitif et plus simple.

Lors de la modification d’un modèle, le panneau de configuration de la boucle de requête affiche un contrôle de type de requête. Les images suivantes montrent les options de réglage pour les deux différents types de requête : Défaut et Personnalisé.

Le contrôle Query Type dans WordPress 6.7
Le contrôle Query Type dans WordPress 6.7
Le contrôle Query Type dans WordPress 6.7
Le contrôle Query Type dans WordPress 6.7

La détection du contexte a également été améliorée. Le bloc Requête dispose d’un paramètre inherit qui est défini par défaut sur true. Sur une page simple, cela n’a aucun effet sur les résultats de la requête, et le contrôle correspondant a été supprimé avec WordPress 6.7.

Paramètres de la boucle de requête pour une page unique dans WordPress 6.7
Paramètres de la boucle de requête pour une page unique dans WordPress 6.7

En revanche, dans un modèle d’archive ou d’index, le contenu du bloc de requête dépend du type de requête. Cela signifie que la page d’archive d’une catégorie spécifique affiche par défaut le contenu attribué à cette catégorie, indépendamment des autres paramètres explicitement définis par l’utilisateur, tels que le nombre d’articles.

Tu peux trouver une liste complète des problèmes impliquant le bloc Query Loop ici.

Ajouts à la gestion des médias

Avec WordPress 6.7, la gestion des médias devient plus fonctionnelle et plus efficace. Des tailles automatiques pour les images à chargement paresseux à la prise en charge généralisée des images d’arrière-plan, voici quelques-unes des améliorations de la gestion des médias qui arrivent avec la version 6.7.

Tailles automatiques pour les images chargées paresseusement

La définition d’une valeur par défaut pour sizes permet au navigateur d’identifier le fichier image à utiliser à partir de la valeur de l’attribut srcset. De cette façon, le navigateur connaît à l’avance la largeur de l’image avant que la mise en page ne soit connue.

La spécification HTML permet aux images d’omettre l’attribut sizes ou de lui attribuer explicitement la valeur auto ou une chaîne commençant par auto:

le mot-clé auto est une largeur qui est calculée dans l’analyse d’un attribut sizes. S’il est présent, il doit être la première entrée et la valeur entière de <source-size-list> doit être la chaîne auto (ASCII insensible à la casse) ou commencer par la chaîne auto, (ASCII insensible à la casse).

Avec WordPress 6.7, l’attribut auto est automatiquement ajouté au début de l’attribut sizes pour toute image téléchargée paresseusement. Il en résulte une amélioration des performances lors du chargement des pages.

Tailles auto pour une image chargée paresseusement dans WordPress 6.7
Tailles auto pour une image chargée paresseusement dans WordPress 6.7

Les développeurs peuvent corriger la valeur de l’attribut sizes à l’aide de la nouvelle fonction wp_img_tag_add_auto_sizes().

Améliorations de la bibliothèque de polices

WordPress 6.7 apporte également quelques améliorations utiles à la bibliothèque de polices. Tout d’abord, les polices sont désormais regroupées par source (Thème et Personnalisé), ce qui permet de comprendre plus facilement l’origine de chaque police en un coup d’œil.

Polices regroupées par source dans WordPress 6.7 : Polices du thème
Polices regroupées par source dans WordPress 6.7 : Polices du thème
Polices regroupées par source dans WordPress 6.7 : Polices personnalisées
Polices regroupées par source dans WordPress 6.7 : Polices personnalisées

Un nouveau bouton d’option Sélectionner tout te permet d’économiser quelques clics lorsque tu recherches une police sur Google Fonts.

Sélectionner toutes les variantes de polices dans WordPress 6.7
Sélectionner toutes les variantes de polices dans WordPress 6.7

Les changements supplémentaires comprennent un nouveau message Aucune police installée lorsque les polices ne sont pas disponibles et un état amélioré Aucune police installée lorsque les polices sont installées mais non activées.

Prise en charge du format HEIC

Le format HEIC (High Efficiency Image Container) est une variante mise à jour du format HEIF (High Efficiency Image Format), utilisé par Apple sur tous les iPhones et iPads fonctionnant sous iOS 11 ou une version ultérieure. Ce format garantit aux utilisateurs d’iOS de tirer le meilleur parti des caméras 4k et d’avoir des fichiers de plus petite taille.

Dans WordPress 6.7, les téléchargements d’images HEIC sont automatiquement convertis en JPEG sur le serveur lorsque cela est possible. Cet ajout permet aux utilisateurs de voir les images HEIC dans la bibliothèque multimédia et de les utiliser dans les articles et les pages même si leur navigateur ne prend pas en charge HEIC.

Prise en charge par le navigateur du format d'image HEIF/HEIC
Prise en charge par le navigateur du format d’image HEIF/HEIC (Source Caniuse)

Des outils de conception nouveaux et améliorés

Avec WordPress 6.7, les concepteurs ont accès à de nouveaux outils de conception puissants, notamment des supports de blocs étendus, des préréglages de taille de police, et bien plus encore.

Prise en charge de l’image d’arrière-plan UI pour les blocs Verse, Quote et Post Content

WordPress 6.7 apporte de nouvelles commandes d’interface utilisateur pour la gestion des images d’arrière-plan pour une poignée de blocs dans les styles globaux. Ces blocs comprennent Verse, Quote et Post Content.

Interface utilisateur pour les images de fond dans WordPress 6.7
Interface utilisateur pour les images de fond dans WordPress 6.7

La définition d’une image d’arrière-plan dans les styles globaux s’applique à l’ensemble du site web. Une fois que tu as ajouté une image d’arrière-plan pour un bloc, il te suffit de personnaliser les réglages pour les instances individuelles du même bloc afin de personnaliser son apparence.

Personnalisation de l'image de fond dans WordPress 6.7
Personnalisation de l’image de fond dans WordPress 6.7

Tu peux utiliser cette fonctionnalité dans le bloc Post content pour envelopper le contenu des articles et des pages dans des modèles. La capture d’écran suivante fournit un exemple d’utilisation de l’image d’arrière-plan.

Modifier l'image de fond dans le bloc Post Content
Modifier l’image de fond dans le bloc Post Content

Prise en charge de blocs supplémentaires

En plus de la prise en charge de l’arrière-plan pour les blocs Verse, Quote et Post Content, WordPress 6.7 présente de nouvelles prises en charge pour plusieurs blocs que les concepteurs et les développeurs de thèmes vont adorer.

La prise en charge des bordures a été étendue à de nombreux blocs, notamment les boutons, les catégories, les galeries, les titres, les textes multimédias, les paragraphes, les titres d’articles, les citations et bien d’autres.

Contrôles de bordure pour les médias et le texte
Contrôles de bordure pour les médias et le texte

Cette version ajoute également la prise en charge des couleurs pour les boutons, les éléments de liste et les derniers commentaires.

Contrôles de couleur pour les éléments de liste dans WordPress 6.7
Contrôles de couleur pour les éléments de liste dans WordPress 6.7

WordPress 6.7 apporte également un ajout très attendu par les concepteurs et les développeurs de thèmes : la prise en charge des ombres pour le bloc Groupe.

Contrôles de l'ombre portée pour le bloc Groupe.
Contrôles de l’ombre portée pour le bloc Groupe

Préréglages de taille de police

WordPress 6.7 introduit une nouvelle interface utilisateur pour contrôler les préréglages de taille de police dans l’interface des styles globaux. Cela permet aux utilisateurs de remplacer les valeurs par défaut du thème et de créer, modifier, supprimer et appliquer des préréglages de taille de police à l’aide de l’éditeur.

Cela inclut également la possibilité d’activer la typographie fluide et de définir des valeurs fluides personnalisées.

Pour l’essayer toi-même, ouvre l’interface Styles et navigue vers Tailles de police > Préréglages de taille de police. Un nouveau panneau affichera la liste des préréglages de taille de police disponibles. Clique sur le préréglage de ton choix et effectue tes modifications.

Modification des préréglages de taille de police dans WordPress 6.7
Modification des préréglages de taille de police dans WordPress 6.7

Toutes les modifications s’appliqueront à l’ensemble de ton site web.

Améliorations de l’interface utilisateur et autres fonctions d’édition

WordPress 6.7 introduit davantage de modifications de l’interface utilisateur et de fonctionnalités qui améliorent l’expérience d’édition. Examinons-en quelques-unes.

Le bouton Publier a changé de position

Les boutons Annuler et Publier du panneau de vérification avant publication ont changé de position, de sorte que tu peux désormais publier l’article sans déplacer le curseur sur la page.

Le bouton Publier a été déplacé vers la droite.
Le bouton Publier a été déplacé vers la droite.

Noms de blocs personnalisés dans l’inspecteur de blocs

Dans WordPress 6.7, lorsque tu définis un nom de bloc personnalisé, il s’affiche désormais aussi dans l’inspecteur de blocs. Dans WordPress 6.6, l’inspecteur de blocs affichait le nom de bloc par défaut (par exemple, Heading).

Les noms de blocs personnalisés ne s'affichaient pas dans l'inspecteur de blocs dans WordPress 6.6
Les noms de blocs personnalisés ne s’affichaient pas dans l’inspecteur de blocs dans WordPress 6.6
Noms de blocs personnalisés dans l'inspecteur de blocs dans WordPress 6.7
Noms de blocs personnalisés dans l’inspecteur de blocs dans WordPress 6.7

Désactiver la fenêtre modale Choisir un modèle

Tu peux désormais désactiver la modale Choisir un motif qui apparaît lorsque tu crées une nouvelle page. Pour refuser cette fonctionnalité, ouvre les Préférences dans le menu Options et désactive l’option Afficher les modèles de démarrage.

Désactiver la modale Choisir un modèle dans WordPress 6.7
Désactiver la modale Choisir un modèle dans WordPress 6.7

Liaison automatique des numéros de téléphone

Le champ lien ajoute automatiquement tel: lorsque tu ajoutes un numéro de téléphone.

Un numéro de téléphone lié dans WordPress 6.7
Un numéro de téléphone lié dans WordPress 6.7

Permettre de déposer plusieurs images sur le bloc d’images

Tu peux désormais déposer plusieurs images sur un bloc Image et le convertir en bloc Galerie.

Déposer plusieurs images sur un bloc Image dans WordPress 6.7
Déposer plusieurs images sur un bloc Image dans WordPress 6.7
Un bloc Galerie généré en faisant glisser plusieurs images sur un bloc Image
Un bloc Galerie généré en faisant glisser plusieurs images sur un bloc Image

Nouvelles fonctionnalités et API pour les développeurs

WordPress 6.7 propose plusieurs nouvelles API permettant aux développeurs d’ajouter plus de fonctionnalités à leurs plugins. Une nouvelle API d’options d’aperçu a été ajoutée, et d’autres API ont été étendues avec de nouvelles fonctionnalités, comme l’API HTML et l’API d’interactivité. Explorons-en quelques-unes.

API d’options de prévisualisation

Une nouvelle API d’options d’aperçu permet aux développeurs de plugins d’étendre le menu déroulant d’aperçu dans l’éditeur d’articles/de pages. L’API introduit un nouveau composant PluginPreviewMenuItem que les plugins peuvent utiliser pour ajouter des éléments de menu personnalisés avec des titres et des gestionnaires de clics personnalisés au menu déroulant de l’aperçu.

Les développeurs de plugins peuvent ajouter des options d’aperçu personnalisées à l’éditeur de WordPress pour tout un tas de choses, telles que :

  • Des aperçus de formats personnalisés (pense aux posts des médias sociaux).
  • Des aperçus d’articles ou de pages avec des restrictions pour des rôles d’utilisateurs spécifiques.
  • Des modes de prévisualisation supplémentaires, comme le mode sombre, les courriels, etc.

En fonction des accessoires fournis, tu peux utiliser les éléments de menu d’aperçu personnalisé comme des boutons ou des liens.

Voici un exemple tiré de la note de développement qui montre comment tu peux utiliser la nouvelle API:

import { __ } from '@wordpress/i18n';
import { PluginPreviewMenuItem } from '@wordpress/editor';
import { registerPlugin } from '@wordpress/plugins';

function onPreviewClick() {
	// Handle preview action
}

const CustomPreviewMenuItem = () => (
	<PluginPreviewMenuItem
		onClick={ onPreviewClick }
	>
		{ __( 'Your menu item label' ) }
	</PluginPreviewMenuItem>
);

registerPlugin( 'custom-preview-menu-item', {
	render: CustomPreviewMenuItem,
} );

Nouvelle API d’enregistrement de modèle de plugin

Avant WordPress 6.7, la seule option pour ajouter des modèles de blocs personnalisés était de passer par un thème. L’enregistrement d’un modèle de bloc à l’aide d’un plugin était impossible, à moins d’utiliser des solutions de contournement compliquées.

Grâce à la nouvelle API d’enregistrement des modèles, tu peux désormais enregistrer des modèles de blocs personnalisés à l’aide d’un plugin. La nouvelle API fournit deux nouvelles fonctions pour enregistrer et désenregistrer un modèle : register_block_template() et unregister_block_template().

Leur utilisation est assez simple. Il te suffit de passer quelques paramètres à la fonction :

$template_name: le nom du modèle sous la forme plugin_uri//template_name (note le //)
$args: un tableau contenant les arguments suivants :

  • title
  • description
  • content
  • post_types

Pour un aperçu plus détaillé de la nouvelle API et des exemples d’utilisation, voir la note de développement et la demande d’extraction originale.

Nouvelles API d’enregistrement de type de bloc

Une nouvelle fonction wp_register_block_metadata_collection() enregistre un type de bloc à partir d’un fichier manifeste s’il existe au lieu de lire et d’analyser directement le fichier block.json. Ceci est particulièrement utile lorsqu’un plugin enregistre plusieurs types de blocs, car cela évite de lire et d’analyser le block.json pour chaque type de bloc.

Note que cette nouvelle fonction ne remplace pas les fonctions existantes register_block_type() et register_block_type_from_metadata(). Son utilisation est facultative mais recommandée pour les plugins qui enregistrent plusieurs blocs afin d’améliorer les performances.

Consulte la note de développement pour une présentation complète de la nouvelle API et un exemple d’utilisation.

Options de niveau d’en-tête

Grâce à un nouvel attribut levelOptions, les développeurs peuvent spécifier quels niveaux de titre doivent apparaître dans l’interface déroulante des blocs Heading, Site Title, Site Tagline, Query Title, Post Title et Comments Title.

Tu l’utiliseras principalement dans les modèles de blocs, les parties de modèles et les modèles. L’exemple de code suivant désactive les titres H1, H5 et H6 dans un bloc Titre :

<!-- wp:heading {"levelOptions":[2,3,4],"textAlign":"center"} -->
<h2 class="wp-block-heading has-text-align-center"><em>Schedule a Demo</em></h2>
<!-- /wp:heading -->

L’image ci-dessous montre les options disponibles dans la barre d’outils du bloc :

Niveaux de rubriques dans WordPress 6.7
Niveaux de rubriques dans WordPress 6.7

Tu peux aussi filtrer l’attribut levelOptions avec un plugin ou dans le fichier de fonctions de ton thème en utilisant le filtre register_block_type_args. La note de développement fournit l’exemple suivant :

function example_modify_heading_levels_globally( $args, $block_type ) {
	 
	if ( 'core/heading' !== $block_type ) {
		return $args;
	}
 
	// Remove H1, H2, and H6.
	$args['attributes']['levelOptions']['default'] = [ 3, 4, 5 ];
	 
	return $args;
}
add_filter( 'register_block_type_args', 'example_modify_heading_levels_globally', 10, 2 );

Changements supplémentaires pour les développeurs dans WordPress 6.7

  • L’insertion d’un bloc accroché en tant que premier ou dernier enfant d’un bloc Template Part est désormais possible. (Voir la note de développement)
  • Les blocs accrochés respectent désormais la propriété multiple block-supports. (Voir la note de développement)
  • Les composants de l’interface utilisateur reçoivent un nombre considérable de mises à jour. (Voir la note de développement.)
  • Les nouvelles fonctions getServerState() et getServerContext() permettent de s’abonner aux changements d’état/de contexte de l’API Interactivity lors de la navigation côté client.
  • Les modules de script reçoivent quelques mises à jour avec un nouveau module de script @wordpress/a11y et un nouveau filtre script_module_data_{$module_id}.
  • L’API HTML bénéficie de plusieurs améliorations, notamment la prise en charge de presque toutes les balises HTML, une nouvelle méthode set_modifiable_text() qui permet de remplacer le contenu textuel d’éléments autonomes tels que script, style, ou title, un mode d’analyse complet dans le processeur HTML, et bien d’autres choses encore.
  • Plusieurs améliorations en matière d’internationalisation (i18n) ont été intégrées au noyau, notamment une nouvelle fonction has_translation() qui permet de déterminer si une traduction existe déjà sans charger la traduction au préalable, l’envoi d’e-mails à admin_email dans la langue locale de l’utilisateur, et un avertissement pour les développeurs s’ils chargent des traductions dans un plugin ou un thème avant que l’utilisateur actuel ne soit connu.

Résumé

Dans cette plongée en profondeur dans WordPress 6.7, nous avons exploré de nombreuses fonctionnalités et améliorations géniales apportées par cette version, d’un nouveau thème par défaut étonnant, au mode Zoom arrière aux boîtes Meta dans l’éditeur d’articles, aux ajouts de l’API Block Bindings, aux améliorations de la gestion des médias, aux nouveaux outils de conception, et à de nombreuses nouvelles fonctionnalités pour les développeurs de plugins.

Maintenant, c’est à toi de jouer. As-tu déjà testé WordPress 6.7 ? Quelles sont les fonctionnalités ou les changements que tu préfères dans la version 6.7 ? Fais-le nous savoir dans les commentaires ci-dessous.

Carlo Daniele Kinsta

Carlo est un passionné de webdesign et de développement frontend. Il joue avec WordPress depuis plus de 10 ans, notamment en collaboration avec des universités et des établissements d'enseignement italiens et européens. Il a écrit des dizaines d'articles et de guides sur WordPress, publiés à la fois sur des sites web italiens et internationaux, ainsi que dans des magazines imprimés. Vous pouvez trouver Carlo sur X et LinkedIn.