Gutenberg sarà la nuova esperienza nella creazione di contenuto all’interno del nostro WordPress e permetterà all’utente finale di creare intere pagine web senza l’ausilio di page builder. All’interno di questo workshop andremo a scoprire come sia possibile preparare il nostro tema, una versione modificata di _s, per rispondere a tutti i blocchi standard che vengono implementati e scopriremo anche quanto sia semplice creare i nostri blocchi personalizzati.

1. Come preparare il tuo tema
all’avvento di Gutenberg

2. Chi sono e cosa faccio?
mentor - developer - writer
skillsandmore.org/gutenberg-theme

3. Come posso preparare il mio
tema a Gutenberg?

4. Don’t Panic

5. Faremo tutto
assieme, un
passo alla volta

6. First Steps First
Scarica l’archivio:
https://github.com

7. Ho preparato un repo
tutto per te ;)

8. Quanti blocchi ha Gutenberg?
22Aggiornato al 2/4/18

9. Devo pensarci
da solo?!?

10. Ecco il bello e il brutto
di Gutenberg
(dal mio punto di vista)

11. Parte del CSS è
scritto al posto tuo.
Parte del CSS è
scritto al posto tuo.

12. Faremo tutto
insieme!

13. Apri il tema nel tuo
editor preferito

14. Richiamiamo il file
specifico per Gutenberg

15. Attiviamo i layout
wide e full

16. Ci prepariamo ai
layout senza sidebar

17. Diamo il
benvenuto a
due nuove
classi

18. Si applicano a tutti i
blocchi!

19. Ma possiamo consigliare
anche dei colori!

20. Dichiariamo i colori

21. Ecco la nuova
palette

22. Puoi disattivare la
scelta dei colori

23. KEEP CALM
because
METABOX WORKS!

24. Shortcode come
blocco

25. Iniziamo con il
paragrafo

26. Gestiamo le misure
standard

27. Le classi del testo

28. Ricorda che si applica i
layout .alignwide e .alignfull

29. Passiamo alle
immagini

30. La struttura HTML

31. Come si comporta
con .alignwide e .alignfull

32. La struttura HTML

33. Finalmente la cover
image!

35. La struttura HTML

36. Per gli altri blocchi
c’è GitHub

37. Scopriamo come impostare
dei template Gutenberg

38. Crea il tuo CPT(puoi sovrascrivere anche post e pagine)

39. Il segreto?
L’array template!

40. Puoi bloccare il tuo template

41. Puoi modificare
anche i post standard

42. Come scoprire i
nomi dei blocchi?
github.com/WordPress/gutenberg/

43. Importiamo gli
stili in Gutenberg

44. Aggiungere solo backend

45. Oppure ovunque

46. Bonus Tip!!!
Crea il tuo blocco personalizzato
github.com/ahmadawais/create-guten-block

47. Purtroppo il nostro
tempo è scaduto…
La creazione di un blocco Gutenberg richiede
la conoscenza di JavaScript e React

48. Grazie!
Seguici sui nostri canali social: