Tudo o que você precisa para começar com o WordPress Gutenberg

Publicados: 2018-01-23

Em 2018, o WordPress visa modernizar e simplificar a experiência de criação de conteúdo com o Gutenberg. Seu nome vem de Johannes Gutenberg, o fundador da imprensa. Esta é considerada uma das maiores mudanças para a experiência do usuário do WordPress e o fluxo de trabalho de desenvolvimento de temas.

O que é Gutemberg?

A maioria de nós pensa que Gutenberg é apenas um novo editor, mas não é só isso. Enquanto o editor está em foco agora, o projeto afetará toda a experiência de publicação, incluindo a personalização.

Até agora, editar uma página significava ajustar seu título, corpo e campos personalizados. Com Gutenberg, essa lógica muda completamente e introduz o conceito de blocos . Os blocos são componentes de interface de usuário autônomos, isolados e dinâmicos que são adicionados dinamicamente por meio do wp-admin. Não vou entrar em detalhes sobre isso, pois o vídeo a seguir explica tudo em detalhes.

Apresentação de Matt Mullenweg Gutenberg sobre o Estado da Palavra 2017

O Gutenberg já está disponível como um plugin e será integrado ao WordPress 5.0, com lançamento previsto para abril de 2018. A equipe por trás dele está atualmente focando na experiência de pós-edição. Mas a partir de então, expandirá sua abordagem para incluir criação de modelos, criação de sites e muito mais. Para facilitar a transição para o Gutenberg, existe um plugin chamado Classic Editor que permite que as equipes usem o editor atual enquanto trabalham em suas migrações.

Por que Gutenberg é bom para mim e o que isso significa para o futuro do WordPress?

Gutenberg é sem dúvida uma grande mudança e muitos desenvolvedores terão que se adaptar a ela. No entanto, na minha opinião, esta é uma das melhores mudanças que o WordPress já experimentou. Porque moderniza o processo de desenvolvimento de temas e o torna mais modular com base de código mais limpa, melhor manutenção e edição. Ele oferece mais confiabilidade e se livra de sua antiga abordagem hackeável monolítica.

Com o uso de blocos, otimiza e simplifica todas as formas de construção de uma página (códigos de acesso, widgets, HTML personalizado, mídia, formatação de texto, embeds e metaboxes). Como Matt explica em seu post:

  • Desenvolvedores e agências poderão criar modelos interativos que os clientes podem atualizar facilmente sem quebrar coisas ou lidar com tipos de postagem personalizados.
  • Os desenvolvedores de plugins poderão se integrar completamente em todas as partes do WordPress. Incluindo postagens, páginas, tipos de postagem personalizados e barras laterais sem precisar hackear o TinyMCE ou espremer todo o recurso atrás de um botão da barra de ferramentas.
  • Os desenvolvedores de temas não precisarão agrupar toneladas de plugins ou criar seus próprios construtores de páginas. Haverá uma maneira padrão e portátil de criar layouts avançados para postagens e orientar as pessoas pela configuração diretamente na interface. Νo tutoriais de 20 passos ou vídeos longos necessários.
  • Os desenvolvedores principais poderão trabalhar em tecnologias modernas e não se preocupar com 15 anos de compatibilidade com versões anteriores.
  • Os usuários finalmente poderão criar os sites que constroem com sua imaginação. Eles poderão fazer coisas no celular que nunca fizeram antes. Eles nunca mais terão que ver um código de acesso. O texto colado do Word será limpo e convertido em blocos automaticamente e instantaneamente.

Demonstrações e exemplos

Nesta palestra do WordCamp US 2017, Morten explica em que os desenvolvedores do WordPress precisam se concentrar e como o WordPress será transformado com o Gutenberg.

Morten Rand-Hendriksen: Gutenberg e o WordPress do Amanhã

Neste screencast Human Made demonstra uma série de implementações avançadas de blocos Gutenberg.

Como começar

Jogue com Frontenberg , uma demonstração ao vivo limitada do editor Gutenberg que o ajudará a se familiarizar com o ambiente de edição Gutenberg.

Frontenberg – Um playground Gutenberg desconectado para testes instantâneos

Leia o seguinte artigo de Matias Ventura Bausero, um dos principais engenheiros por trás de Gutenberg .

Gutenberg, ou a Nave de Teseu – Como um sistema pode evoluir fundamentalmente sem mudar drasticamente?

Brinque com esses símbolos do Sketch e tente criar seus próprios blocos personalizados.

Automattic/gutenberg-themes-sketch – gutenberg-themes-sketch – Um conjunto de arquivos Sketch para ajudá-lo a projetar temas WordPress baseados em blocos

Leia o manual oficial do desenvolvedor no wordpress.org . É limpo, fácil de ler e evolui constantemente. Você também deve se inscrever em sua lista de discussão para receber suas atualizações.

Introdução – “Gutenberg” é o codinome para o foco do editor WordPress de 2017.

Mergulhe no ReactJS, pois o Gutenberg é construído em cima dele.

React – Uma biblioteca JavaScript para construir interfaces de usuário – Uma biblioteca JavaScript para construir interfaces de usuário

Confira esses exemplos do Gutenberg construídos pela equipe principal do WordPress.

WordPress/gutenberg-examples = gutenberg-examples – Exemplos para estender o WordPress/Gutenberg com blocos

Leia este e-book detalhado da Human Made (uma das melhores agências de desenvolvimento do WP) .

Gutenberg, o novo Editor do WordPress (White Paper) – Este white paper aborda os principais desafios na implementação e adoção, bem como conselhos sobre como as empresas podem agir agora.

Confira este curso de desenvolvimento de Zac Gordon, educador em algumas das plataformas educacionais mais populares FrontendMasters, Treehouse e Udemy.

O Curso de Desenvolvimento de Gutenberg de Zac Gordon – Cursos de Gutenberg

Finalmente, instale este kit de ferramentas de desenvolvedor de configuração zero para construir plugins de bloco WordPress Gutenberg por Ahmad Awais

ahmadawais/create-guten-block – ‏ Um kit de ferramentas de desenvolvedor #0CJS de configuração zero para construir blocos WordPress Gutenberg.

Isso é tudo por agora, muito obrigado por ler este post e por favor deixe um comentário se você tiver alguma opinião, dúvida ou sugestão.

Se você é uma agência, empresa ou desenvolvedor do WordPress que deseja aprimorar o desempenho, a segurança e a experiência de hospedagem do seu site, fale com nossa equipe de engenharia. Nossa plataforma gerenciada de hospedagem WordPress é considerada uma das melhores do setor, com desempenho, confiabilidade e suporte técnico ao cliente inigualáveis.

Nossa equipe tem a missão de redefinir a maneira como os desenvolvedores do WordPress criam, hospedam e dimensionam seus sites, portanto, mantenha contato e sinta-se à vontade para conversar conosco.