WordPress 5.0 et l’éditeur Gutenberg arrivent le 6 décembre 2018

Mathieu Chartier CMS (WordPress...) 11 commentaires

WordPress est le CMS le plus connu et le plus utilisé au monde, de très loin devant ses poursuivants que sont Drupal, Joomla ou encore Magento. Sa force provient de sa communauté mais aussi de son versioning quasi rétro-compatible à chaque fois depuis des années. Mais pour la première fois depuis bien longtemps, WordPress 5.0 va quelque peu perturber l'équilibre naturel de l'outil, avec l'arrivée d'un nouvel éditeur de contenus appelé Gutenberg.

Dans le cycle de développement de WordPress 5.0, la nouvelle version a été repoussée à plusieurs reprises, mais la date du 6 décembre 2018 est annoncée. Cette dernière a même été confirmée par Matt Mullenweg, le co-fondateur de WordPress (depuis 2003). Afin de réparer d'éventuels bugs imprévus, la version 5.0.1 sera ouverte dans la foulée pour que la communauté puisse apporter des petites mises à jour de correction, notamment lors d'un Wordcamp US du 9 décembre 2018.

Cet article a pour but de vous préparer au mieux à ce qui vous attend dès demain (car oui, c'est déjà demain le 6 décembre...) mais aussi à mieux comprendre comment utiliser Gutenberg. Si cela peu déranger les utilisateurs qui se sont à peine habitués à l'éditeur wysiwyg actuel, dites-vous que WordPress 5 a pour objectif de tenir son rang de leader du marché mais aussi d'apporter encore plus de souplesse à l'édition de contenus, à l'instar d'un Wix ou de l'émergent Squarespace par exemple. Dans le dernier rapport de Tiobe, nous pouvons voir notamment WordPress comme solide leader, avec 32,5% de parts de marché dans le monde (tous types de sites web confondus) et presque 60% de parts rien qu'au sein des CMS, avec des concurrents largués après lui.

Parts de marché des CMS dans le monde

Que faire face au tsunami de l'éditeur Gutenberg ?

Dans les faits, pas grand chose. En effet, tous les contenus déjà existants dans WordPress sont en général intégrés automatiquement dans le nouvel éditeur Gutenberg, au sein d'un "bloc" de contenu (wysiwyg). Si d'aventure vous rencontriez des bugs persistants avec votre thème ou votre usage de WordPress, vous pouvez tout-à-fait revenir à l'ancien éditeur de contenus (celui que vous connaissez déjà...) en téléchargeant le plugin Classic Editor créé à cet effet.

En soi, une large majorité des sites web va passer à Gutenberg sans encombre, bien que le nouvel éditeur risque d'être déroutant à l'usage pour les moins connaisseurs d'entre nous. Si votre but est uniquement de gérer un seul bloc de texte, comme c'est souvent le cas actuellement, alors cela se passera sans trop de problème, il faudra juste retrouver les options qui ont souvent changé d'emplacement. La capture suivante montre comment un contenu existant est passé sans problème dans un bloc de texte de Gutenberg, sans aucune action à réaliser. Pour ce qui est de l'interface et de l'usage, nous y reviendrons dans la suite de cet article...

Passage à Gutenberg après le Classic Editor de WordPress 5

En revanche, bon nombre de sites web qui utilisent des systèmes personnalisés de gestion de contenus (comme ACF par exemple ou équivalent) ou des constructeurs de pages (page builders comme Page Builder de SiteOrigin, BeaverBuilder, Elementor, Visual Compozer, Divi...) peuvent éventuellement rencontrer des problèmes de compatibilité. Ces cas ont été envisagés lors de la conception de Gutenberg, donc la majorité d'entre eux devraient être nativement réglés dès l'émergence de WordPress 5.0. Pour ceux qui rencontreraient malgré tout des problèmes, l'installation du plugin Classic Editor sera sûrement une solution provisoire (ou pérenne) pour s'en sortir.

Quoi qu'il en soit, les agences web ou les formateurs comme Daniel Roch (Seomix), Fabrice Ducarme (WP-Formation), Alexandre Bortolotti (WP Marmite) ou même moi risquons d'être quelque peu rappelé pendant les semaines à venir tant Gutenberg risque de dérouter les moins aguerris. N'hésitez donc pas à lire des informations à propos du nouvel éditeur de contenus ou à vous former à WordPress pour mieux maîtriser les changements (mes lecteurs fidèles savent que je fais extrêmement rarement de la publicité dans mes articles, donc si j'en fais, c'est qu'il y a sûrement une bonne raison pour une fois... ^^).

