O que vem da edição completa do site no WordPress 5.8?

Publicados: 2021-07-29

No final de 2020 no Estado da Palavra, Matt Mullenweg nos apresentou, como faz todos os anos, as novidades do editor de blocos que chegaria com as novas versões do WordPress em 2021.

Matt nos contou que um dos objetivos deste ano era mudar a experiência do usuário na construção de sites WordPress: a ideia era que acabássemos criando não apenas posts e páginas, mas toda a web, usando blocos. Ou seja, poderíamos também criar menus de navegação, barras laterais com widgets, templates, etc., a partir do mesmo editor de blocos do WordPress. Ele chamou essa ideia de Full Site Editing (FSE) e foi o principal objetivo da Fase 2 de Gutenberg.

Full Site Editing nada mais é do que um termo coletivo para um conjunto de projetos em desenvolvimento para alcançar essa nova experiência. Josepha Haden anunciou em abril deste ano que uma primeira versão do Full Site Editing está incluída na versão WordPress 5.8, que estava programada para ser lançada em julho de 2021.

A edição completa do site é uma coleção de projetos e juntos eles representam uma grande mudança, provavelmente demais para um único lançamento. O contexto mais importante a ser compartilhado é que ele não está sendo enviado como a experiência padrão completa para os usuários . Um dos comentários mais claros do processo de mesclagem da Fase Um foi que não houve tempo suficiente para nossos extensores (agências, autores de temas, desenvolvedores de plugins, construtores de sites etc.) se prepararem para as próximas mudanças.

Com isso em mente, esse processo de mesclagem não será um botão liga/desliga. O foco agora não está em uma experiência de usuário completa e diferenciada, mas mais em uma versão beta pública aberta no WordPress 5.8.

Faça o WordPress Core por Josepha Haden

Josepha esclareceu que o WordPress 5.8 não inclui todos os projetos que fazem parte do FSE, mas alguns dos que chegaram até nós envolvem uma mudança na forma como trabalharemos no WordPress. Já falei sobre alguns dos novos recursos que seriam incluídos no WordPress 5.8, como a capacidade de editar imagens e adicionar filtros duotônicos, transformações de blocos e o bloco do menu de navegação. Comentei também sobre a opção de desenhar templates a partir do próprio editor de blocos.

Neste post veremos mais dos recursos incluídos no projeto Full Site Editing que já integramos nesta nova versão do WordPress 5.8. Observe que existem outros recursos do Full Site Editing que estão em desenvolvimento e se você quiser testá-los você tem a opção de instalar a versão mais recente que está sendo desenvolvida seguindo as instruções explicadas aqui.

Índice

  • Modo de edição de modelo
    • Ativar edição de modelo
    • Criar e editar um modelo
  • Blocos temáticos
    • Último bloco de postagem
    • Loop de consulta e blocos de lista de postagens
  • Exibição de lista
  • Resumindo

Modo de edição de modelo

Uma das primeiras ferramentas Full Site Editing que vem com o WordPress 5.8 é o editor de templates. O editor de modelo é um modo especial disponível no editor de postagem que permite criar, atribuir e editar modelos de bloco para postagens e páginas específicas.

Ativar edição de modelo

Não se decepcione se depois de instalar esta versão você não encontrar em nenhum lugar a opção de editar modelos. Por padrão, esta opção está desabilitada para qualquer tema, mas os temas podem optar por habilitá-la com a seguinte linha adicionada ao seu arquivo functions.php .

add_theme_support( 'block-templates' );

Foi o que fiz no tema Twenty Twenty-One para poder dizer como funciona.

Criar e editar um modelo

A primeira coisa que encontramos na barra lateral direita para editar uma página ou post é a opção de criar um novo template.

Nova opção para criar templates no WordPress 5.8
Nova opção para criar templates no WordPress 5.8.

Depois de clicar no link «New» , aparecerá uma janela pop-up na qual você deve indicar o nome do modelo que vai criar.

Janela pop-up para indicar o nome de um novo modelo personalizado
Janela do editor do WordPress para inserir o nome do novo modelo personalizado.

Após clicar no botão «Create» , você já está no editor de templates, que é muito parecido com o editor de blocos que você já conhece com algumas pequenas diferenças.

Editor de templates WordPress
Editor de templates WordPress.

Como você pode ver na imagem, na barra superior encontramos o nome do modelo que estamos editando e o botão para atualizar o modelo, agora tem um ponto à esquerda para que você possa dizer a todo momento que está não atualizando a página (ou post), mas o modelo. Além disso, você também tem o link para voltar à página que estava editando.

Editar o modelo é muito semelhante a editar uma página ou postagem. Você pode adicionar os blocos e padrões que desejar da mesma forma que sempre fez com o editor de blocos. Embora agora, como direi mais tarde, temos alguns novos blocos de tema que podem ser particularmente úteis na edição de modelos.

Adicione novos padrões do WordPress no editor de modelos
Adicione padrões predefinidos no editor de modelos do WordPress.

Depois de fazer todas as alterações que achar necessárias, basta salvá-lo e você verá como ele avisa sobre as páginas que podem ser afetadas pelas alterações no modelo.

Salvar modelo do WordPress
Salve o modelo do WordPress.

E pronto, você pode atribuir o novo template criado a todas as páginas que desejar. Este modelo será salvo no banco de dados como um tipo de postagem personalizado chamado wp_template . Além disso, no futuro você também terá o template disponível para poder exportá-lo ou importá-lo para qualquer outro site que desejar (por enquanto, você só tem essa funcionalidade se tiver o plugin Gutenberg instalado).

