1) O documento discute a história do WordPress e do editor Gutenberg, explicando que o Gutenberg foi lançado em 2017 como um novo editor padrão para o WordPress. 2) Agora o WordPress usa blocos de conteúdo drag-and-drop no editor Gutenberg em vez do editor clássico TinyMCE. Isso permite mais flexibilidade na formatação do conteúdo. 3) O documento fornece dicas sobre como converter conteúdo existente para o editor Gutenberg e lista vários plugins que adicionam novos recursos ao editor.

1. Anyssa Ferreira
@anyssaferreira
para iniciantes
GutenbergWordPress +

2. Designer, desenvolvedora web. Co-fundadora do
estúdio Haste. Comunidade WordPress São Paulo.
Anyssa Ferreira

3. Quem nasceu
primeiro, WordPress
ou Gutenberg?

4. 1400, Alemanha
Johannes
Gutenberg
1450, Alemanha
Tipografia
/ Imprensa
2003, Internet / EUA
WordPress
2017, Internet / EUA
Gutenberg
Blogs

5. WordPress
● Autopublicação
● Design ≠ Conteúdo

6. WORDPRESS+GUTENBERG
WORDPRESS+GUTENBERG
Antes:
Editor Clássico
Padrão até a versão 4.9.9

8. TinyMCE
● Editor Rich Text open source que serviu de base para o
Editor Clássico do WordPress

9. WYSIWYG
● “What you see is what you get”
● Fidelidade da pré-visualização para o resultado final

10. WORDPRESS+GUTENBERG
WORDPRESS+GUTENBERG
Mudanças
A saga Gutenberg

11. https://github.com/WordPress/gutenberg/commit/0fcff2947b97635dc43bfb7e2a29c91d08ba4f04

12. https://go.tiny.cloud/blog/gutenberg-tinymce-faq/

14. WORDPRESS+GUTENBERG
WORDPRESS+GUTENBERG
O novo editor
Gutenberg
A partir da versão 5

15. Gutenberg
● Novo editor padrão do WordPress
● Drag and drop (arrasta e solta)
● Baseado em blocos
● Mais possibilidades de personalização do conteúdo
● Colunas
● Não é um page builder (ainda?)
● WYSIWYG

16. https://wordpress.org/gutenberg/

19. São módulos de conteúdo, que podem
ser adicionados, rearranjados e
editados de forma independente no
novo editor do WordPress.
Blocos

20. Alguns
blocos
disponíveis

25. Convertendo conteúdo

26. Convertendo conteúdo

27. Convertendo conteúdo

28. Mais dicas sobre Gutenberg
https://www.hastedesign.com.br/novidades/gutenberg-o-nov
o-editor-do-wordpress/

30. 1. Selecione todo o
conteúdo com CTRL + A
ou Command + A
2. Recorte o conteúdo
usando CTRL + X ou
Command + X
3. Clique abaixo para criar
uma nova linha
4. Cole o conteúdo usando
CTRL + V ou
Command + V
Convertendo
conteúdo para
Gutenberg

31. WORDPRESS+GUTENBERG
WORDPRESS+GUTENBERG
Expandindo
o editor
Plugins que adicionam recursos

32. ● Stackable Utilmate
Gutenberg Blocks
● Atomic Blocks
● Advanced Gutenberg
● Advanced Gutenberg
Blocks
● CoBlocks
● Kadence Blocks
● Editor Blocks
● Bokez
Plugins para
Gutenberg

33. Quer continuar usando
o editor clássico?
https://br.wordpress.org/plugins/classic-editor/

34. • Use o Gutenberg sem medo,
ele veio para ficar;
• Faça posts e páginas com
conteúdo e layouts mais
dinâmicos, explore sua
criatividade;
• Colabore reportando erros, ou
sugerindo melhorias de
usabilidade;
• É melhor que o editor clássico
em muitos pontos, mas ainda
não é um page builder.
Conclusão

35. FIM
@anyssaferreira