Comment utiliser l'éditeur Gutenberg de WordPress 5 ?

Gutenberg est plutôt intuitif pour la majorité de son usage, mais il peut perturber au premier abord. Certes, quelques options ou réglages manquent de visibilité ou de clarté, mais l'ensemble est plutôt ergonomique. Tout le système repose sur des "Blocs", à savoir des unités de contenus. Vous pouvez donc créer des blocs de texte, des blocs d'ajout d'images ou de vidéos, des blocs structurels (colonnes par exemple), etc. Avec le temps, les concepteurs d'extensions de la communauté ainsi que les équipes de WordPress vont enrichir la liste de ces blocs afin de fournir aux usagers de plus en plus de possibilités, à l'image de ce qui se fait dans les constructeurs de page.

Créer des blocs dans Gutenberg avec WordPress 5

Le plus gros défaut de Gutenberg est sûrement son manque de souplesse, en comparaison avec ce que l'on peut connaître dans un page builder comme Tailor, Elementor ou Visual Compozer par exemple. La mise en place des colonnes est sûrement ce qui m'a le plus énervé pour être totalement honnête. En effet, à ce jour, vous devez absolument penser à votre structure (sans erreur) dès la mise en place des colonnes. Il n'est pas possible de modifier les colonnes créées et notamment de les intervertir. Le glisser-déposer est un manque important qui limite les possibilités une fois les blocs de colonnes déjà créés. Il faut donc bien réfléchir avant de se lancer dans la conception des colonnes...

Pour ce qui est des blocs les uns sous les autres, cela est beaucoup plus simple en revanche. Il est très simple de venir ajouter des Blocs d'images sous un Bloc de texte, etc. Il suffit d'ajouter sur le "+" situés en haut de l'écran (à gauche) ou sur les "+" qui s'ajoutent lorsque l'on survole le haut ou le bas d'un bloc existant. Une fois plusieurs blocs construits les uns sous les autres, vous pouvez aisément inverser leur ordre à l'aide de flèches présentes à cet effet.

Ajouter un bloc sous un bloc dans Gutenberg de WordPress 5

Parmi les options intéressantes, nous pouvons dupliquer un bloc ou un groupe de blocs, supprimer des blocs ou encore modifier en HTML chaque bloc si nécessaire. C'est plutôt pratique pour certains usages. La duplication permet notamment de recréer des types de blocs identiques pour concevoir une interface homogène, sans risquer d'obtenir un résultat différent en créant les blocs indépendamment. Retenez que pour chaque bloc, la colonne à droite de l'interface permet de personnaliser les options du bloc, et donc d'aller plus loin dans l'optimisation des contenus (adapter le nombre de colonnes par exemple, même si ce n'est pas hyper souple...).

Usage avancé de l'éditeur Gutenberg de WordPress 5

Loin de moi l'idée de faire un tutoriel complet en quelques lignes, vous pourrez trouver de nombreuses informations dans la documentation du CMS ou sur des blogs spécialisés. Je terminerai donc mon tour d'horizon par un dernier point qui peut être déroutant pour les usagers de l'ancien éditeur. En effet, certaines extensions ajoutaient de nouveaux boutons ou nouvelles possibilités pour la gestion des contenus. Si ces boutons semblent avoir disparus, il n'en est rien en réalité pour tous les plugins qui ont bien été programmés. J'ai pris l'exemple de Shortcode Ultimate ici. Historiquement, il ajoutait un bouton pour ajouter un shortcode au-dessus de l'éditeur de texte. Désormais, une icône en forme de shortcode s'ajoute dans la barre d'outils, comme le montre la capture suivante. Attention toutefois aux extensions qui n'ont pas prévu cette intégration, car cette fois, cela risque bien d'avoir disparu...

Ajout des anciens boutons d'options de plugins dans gutenberg

