FSE Outreach Round #2 : Créer une page d'accueil personnalisée avec l'éditeur de site de Gutenberg

Anne McCarthy a annoncé la deuxième série de tests pour le programme de sensibilisation Full Site Editing (FSE). L'appel à tester demande aux utilisateurs de créer une page d'accueil à partir de l'éditeur de site du plugin Gutenberg. Les commentaires sont ouverts jusqu'au 5 mars.

La première série de tests a commencé en décembre 2020 et s'est terminée le mois dernier. Les testeurs ont pu identifier plusieurs points faibles avec le mode d'édition de modèles à partir de l'éditeur de blocs. Le programme a créé des éléments exploitables que les développeurs de Gutenberg pourraient améliorer.

Ce second tour est similaire. Cependant, les tests couvrent un domaine beaucoup plus vaste et plus complexe. Les utilisateurs quitteront l'éditeur de blocs familier et passeront à l'éditeur de site, qui est encore à des mois d'être un produit viable.

McCarthy a énuméré un processus en 22 étapes pour créer une page d'accueil. Alors que je l'ai suivi la plupart du temps, je me suis ennuyé avant de finir. C'est l'une des raisons pour lesquelles je fais un sujet de test médiocre. J'aime explorer et voir ce qui est possible par moi-même. Si j'ai une idée, je veux tenter sa réalisation. Je me suis principalement attaché au script global, même s'il était un peu dans le désordre.

Finalement, j'ai créé une page d'accueil personnalisée pour un restaurant appelé The Grilled Cheese - j'ouvrirais certainement ce restaurant dans le monde réel si jamais je quittais la communauté WordPress.

C'est raisonnablement simple. Au total, il m'a fallu environ deux heures pour jouer avec divers concepts avant d'en arriver à cette étape. Construire quelque chose dont je serais heureux aurait pris quelques heures de plus.

Dans l'ensemble, je me sentais limité dans la présentation de ma page d'accueil idéale. Chaque étape était une bataille difficile contre les outils. J'aurais pu construire cela en moins de la moitié du temps avec HTML et CSS. Je pourrais faire la même chose et plus encore avec d'autres plugins de création de pages modernes pour WordPress.

Avant de plonger dans les résultats de mon test, j'ai une honnêteté brutale. TT1 Blocks, qui est le thème utilisé pour les tests FSE Outreach, n'est pas à la hauteur. Le thème ne gère pas de manière fiable la multitude de possibilités que l'éditeur du site met entre les mains des utilisateurs finaux. Toute cette expérience pourrait être rendue plus fluide avec un meilleur thème. Cependant, les choix sont limités et je ne sais pas s'il existe un meilleur thème basé sur des blocs avec lequel travailler à ce stade.

Il y avait tellement d'incohérences entre l'éditeur du site et le front-end qu'il est inutile de toutes les énumérer. L'espacement était grossièrement éteint. Je vois généralement cela comme une question thématique. J'ai passé une grande partie de mon temps en mode essai et erreur, faisant un ajustement dans l'éditeur et rafraîchissant pour voir le résultat frontal. Rincer. Répéter.

Identifier les points douloureux

Bien que ce message critique l'éditeur du site, cela ne signifie pas que l'expérience a été tout à fait médiocre. Voir l'amélioration chaque semaine me donne l'espoir que WordPress aura un éditeur de site qui rivalise avec tout ce qui existe sur le marché. Finalement. Cependant, mon objectif ici est de fournir de véritables commentaires que l'équipe peut utiliser.

En dehors des problèmes d'espacement généraux mentionnés précédemment, j'ai identifié plusieurs pierres d'achoppement lors de la création d'une page d'accueil personnalisée.

Largeurs maximales

