Share
La nouvelle interface de montage de Gutenberg est un changement majeur pour WordPress 5 cette année et elle affectera les développeurs de plugins WordPress, les concepteurs de thèmes et les créateurs de sites Web..
Dans cette vidéo, je vais vous montrer comment configurer Gutenberg en tant que plug-in sur votre site existant et comment commencer à utiliser l'éditeur de Gutenberg pour créer du contenu..
Suivez-le et vous pourrez découvrir certaines des nouvelles fonctionnalités de Gutenberg..
Un bon point de départ pour en savoir plus sur Gutenberg est la page Gutenberg dans le Codex WordPress. Il vous donne un aperçu de ce qu'est Gutenberg et vous explique également comment vous pouvez aider à l'améliorer et à construire l'avenir. Vous pouvez le faire en envoyant vos commentaires via le questionnaire de commentaires, que vous pouvez également utiliser pour demander de l'aide..
Vous pouvez également afficher les exigences de test pour tester Gutenberg. La raison pour laquelle il est important de respecter ces exigences est que tous les tests effectués de manière cohérente permettent à l'équipe de développement de Gutenberg de tirer le meilleur parti de ses capacités..
Gutenberg ne fait pas encore partie du noyau de WordPress, mais il le sera dans une prochaine version. Gardez à l’esprit que cela pourrait bien changer entre-temps, en partie à cause de ce retour d’information et en partie à cause du travail qui est toujours en cours pour le rendre aussi bon que possible. Mais entre-temps, voyons comment vous pouvez obtenir Gutenberg sur votre site dès maintenant et vous donner un aperçu rapide de ce à quoi il ressemble..
La manière dont vous pouvez obtenir Gutenberg maintenant est via un plugin. Alors installez-le de la manière habituelle, allez à Plugins> Ajouter un nouveau, recherchez "Gutenberg", et lorsque vous l'avez trouvé, cliquez sur Installer maintenant et alors Activer.
Maintenant que vous avez installé le plugin, l'éditeur Gutenberg sera actif sur votre site..
J'ouvre une publication existante sur mon site pour vous montrer à quoi ressemble l'écran d'édition de publication dans Gutenberg..
Vous pouvez voir que cela semble assez différent de ce qu'il était auparavant. Lorsque je survole des choses, des icônes apparaissent avec trois points à droite, m'indiquant que chaque élément de mon contenu est devenu un bloc..
Si je clique sur un bloc, quelque chose me semble un peu plus familier: il ressemble au vieil évier de la cuisine dans l'éditeur classique. Mais vous pouvez voir que vous n'avez pas les onglets pour la vue code et la vue normale en haut.
À droite, j'ai un ensemble d'aspect légèrement différent de ce qui était autrefois des métaboxes, qui avaient l'air tout à fait séparés dans l'ancien éditeur. Cela ressemble beaucoup plus au Customizer. Donc, si vous avez utilisé le Customizer dans WordPress, cette disposition vous sera familière. Vous pouvez cliquer sur chaque en-tête pour développer la section correspondante. Globalement, cela rend les choses un peu plus ordonnées et réduit la nécessité de faire défiler.
Vous pouvez ajouter plus de blocs en cliquant sur l'icône plus en bas à gauche et un menu apparaît vous montrant les différentes options..
Si vous êtes un utilisateur expérimenté de WordPress - et en particulier si vous êtes un développeur WordPress -, vous risquez de vous jeter des mains horrifiées. Mais je peux voir comment, pour les utilisateurs moins expérimentés et les personnes plus visuelles, cela facilitera les choses..
Gutenberg facilite également le déplacement des objets. Je vais donc créer un bloc de paragraphe à partir du contenu existant de mon message. Quand cela est fait, je peux ensuite sélectionner mes blocs et les déplacer de haut en bas en cliquant sur les flèches à gauche..
Cela vous donne beaucoup de flexibilité pour déplacer les éléments de votre site et les traiter de manière visuelle..
Il existe également d'autres types de blocs. Une liste, par exemple, devient un bloc tout seul.
Je vais commencer par diviser mon contenu existant en blocs en cliquant sur l'icône de contrôle et en sélectionnant Convertir en blocs dans le menu qui apparaît.
Gutenberg sépare ensuite mes titres et mes paragraphes individuels et crée également des blocs distincts pour chaque liste. Il est donc très simple et rapide de convertir vos publications existantes en contenu compatible avec Gutenberg..
Vous vous en souviendrez au début, j'ai dit qu'il n'y avait pas d'onglets en haut pour la vue texte et la vue code. Au lieu de cela, vous pouvez simplement travailler sur le code d'un bloc individuel. Donc, si je clique sur l'icône de contrôle à droite, je peux sélectionner Modifier en HTML. Ensuite, il affiche le bloc en mode code, et je peux éditer le code dans ce bloc particulier..
Si vous êtes un peu comme moi et que vous avez dû approfondir le code derrière un long post, il peut être très déroutant d'essayer de trouver le texte avec lequel vous avez travaillé, cela en fait vraiment beaucoup plus facile de travailler avec un morceau de code spécifique.
Donc, les blocs font vraiment de Gutenberg ce qu’il est, et j’espère que cela vous a permis de vous familiariser avec les blocs et leur fonctionnement. Un bloc est fondamentalement équivalent à un élément de votre code HTML. Si vous examiniez le balisage de sortie de votre fichier, vous verriez que chacun d'entre eux était au même niveau. Donc, vous avez des en-têtes, des paragraphes et des listes, et ils sont tous au même niveau dans votre code HTML.
Vous pouvez également diviser et fusionner des blocs en utilisant le même menu de contrôle qui s’affiche à partir de l’icône avec les trois points. annuler bouton en haut, ce qui est vraiment utile. Et avec les listes, vous pouvez facilement basculer entre différents niveaux d’indentation, ou entre listes à puces et listes numérotées, en utilisant simplement le menu situé au-dessus du bloc correspondant..
Maintenant que j'ai converti mon contenu en blocs individuels, je peux aussi cliquer sur Bloc dans la barre latérale à droite et modifiez les paramètres pour chaque bloc.
Vous pouvez également afficher et masquer la barre d’outils de configuration en cliquant sur le menu de contrôle en regard d’un bloc et en choisissant Afficher les paramètres avancés ou Masquer les paramètres avancés. Si vous le cachez, vous obtiendrez une expérience de montage propre et agréable.
Cela vous donne donc un aperçu des principales choses que vous pouvez faire avec des blocs à Gutenberg. Vous pouvez ajouter des blocs, changer le type de bloc et modifier le code sous-jacent. Vous pouvez dupliquer des blocs, les fusionner, les scinder et les déplacer dans votre document..
Je n'ai pas encore utilisé Gutenberg sur un set live, mais le parcourir pour ce cours m'a rendu très enthousiaste quant à son fonctionnement et à la manière dont il peut m'aider à modifier mon propre contenu sur mon site WordPress.
J'espère que Gutenberg vous aidera et j'espère que vous avez apprécié cette présentation rapide de ses principales fonctionnalités..
Apprenez à utiliser WordPress ou restez coincé dans et apprenez le développement de WordPress avec nos guides complets. Tous les cours de ces guides sont accessibles gratuitement avec un abonnement à Envato Elements. Pour un tarif mensuel modique, vous bénéficiez d'un accès illimité à notre bibliothèque croissante de plus de 1 000 cours vidéo et de livres numériques de premier plan sur l'industrie sur Envato Tuts.+.
De plus, vous obtenez maintenant des téléchargements illimités à partir de la vaste bibliothèque Envato Elements de plus de 500 000 ressources créatives. Créez avec des polices, des photos, des graphiques et des modèles uniques et livrez plus rapidement de meilleurs projets.
Accentsconagua