Blocos temáticos

A edição de modelos, como eu disse antes, chegou até nós com um novo conjunto de blocos do WordPress que são particularmente úteis na criação de modelos e temas. Eles são os seguintes:

  • Logo do site
  • Slogan do site
  • Titulo do site
  • Título da postagem
  • Publicar conteúdo
  • Data de postagem
  • Trecho da postagem
  • Postar imagem em destaque
  • Categorias de postagem
  • Postar tags
  • Deslogar
  • Últimos Comentários
  • Últimas postagens
  • Loop de consulta / lista de postagens
Postar blocos que você pode adicionar a um modelo do WordPress
Novos blocos de postagem que você pode adicionar a um modelo do WordPress.

Para cada um desses blocos, você pode modificar suas características como qualquer outro bloco.

As características de cada um deles são muito intuitivas e não acho que precisem de maiores explicações, mas acho interessante entrar no detalhe de três tipos de blocos que são um pouco mais complexos: Últimos posts , Query loop , e Lista de postagens . Esses três tipos de blocos podem ser adicionados tanto em um template quanto em um post ou página.

Último bloco de postagem

Se você inserir um bloco de postagem mais recente, verá que possui muitas características que podem ser definidas para exibi-las.

Você pode selecionar três estilos de exibição diferentes para as postagens, se deseja exibir a descrição ou a postagem inteira, o número máximo de palavras, o autor, a data de publicação e a imagem em destaque (o tipo, tamanho, alinhamento e link ao posto). Você também pode classificá-los em ordem alfabética ou por data de publicação em ordem crescente ou decrescente, ou filtrar as postagens exibidas por uma categoria. Por fim, você também pode indicar o número de postagens que deseja exibir e em quantas colunas.

Loop de consulta e blocos de lista de postagens

O bloco de loop de consulta permite exibir uma lista de postagens, páginas ou qualquer outro tipo de postagem personalizada com estilos diferentes e pode aplicar filtros dependendo do tipo de conteúdo exibido.

Bloco de tipo de lista de conteúdo
Loop de consulta ou blocos de lista de postagem.

Como você pode ver na imagem acima, você pode primeiro selecionar na barra lateral esquerda, o estilo em que queremos que o conteúdo seja exibido. Caso você tenha selecionado o estilo padrão, você pode selecionar o carrossel ou a visualização em grade. E no caso do carrossel, você pode selecionar entre diferentes variações de exibição e escolher entre diferentes combinações para exibir o título, data, trecho e/ou imagem.

Exibir variações do bloco de lista de conteúdos
Exibe variações do bloco de loop de consulta.

Uma vez selecionado, será criado um bloco do tipo template de conteúdo que conterá os diferentes sub-blocos selecionados. E seja qual for a variação que você escolheu, você pode adicionar e/ou remover os blocos de tema e fazer as alterações desejadas em cada um dos blocos dentro do bloco da lista de conteúdo para atender às suas preferências.

Você também tem um conjunto de propriedades do loop de consulta que você também pode parametrizar, como as cores do bloco, o tipo de conteúdo que deseja exibir, a ordem em que o conteúdo é exibido e os filtros que você pode aplicar dependendo o conteúdo que você selecionou.

Seção de uma página criada com o bloco de listagem de conteúdo
Seção de uma página criada com o bloco de loop de consulta.

Desta forma, você pode adicionar rapidamente uma seção do conteúdo que você tem no blog ou cursos, etc. em qualquer modelo ou página sem sair do editor de blocos.

Exibição de lista

Outro recurso de edição completa do site que agora está disponível no WordPress 5.8 é a visualização de lista. Na barra superior do menu de edição de uma página ou post, agora encontramos o ícone de visualização de lista à direita do ícone com o «i». Clicar nele exibe uma barra lateral com a estrutura dos diferentes blocos que compõem o conteúdo que estamos editando. E o bloco em que estamos é destacado.

Visualização de lista no WordPress
Visualização de lista no WordPress.

Esta visualização de lista permite navegar rapidamente pelos diferentes blocos de conteúdo. Posicionar o mouse em qualquer bloco da lista o levará ao conteúdo desse bloco.

Navegando na visualização da lista de bloqueio
Navegando na visualização da lista de bloqueios.

Uma propriedade muito útil dessa exibição de lista é que as âncoras HTML que você adiciona ao conteúdo também são exibidas.

Visualizando âncoras na visualização de lista de blocos
Visualizando a âncora HTML na exibição de lista.

Isso torna mais fácil para você verificar a qualquer momento se está faltando alguma âncora HTML e está chamando-a com o nome correto.

Resumindo

O WordPress 5.8 marcou um marco no caminho para a Edição Completa do Site. Juntamente com alguns dos recursos que já expliquei que estavam chegando até nós, vemos que aos poucos estamos nos aproximando do objetivo de poder desenvolver novos sites sem escrever código.

Ainda achamos que alguns recursos às vezes falham e precisam ser aprimorados, mas este é um projeto de código aberto onde a participação de todos fará com que o WordPress se torne a plataforma favorita dos sites.

Você decidiu instalar esta versão do WordPress? Adoraríamos que você compartilhasse sua experiência.

Imagem em destaque por Andrew Neel no Unsplash.