Voilà, j'espère que ce petit tour d'horizon vous rassurera un peu et vous préparera à ce qui attend tous les utilisateurs de WordPress dès le 6 décembre 2018...

11 commentaires

  • Thierry dit :

    Bonjour, pour cette mise à jour majeure il faudra faire la mise à jour manuelle, c'est bien ça ?

    • Normalement ce sera manuelle pour une telle mise à jour. Rien ne le précise mais j'ose mal imaginer WordPress nous forcer la main cette fois-ci. Par sécurité, il serait bon de faire des sauvegardes de bases de données juste avant la mise à jour au cas où, même si je ne pense pas que cela "cassera" beaucoup de sites web.

  • Sabine dit :

    Bonjour, qu'advient-il des champs ACF ? J'ai fait la mise à jour sur un site et je ne les retrouve plus... Avez-vous une idée pour m'aider ? Merci.
    Sabine

    • Bonjour,
      Pour ma part, les champs ACF apparaissent tout en bas, sous l'éditeur Gutenberg. Il y a des menus "accordion" avec chaque famille de champs personnalisés, juste sous l'éditeur, il suffit de les dérouler pour revoir tous les champs historiques d'ACF. C'était ainsi par défaut.

  • Aurore dit :

    Bonjour Franchement cette mise à jour est nulle ! Ca eut dire des plugin et encore des plugin. Comment faire pour restez à l'ancienne version ? Ca veut dire qu'il peut avoir une faille de sécurité si on choisi de ne pas faire cette mise à jour ? Merci

    • Bonjour,
      Je vous comprends parfaitement, j'ai moi-même retiré Gutenberg en retournant à l'ancienne version. Pour ce faire, il faut télécharger l'extension Classic Editor. Cela remettra tout comme avant, sans le nouvel éditeur mal foutu (pour l'instant...). Comme ça, vous pouvez faire la mise à jour à WordPress 5, profiter des failles de sécurité réparées, et surtout profiter de l'ancien éditeur que vous connaissez. ;-)
      Pour l'anecdote, l'extension Classic Editor était à 500 000 installations actives le 8 décembre 2018, il est déjà à plus de 900 000 installations actives en ce 12 décembre 2018, on voit bien que les gens fuient Gutenberg...

  • Marie dit :

    Bonjour,

    J'ai Divi sur mon thème wordpress et depuis la mise à jour de ce dernier, impossible de modifier mon site, même en ayant installer Classic Editor. Est-ce normal ? Faut-il attendre pour que Classic Editor se mette en place pour modifier ?

    Merci d'avance

    • Bonjour,
      Normalement, quand vous activez l'extension Classic Editor, tout redevient comme ce que vous connaissiez avant, donc c'est étonnant là. Allez vérifier dans "Réglages > Écriture", il devrait y avoir de nouvelles options. Vous devez être sur "Éditeur classique".

  • Mia Wallace dit :

    En plus de ne pas être bien fini, Gutenberg fait sauter d'autres extensions (ou il y a quelque chose que je ne comprends pas...). Bien qu'elles soient activées et à jour, mes extensions, par exemple pour activer la coloration syntaxique du html, ou Ultimate Nofollow...ne marchent plus.

  • kiwi-web dit :

    Est-ce que c'est mal si je dis que je n'ai pas fait la mise à jour uniquement pour ne pas être obligé d'ajouter des extensions pour bloquer gutenberg et tout le tralala ??? =)
    Plus sérieusement, je ne suis vraiment pas fan des gros changements du style ... de plus ils enchaînent les mises à jour, tellement de nouvelles failles ...

    • J'ai hésité longtemps avant de faire les mises à jour, mais je les ai faites en décalé, en ajoutant au passage Classic Editor pour contrer Gutenberg. Quand je n'ai pas le choix, j'utilise Gutenberg, mais ce n'est vraiment pas de gaieté de coeur, et je pense que cela va freiner mon développement de plugins aussi (enfin ceux qui ont besoin d'afficher des blocs de contenu) tant ça impose du code supplémentaire pour faire la même chose qu'avant. J'aime l'idée d'avoir un éditeur puissant, mais il n'est pas fini et ça ne me convainc pas encore...

  • Déposer un commentaire

    L'adresse de messagerie ne sera pas publiée.* Champs obligatoires