Lors de la conception d'une page de site complet via l'éditeur de site, un problème est ressorti plus que la plupart. WordPress manque d'un système de "largeur maximale" bien équilibré. En tant qu'utilisateur, il me restait peu de choix pour définir la largeur de la zone de contenu de ma page d'accueil. Actuellement, les auteurs de thèmes peuvent définir un contenu personnalisé, large et pleine largeur. Cependant, ce système est horriblement limitatif. Les auteurs de thèmes ne peuvent pas faire grand-chose avec cela, et ce problème limite directement ce que les utilisateurs peuvent faire à la fois dans les éditeurs de blocs et de sites.

J'ai déjà écrit sur la nécessité d'un cadre de conception, personnalisable par les auteurs de thèmes. Tailwind CSS a un système de largeur maximale qui offre une grande flexibilité. WordPress doit commencer à emprunter des idées à ces cadres de conception modernes.

Ajouter une icône de bloc

Faire apparaître l'icône "Ajouter un bloc" lors du survol entre les éléments de la zone de contenu par défaut était difficile. J'ai dû positionner ma souris dans une position parfaite pour qu'elle apparaisse. C'était un exercice de frustration où le moindre mouvement faisait à nouveau disparaître l'icône.

Passer en mode Top Toolbar a rendu cela beaucoup plus facile. Je suppose que la barre d'outils de bloc par défaut le cachait dans une certaine mesure. Le problème avec le passage à ce mode est que mon choix de barre d'outils n'a pas été enregistré. Chaque fois que je revenais sur l'éditeur du site, je devais l'activer à nouveau.

Bloc de requête

L'aspect le plus frustrant de la liste des publications sur une page d'accueil personnalisée était de fixer une limite. Je voulais mettre le nombre à trois. Cependant, le bloc Query n'a pas d'option pour le faire. Finalement, j'ai créé une fausse limite en utilisant le filtre de catégorie, en choisissant celui qui n'avait que quelques messages.

Mise à jour : Il est possible de fixer une limite comme l'a noté Nick dans les commentaires. Il y a une icône "Paramètres" dans la barre d'outils pour définir le nombre de messages par page, un décalage et le nombre maximum de pages. Je ne sais pas pourquoi ces paramètres de requête particuliers sont séparés des autres dans la barre latérale. Il est plus logique de les regrouper.

Un autre aspect déroutant du bloc Query est le filtre de mots-clés. Autant que je sache, WordPress n'a jamais utilisé la terminologie "mot-clé". En dehors des plugins SEO, il ne semble pas y avoir de contexte pour ce que fait ce filtre. Je suppose que cela fonctionne comme un mot-clé de recherche.

Styles globaux pour tous les blocs

Lors du passage au panneau Styles globaux, j'ai remarqué que certains blocs manquaient lors de l'application de styles au niveau du bloc. En particulier, je voulais ajuster les styles pour le bloc Derniers commentaires.

Je suppose que seuls les blocs avec typographie, couleurs et autres options liées à la conception apparaissent dans la liste. Cela confondra probablement les utilisateurs finaux lorsque l'éditeur de site atterrira dans WordPress. Tous les blocs doivent avoir des options de style que les utilisateurs peuvent personnaliser.

Pas de colonnes pleine largeur

Pour le contenu de ma page d'accueil, j'ai tenté de créer un bloc Colonnes pleine largeur. Cependant, les deux colonnes individuelles étaient de taille limitée malgré la prise de 66,67 % et 33,33 %, respectivement.

Cela semble être un problème de thème. Je dirais également que c'est l'un de ces moments où avoir un contrôle plus direct sur la largeur maximale aurait aidé. Je voulais vraiment quelque chose qui se situe entre les largeurs pleines et larges du thème.

Images en vedette

Il n'y a aucun moyen de définir la taille de la sortie d'image par le bloc Post Featured Image. La seule façon d'obtenir une taille uniforme pour le moment est de pré-recadrer les images avant de les télécharger sur WordPress.

Il n'y a aucune raison pour que cela ne soit pas essentiellement une variante du bloc Image. La seule chose dont les images présentées ont besoin est la possibilité de créer un lien vers la publication.