Hier, la version 10.2 du Le plugin WordPress Gutenberg débarqué. Les utilisateurs peuvent désormais ajouter un bloc d’espacement entre les éléments de navigation, classer les parties de modèle personnalisé et choisir entre des modèles lors de l’insertion du bloc de requête.

L’expérience utilisateur continue de s’améliorer dans certains domaines. Le bloc média et texte, l’un des rares résistants, peut désormais être converti en colonnes. La transformation se traduit par deux colonnes dans lesquelles le support et le texte sont séparés. Cependant, il s’agit d’une transformation à sens unique. C’est une amélioration nécessaire pour que les utilisateurs qui écrivent leur colonne de texte se rendent compte qu’ils ne peuvent ajouter que des médias téléchargés au lieu de l’intégration de YouTube dans le bloc multimédia et texte. Un passage rapide aux colonnes résout le problème.

Juste le message « Commencer à écrire ou entrer / sélectionner un bloc » apparaît pour le premier paragraphe vide s’il y a des paragraphes suivants. C’est un changement insignifiant, mais cela a pris un peu de tracas.

L’équipe de développement a corrigé 30 bogues pour Gutenberg 10.2. Ils ont également continué à travailler sur l’amélioration des fonctionnalités expérimentales telles que l’éditeur de site, les styles globaux et les menus de navigation basés sur des blocs. La modification complète du site est en cours, mais il faudra un certain temps avant que nous sachions s’il est prêt à être inclus dans WordPress 5.8.

Au moment où j’écris ce post, je le fais aussi dans un éditeur cassé. Gutenberg 10.2 a de nouveau changé le balisage ou le CSS, ce qui signifie que je vais devoir creuser un peu pour savoir pourquoi tous nos paragraphes sont mal alignés dans l’éditeur. Mais c’est un travail pour demain. Cela devrait être une solution spécifique à un problème et un problème isolé.

Imbrication de blocs d’espacement dans les listes de navigation

Bloc de navigation avec un bloc d'espacement imbriqué dans l'éditeur de blocs WordPress.
Insérez un espaceur dans une liste de navigation.

Dans l’une des pires idées que le projet Gutenberg nous a apportées, les utilisateurs peuvent désormais Insérer des blocs d’espacement entre les éléments du bloc de navigation horizontal. Et vous pouvez augmenter ou diminuer la distance en pixels. L’idée d’espacement n’est pas mauvaise en soi, mais la solution utilisée l’est.

Autant que je sache, c’est <div> Le tag n’est pas autorisé en tant qu’enfant direct de <ul>. C’est là que <li> Les éléments disparaissent. C’est peut-être mon ancienne éducation HTML, mais il ne me semble pas juste d’ajouter d’autres choses dans le mélange. Les éléments de liste sont les éléments enfants des listes.

Heureusement, il existe des solutions à ce type d’espacement horizontal qui sont à la disposition des concepteurs Web depuis des décennies: la bordure et le rembourrage.

Le bloc d’espacement ne s’est jamais senti bien depuis son introduction à Gutenberg. J’ai toujours supposé que c’était une solution malheureuse pour l’espacement vertical jusqu’à ce que nous ayons les bonnes options pour les blocs de bord et de rembourrage. Je n’ai jamais pensé que nous trouverions des moyens nouveaux et inventifs de contaminer le balisage d’un site.

Catégories de pièces de modèle

Editeur de site avec la partie modèle sélectionnée.
Sélectionnez une zone pour une pièce maîtresse.

Les utilisateurs peuvent maintenant Enregistrer les pièces du modèle dans une catégorie spécifique ou « Zone » comme on les appelle dans l’interface utilisateur de Site Editor. dans le Gutenberg 10.1L’équipe de développement a introduit un nouveau système de catégorisation pour les auteurs de sujets, avec lequel les parties du modèle sont automatiquement placées dans l’en-tête, le pied de page, la barre latérale ou les catégories générales. Le même système est désormais ouvert pour les pièces de modèle créées par l’utilisateur.

Lors de l’enregistrement d’un élément de modèle à partir de l’éditeur de site, les utilisateurs doivent ouvrir l’onglet Blocage avancé. Il y a une nouvelle option « Zone ». La catégorie de la barre latérale est manquante dans cette version. Pourtant, c’est une étape bienvenue vers la gestion des pièces de modèle.

Modèle de bloc de requête

Statut de blocage initial de la requête lorsque l'utilisateur insère pour la première fois une publication avec des options de modèle.
Sélection de modèle pour le bloc de requête à l’état initial.

Le bloc de requête est le cœur de l’édition complète du site. Ce sera finalement l’un des principaux composants avec lesquels les développeurs et les utilisateurs interagiront lors de la création de sites Web.

L’équipe de développement a introduit un nouveau concept pour les utilisateurs finaux lorsque le bloc de requête a été inséré pour la première fois. Dans le passé, les utilisateurs ont vu plusieurs variantes de bloc. Maintenant vous pouvez choisir entre des motifs ceux-ci sont spécifiques au bloc.

Par défaut, il existe des motifs grands, moyens et petits. Les utilisateurs peuvent également choisir de commencer à partir d’un tableau vierge.

Pour les développeurs, cette modification introduit des modèles de portée. C’est une nouvelle couche de l’API Block Patterns qui devrait offrir beaucoup de flexibilité à long terme. Bien que la fonctionnalité ne fonctionne actuellement qu’avec le bloc de requête, les auteurs de thèmes et de plugins peuvent créer des mises en page prédéfinies pour les blocs parmi lesquels les utilisateurs pourront choisir à l’avenir.

Imaginez que vous ayez différents types de boucles de publication que vous souhaitez proposer à vos utilisateurs. Avec quelques lignes de code, vous pouvez enregistrer l’un de ces modèles en tant que modèles de requête éligibles.

La nouvelle partie de l’API ajoute un scope Argument qui ressemble à:

'scope' => [
        'inserter' => false, // Whether to show in the main block inserter.
        'block'    => [ 'core/query' ] // The container block for the pattern.
]

Ceci est encore au stade expérimental, donc les choses peuvent changer à mesure que la fonctionnalité évolue.

En suivant l’exemple principal, j’ai créé un modèle de requête rapide à l’aide du code suivant:

add_action( 'init', function() {

	register_block_pattern(
		'tavern-query',
		[
			'title'  => 'Tavern Query',
			'scope'  => [
				'inserter' => false,
				'block'    => [ 'core/query' ],
			],
			'content' =>
                '<!-- wp:post-title {"isLink":true} /-->
				<!-- wp:post-featured-image {"isLink":true,"align":"wide"} /-->
				<!-- wp:post-excerpt /-->
				<!-- wp:separator -->
				<hr class="wp-block-separator"/>
				<!-- /wp:separator -->
				<!-- wp:post-date /-->'
		]
	);
} );



Source link

Recent Posts