Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

1001 façons d'étendre Gutenberg

466 views

Published on

Le succès de WordPress est en grande partie liée à sa flexibilité grâce notamment à ses nombreuses extensions. Gutenberg, le nouvel éditeur de contenu de WordPress ne déroge pas à la règle, venez découvrir les différentes API permettant de modifier Gutenberg de long, en large et en travers.

- Créer des blocks,
- Supprimer des blocks,
- Modifier des blocks,
- Créer des gabarits (templates)
- Adapter votre thème
- Modifier les styles de l’éditeur et des blocks
- Ajouter des boutons, des panels à l’interface
- Manipuler les contenus de l’éditeur

Les possibilités de modification sont infinies, laissez libre cours à votre imagination !

Published in: Internet
  • Be the first to comment

  • Be the first to like this

1001 façons d'étendre Gutenberg

  1. 1. Mille et une manières d’étendre Gutenberg
  2. 2. Hi I’m Riad @riadbenguella wp.org @youknowriad https://riad.blog
  3. 3. INTRO
  4. 4. Blocs
  5. 5. Post Content Block Object DOM Parse Render Save Update name attributes isValid UID
  6. 6. CRÉER UN BLOC STATIQUE ➤ Quel est le markup (HTML) de mon bloc? ➤ Quelles parties sont modifiables? ➤ Attributes ➤ Save function ➤ Comment representer le bloc dans l’éditeur ➤ Edit function
  7. 7. Étape 1: DIY https://github.com/youknowriad/gutenberg-extensibility-workshop
  8. 8. Étape 2: Patterns https://github.com/youknowriad/gutenberg-extensibility-workshop
  9. 9. CRÉER DES BLOCS ➤ Bloc “Hello World” ➤ Bloc statique ➤ Bloc statique avancé (multi-editables & inspector controls) ➤ Bloc dynamique ➤ Bloc méta ➤ Supprimer un bloc (white-list) ➤ Supprimer un bloc (black-list) ➤ Modifier un bloc existant
  10. 10. Themes
  11. 11. THÈMES ➤ Styler les blocs ➤ Support de themes ➤ Wide alignments ➤ Palette de couleurs ➤ Frontend editing
  12. 12. UI
  13. 13. SIDEBAR PLUGIN
  14. 14. Avancé
  15. 15. USE-CASES ADVANCES ➤ Data Module ➤ Templates ➤ Figés ou non
  16. 16. Hack it
  17. 17. Avril/Mai 2018

×