Catégories
Plugin et site web

Un premier aperçu de l'édition complète du site dans WordPress

Voici une question existentielle pour les développeurs Web: quelle séparation doit-il y avoir entre le système de gestion de contenu (CMS) d’un site Web et sa conception?

Pour de nombreux services de bricolage (Wix, Squarespace, etc.), presque toutes les facettes d'un site Web peuvent être modifiées visuellement. Qu'il s'agisse de contenu, de conception ou de mise en page, vous pouvez ajuster le contenu de votre cœur. Et vous n’avez pas besoin de comprendre le code pour ce faire.

Mais, à l'exception de certains produits de création de pages sans code, WordPress est traditionnellement resté à l'écart d'un éditeur de site à part entière. Le personnalisateur de thème permet aux utilisateurs de modifier certains aspects d'un thème – mais uniquement ceux définis par son développeur.

Cela est sur le point de changer. L'édition complète du site (FSE) permettra à l'éditeur de blocs Gutenberg d'être utilisé pour éditer l'ensemble du site Web – thème et tout.

Cette nouvelle fonctionnalité pourrait bien révolutionner ce qui est possible avec un thème WordPress. Sur ce, je voulais jeter un premier coup d'œil à ce qu'il peut faire. Voici ce que j'ai trouvé…

Configuration de l'édition complète du site dans WordPress

Au moment d'écrire ces lignes, l'édition complète du site n'a pas été fusionnée dans le noyau WordPress. Il s'agit d'une fonctionnalité bêta disponible via le plugin Gutenberg. Donc, je vais saisir le plugin et l'activer en premier.

Ensuite, il y a la question de trouver un thème compatible. Q est le premier thème WordPress qui prend en charge FSE et servira de canevas pour cette expérience. Après avoir installé et activé le thème gratuit, nous pouvons maintenant jeter un œil à ce qu'il fait.

Un autre élément à noter: je fais tout cela sur une installation locale de WordPress. Il y a beaucoup de choses à tester et de bugs à corriger en ce qui concerne l'édition complète du site. Par conséquent, il n’est pas encore prêt pour un environnement de production. Testez en conséquence!

Observations initiales

Lors de l'activation du thème Q, il existe quelques différences notables dans WordPress. À l'arrière, il y a maintenant un Éditeur de site entrée dans le menu. Et lorsque vous parcourez le front-end tout en étant connecté, un Modifier le site Le lien s'affiche dans la barre d'administration. Oh, et il y a aussi une notification d'avertissement indiquant que la modification complète du site est expérimentale (nous allons simplement ignorer celle-ci).

Le lien Site Editor dans le tableau de bord WordPress.

Le thème lui-même est assez nu – ce qui est idéal. Cela nous fournit un chemin plus facile à personnaliser. Quand vous y réfléchissez, vous ne voudriez probablement pas démolir un design complexe, seulement pour le reconstituer en quelque chose d'autre. Moins, c'est plus.

Une vue frontale du thème WordPress Q.

Jetant un œil dans l'éditeur de site

Maintenant, à propos de cet éditeur de site. Cliquer dessus ouvre l'éditeur de bloc Gutenberg. Mais cette fois, c'est plus qu'une simple page vierge. Au lieu de cela, j'ai maintenant accès à tout – en-tête, navigation (à travers le bloc de navigation expérimental), zone de contenu et pied de page.

Comme prévu, apporter des modifications à l'un de ces éléments consiste à cliquer dans un bloc et à se mettre au travail. Les blocs individuels peuvent être transformés en autre chose, modifiés ou même supprimés. Les blocs peuvent également être repositionnés. Placer le menu de navigation au-dessus du titre du site, par exemple, était un jeu d'enfant. Il en va de même pour le remplacement de l'en-tête de titre à une seule colonne par une disposition à plusieurs colonnes.

Modifier un modèle de site Web dans WordPress.

Mais il y a plus. Cliquez sur le logo WordPress en haut à gauche de l'écran et vous ouvrirez la barre latérale de l'éditeur du site. Là, vous pouvez afficher et créer des modèles de thème (comme le site indice ou des postes modèle) ou des éléments de modèle (tels que entête et bas de page). Notez que vous pouvez également accéder à ces éléments via le menu Apparence de WordPress. Il existe également un moyen d'accéder aux pages, aux publications et aux taxonomies du site.

La barre latérale de l'éditeur de site WordPress.

Ce qui est vraiment bien ici, c'est que vous avez la possibilité d'isoler uniquement les parties du modèle que vous souhaitez modifier. Si je tire l'en-tête de Thème> Parties du modèle, c'est tout ce que je vois dans l'éditeur de blocs. Mais si je préfère le modifier dans le contexte du thème entier, je peux simplement rester sur la page initiale de l'éditeur de site.

Modification de la partie du modèle d'en-tête dans WordPress.

Création de nouveaux modèles

Si vous connaissez l’éditeur de blocs Gutenberg, la création de nouveaux modèles de thème sera plutôt simple. Le processus est très similaire à la création de toute autre page ou publication. Créez la mise en page de votre choix en utilisant les blocs disponibles et enregistrez – c'est tout!

Une chose à noter est qu'à ce stade, il semble que les modèles personnalisés devront suivre les conventions de dénomination de la hiérarchie des modèles WordPress. Autrement dit, le slug d'un modèle personnalisé doit correspondre au nom de son objectif correspondant dans votre thème (sans le .php à la fin).

