WordPress 5.0 : préparons-nous au nouvel éditeur Gutenberg !

La page du meetup : https://www.meetup.com/fr-FR/Valence-WordPress-Meetup/events/246712456/

D'ici quelques mois, la version 5.0 de WordPress va sortir et elle intégrera un changement majeur dans le CMS : l'arrivée du projet Gutenberg dans l'éditeur de contenus !

Plus qu'un simple éditeur, Gutenberg va révolutionner la manière de concevoir du contenu sur votre site WordPress. Ceci est le plus gros changement sur le CMS depuis la version 3 et bien entendu, elle entraîne de nombreuses inquiétudes chez les utilisateurs et utilisatrices.

Lors de ce meetup, j'ai proposé une démonstration de l'éditeur Gutenberg en live, puis j'ai présenté les différentes façons d'envisager sereinement la mise à jour vers WordPress 5.0.

Transcript

1. WordPress 5.0 Préparons-nous au nouvel éditeur : Gutenberg @audrasjb Meetup WordPress Drôme-Ardèche | 07/02/18
2. À propos Jb Audras, 33 ans, ardéchois, directeur technique chez Whodunit Co-organisateur du meetup avec @rachel_peter , @JBernardHuet et Biquette Contributions : w.org, core, meta, glotdict, o2, GTE fr_FR, WPTD2017, theme review team, accessibility team, et bien sûr Gutenberg :)
3. WordPress 5.0 — GUTENBERG Un nouvel éditeur qui fait peur → Pourquoi ? • Perte des repères sur un outil qu’on connaît bien ? • Compatibilité des thèmes ? • Compatibilité des extensions ? • Peur du… changement ? • Peur du Javascript ? (ça je comprend ^^) Avant de crier gare, voyons à quoi ressemble ce fameux éditeur :)
4. Pourquoi un nouvel éditeur ? • Standardiser les pratiques d’écritures : un seul concept servira à manipuler l’ensemble du site • Nouveau concept éditorial de WP : le bloc • Première étape : remplacer l’ancien éditeur par une interface de gestion de blocs • Ensuite, le bloc aura vocation à remplacer : ◦ Les widgets ◦ Les menus ◦ Les shortcodes ◦ Tous les dév spécs, champs personnalisés : bloc de call to action, diaporama, FAQ, carte Google Maps… tout cela sera généré sous la forme de blocs déplaçables et réutilisables !
5. Un éditeur très simple à utiliser :D
6. Les blocs natifs à ce jour • Paragraphe de texte et niveaux de titres • Image • Galerie images / vidéos / sons • Citation • Liste numérotée ou à puces • Image de couverture (avec texte voire bouton/lien call to actionpar dessus) • Lecteur vidéo / audio • Tableaux (oui !) • Texte préformaté et affichage de portions de code source • HTML personnalisé • Texte simple WYSIWYG • Séparateur / ligne horizontale • Ancien bouton “Lire plus” • Bouton-lien / call to action • Colonnes de texte • Shortcodes (widget) • Derniers articles publiés (widget) • Liste de catégories (widget) C’est l’heure de tester →
7. Démonstration de Gutenberg en live…
8. La transition vers Gutenberg …ou pas ? Maintenance : Quelles questions se posent pour cette mise à jour un peu particulière. Dois-je passer mon site sur Gutenberg ? Comment faire ? Quel timing ?
9. 3 cas de figure 1. Le site passe à WordPress 5.0 et à Gutenberg ◦ Les extensions, thèmes et développements spécifiques sont compatibles → mode Classic Editor + Gut (par défaut ou en option suivant la maturité des rédacteurs) 2. Le site passe à WordPress 5.0 en gardant l’éditeur classique ◦ Certaines extensions, thèmes ou développements spécifiques ne sont pas compatibles → mode Classic Editor, puis on planifie de MAJ les dépendances au fur et mesure 3. Le site reste en branche 4.9 ◦ Le site est instable, le réseau de site est très hétérogène ou autres spécificités → On reste sur 4.9.x qui sera maintenue au minimum 2 ans et on réfléchit à la suite (développements ? refonte ?) Ce n’est pas un choix par défaut ! Ni une solution pérenne ! ou
10. La mise à jour vers WordPress 5.0 • Roadmap WordPress 5.0 : inconnue à ce jour (dépend de la roadmap Gut) • Roadmap Gutenberg : ça avance bien → https://goo.gl/YjS57G Pas de planning connu à ce stade, tout dépend de Gut’ Comment s’organiser ? Avec un rétroplanning par exemple !
11. Rétroplanning de MAJ vers WordPress 5.0 • J-30 // 1ère béta // Premiers tests ◦ Clonage du site sur une instance de test et installation plugin Gut’ ◦ On classe le site en cas 1, 2 ou 3 • J-30 à J-15 // béta tests ◦ Développements éventuels, vérification de la compatibilité des dépendances ◦ Création du tableau de suivi des dépendances : un fichier avec la liste des extensions et thèmes pour suivre leur évolution en regard de l’intégration de Gut au core ◦ Changement de classement cas 1, 2 ou 3 • J-15 // 1ère RC // Recette ◦ Recette sur l’instance de test et vérification : maintient ou pas du classement 1, 2 ou 3 • J-0 à J+10 // Sortie de WP 5.0 // Déploiement en production
12. Le maître mot, c’est l’anticipation 1. Testez Gutenberg dès aujourd’hui ! 2. Évaluez les risques au fur et à mesure de son avancée → Les principales extensions sont (ou seront) opérationnelles : WooCommerce, EDD, Yoast, Polylang, ACF… tout le monde est sur le pont! 3. Si vous êtes dév, mettez les mains dans le cambouis et apprenez à maîtriser Gut’… et n’oubliez pas : Learn JavaScript Deeply 4. Si vous êtes prestataire, communiquez dès maintenant auprès de vos client, créez un guide d’utilisation de Gut’
13. Merci Et vive Gutenberg ! Meetup WordPress Drôme-Ardèche | 07/02/18