Par exemple, si vous souhaitez créer un modèle à utiliser sur votre page d'accueil, son slug doit être nommé front-page. Vous souhaitez cibler la page À propos de nous (yoursite.com/about-us/)? Un modèle avec la limace de page-about-us fera l'affaire.

Création d'une page d'accueil tempalte dans l'éditeur de site complet WordPress.

Les modèles sont disponibles en téléchargement via le menu des paramètres en haut à droite de l'éditeur. Cela vous permet d'enregistrer manuellement des modèles sur votre appareil, puis de les télécharger sur le serveur, vous protégeant ainsi de tout incident potentiel.

Une liste de modèles de sites Web.

Utilisation de pièces de gabarit

Comme mentionné précédemment, l'édition complète du site WordPress nous permet d'éditer et de créer des éléments de modèle. Cela inclut l'en-tête et le pied de page du site, mais il existe de nombreuses autres possibilités.

Les parties de modèle peuvent être créées puis incluses dans n'importe quel modèle via un bloc. Vous pouvez également ajouter un élément de modèle à une page ou à un article spécifique.

Le bloc Pièce de modèle.

Cela peut s'avérer utile lorsque vous souhaitez ajouter un contenu spécifique sur plusieurs pages ou types de publications.

Par exemple, pensez à un bloc d'articles en vedette que vous souhaitez afficher à la fois sur vos articles individuels et sur vos pages d'archives. Ou peut-être existe-t-il un menu de navigation que vous ne souhaitez afficher que lorsqu'un ou plusieurs modèles spécifiques sont utilisés.

Les éléments de modèle sont un moyen de configurer cela sans avoir besoin de techniques avancées telles que la logique conditionnelle.

Insertion d'un élément de modèle dans une page.

Questions pour l'avenir des thèmes WordPress

Dans l'ensemble, je me suis senti positif à propos de cette expérience avec l'édition complète du site. Il reste encore un long chemin à parcourir pour éliminer les bugs et améliorer la convivialité. Le support thématique sera également un gros obstacle. Mais cela a le potentiel d'être une fonctionnalité très utile.

Pourtant, certaines questions me viennent à l'esprit:

À qui s'adresse l'édition complète du site?

L'un des principaux arguments en faveur de l'éditeur de blocs Gutenberg était qu'il était nécessaire de maintenir la pertinence. Les concurrents du marché du bricolage ont une approche plus visuelle de la construction de sites et WordPress a pris du retard.

Avec cela, il est logique que l'édition complète du site s'adresse aux utilisateurs qui: a) ne savent pas ou ne veulent pas utiliser le code; et b) veulent accéder à la plupart (sinon à tous) des éléments de leur site Web.

Quels sont les avantages pour les concepteurs Web?

Il y a quelques avantages. L'ouverture d'un en-tête, par exemple, peut permettre à un client de mettre à jour rapidement un nouveau numéro de téléphone ou une nouvelle adresse. Cela pourrait éviter aux concepteurs de faire face à des changements très basiques.

Pourtant, il y aura des choses que les professionnels du Web voudront verrouiller. La sécurisation client d'un site est souvent effectuée pour se protéger contre la casse. Les mises en page et les fonctionnalités sont des éléments essentiels avec lesquels nous préférons ne pas prendre de risques.

Espérons qu'il existe des moyens d'exercer facilement un contrôle précis sur ce qui peut et ne peut pas être modifié dans le back-end, comme le fait le personnalisateur de thème existant. Sinon, ce sera un autre cauchemar potentiel à craindre.

Comment l'édition complète du site affectera-t-elle le marché des thèmes commerciaux?

Ce sera fascinant à regarder. À l'heure actuelle, il semble que très peu de thèmes aient même été personnalisés pour Gutenberg. Ils s'appuient toujours sur des plugins de création de pages tiers pour les mises en page avancées. Et certains produits, comme Divi et Beaver Builder, ont déjà leurs propres capacités d'édition de site complètes.

Par conséquent, ne soyez pas surpris si l'adoption de la modification complète du site est lente. Il est peu probable que les développeurs de thèmes sautent dans le train en marche tant qu'il n'y aura pas à la fois de demande et d'indication claire de la manière dont ils peuvent en bénéficier. Sans oublier que de nombreuses fonctionnalités existantes devront être refactorisées.

À mon avis, les développeurs devront mettre en œuvre cela d'une manière qui augmente la flexibilité pour les utilisateurs tout en minimisant le risque de casse. Cela pourrait prendre la forme d'offrir des modèles prédéfinis (et partiellement verrouillés) et de laisser les utilisateurs sélectionner ceux qu'ils veulent. Mais nous sommes encore très tôt dans le match.

Un WordPress plus transparent

Une grande partie de l'écosystème WordPress est fragmentaire. Prenez un thème de ici, un plugin de (et et ) et essayez de faire en sorte que tout s'emboîte. Cela fait partie de son attrait et a remarquablement bien fonctionné.

Mais l'expérience de conception n'a pas vraiment bénéficié de ce flux. L'apparence et la mise en page d'un thème ont toujours été séparées d'une certaine manière. Qu'il s'agisse de pirater des modèles ou d'utiliser le personnalisateur de thème, il y a beaucoup de choses à faire.

Aimez-le ou détestez-le, l'édition complète du site est une étape vers l'unification du processus de conception. Avec lui, tout peut être conçu en un seul endroit dans une seule interface utilisateur. C'est une expérience plus fluide et qui devrait profiter à de nombreux utilisateurs.

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *