A edição completa do site é o futuro do WordPress. Você pode FSE-lo?

Publicados: 2022-05-11

Full Site Editing (FSE) é o próximo passo na evolução do WordPress Gutenberg. Aqui está o que isso significa para desenvolvedores da Web e como acessar modelos FSE gratuitos com hospedagem WPMU DEV.

Full Site Editing, ou FSE, lançado com o WordPress versão 5.9, promete transformar o design do site WordPress para sempre. Dizemos “promessa” porque, neste momento, o FSE ainda está em sua infância como um recurso relativamente novo do WordPress.

De acordo com Carolina Nymark, desenvolvedora de temas WordPress de longa data e colaboradora principal…

“A edição completa do site mudará a forma como todos usam os temas – e como os construímos.”

Captura de tela da página inicial do FullSiteEditing.com
Fonte: FullSiteEditing.com

Neste post, abordaremos:

  • O que é a edição completa do site WordPress?
  • Os 4 tipos diferentes de temas do WordPress: uma recapitulação rápida
    • 1. Temas clássicos
    • 2. Bloquear temas
    • 3. Temas híbridos
    • 4. Temas universais
  • Recursos completos de edição do site
    • Bloquear temas
    • Editor do site
      • Modelos
      • Peças do modelo
    • Variações Globais de Estilo
    • Blocos de edição de site completo
  • Usando modelos FSE hospedados no WPMU DEV
  • Preocupações sobre o uso da edição completa do site
  • Edição completa do site WordPress – Próximas etapas

Vamos pular…

O que é a edição completa do site WordPress?

tl;dr – Se toda a coisa de Gutenberg e Edição de Site Completo parece confusa para você (ou está criando um bloqueio mental ), aqui está um resumo rápido…

Gutenberg é o nome do projeto dado pelo WordPress para a transição da edição “clássica” para “bloco”. A FSE está levando o Gutenberg para o próximo nível, permitindo que os blocos sejam usados ​​não apenas no editor de conteúdo de postagens e páginas, mas em todas as áreas do site (por exemplo, cabeçalhos, rodapés, barras laterais). Daí o termo Edição Completa do Site .

O Full Site Editing (FSE), então, é uma coleção de recursos do WordPress que permitem aos usuários projetar todos os aspectos de seu site usando blocos. O FSE visa substituir widgets, menus, etc. Tudo isso será feito usando blocos.

Com o FSE, você pode usar blocos para estilizar visualmente todas as partes do seu site, não apenas a área de conteúdo de postagens e páginas. Isso inclui o cabeçalho, o rodapé e as barras laterais do site.

A edição completa do site promete mudar a forma como todos nós usamos os temas do WordPress, então vamos dar uma olhada nos diferentes tipos de temas do WordPress primeiro, antes de nos aprofundarmos em como o FSE afeta os temas.

Os 4 tipos diferentes de temas do WordPress: uma recapitulação rápida

No ecossistema atual do WordPress, existem quatro tipos de temas disponíveis:

1. Temas clássicos

Temas clássicos são criados usando modelos PHP, functions.php e muito mais. Atualmente, esses são os tipos dominantes de temas do WordPress disponíveis.

2. Bloquear temas

Temas de bloco são criados para FSE usando modelos HTML, partes de modelos, theme.json, etc. (consulte a seção "Temas de bloco" abaixo).

Podemos esperar ver mais temas de bloco se tornando disponíveis à medida que mais desenvolvedores e usuários de temas adotam a Edição Completa do Site.

3. Temas híbridos

Temas híbridos são essencialmente temas clássicos que podem adotar recursos do FSE. A funcionalidade de tema híbrido é usada principalmente em aplicativos cliente específicos, onde eles podem precisar acessar arquivos de modelo e criar modelos personalizados.

4. Temas universais

Os temas universais do WordPress funcionam com o Personalizador e o Editor do Site. Estes são desenvolvidos pela Automattic. Assim como os temas híbridos, os temas universais são voltados principalmente para atender às necessidades específicas de clientes privados em configurações principalmente corporativas.

Para obter informações adicionais sobre as diferenças entre os tipos de temas do WordPress, veja o vídeo abaixo:

Agora que analisamos os diferentes tipos de temas WordPress disponíveis, vamos começar a mergulhar no mundo do FSE…

Recursos completos de edição do site

Conforme descrito anteriormente, o FSE é uma “coleção” de recursos do WordPress que permitem editar todas as partes do seu site.

Alguns desses recursos incluem:

Bloquear temas

Temas de bloco são temas do WordPress criados usando modelos compostos de blocos.

O tema padrão Twenty-Twenty-Two fornecido com o WordPress 5.9 é um tema de bloco.

Tema de bloco do WordPress - Vinte e vinte e dois
WordPress Twenty Twenty-Two é um tema de bloco.

Um tema de bloco permite que você personalize elementos como cores, tipografia e o layout de cada página do seu site usando blocos.

Tema de bloco WordPress Twenty Twenty-Two - Visualização de lista
Clique na visualização de lista para ver todos os blocos que compõem o tema do bloco WordPress Twenty Twenty-Two.

O tema Twenty-Twenty-Two tem críticas surpreendentemente boas…

Tema 2022 - Boas críticas.
O tema Twenty Twenty-Two tem boas críticas…

E sua parcela de críticas ruins também…

Vinte e vinte e dois comentários ruins sobre o tema.
…e críticas ruins também!

Os temas de bloco permitem novas funcionalidades, como melhor integração com padrões e a capacidade de misturar e combinar diferentes predefinições de estilo, criando a mesma sensação e flexibilidade que você experimentaria se estivesse usando vários temas.

À medida que o FSE se torna mais amplamente adotado, mais temas de bloco serão adicionados ao diretório de temas do WordPress. Você pode encontrar temas de bloco no diretório Themes usando o Feature Filter e selecionando Full Site Editing .

Diretório de temas do WordPress - Temas completos de edição de sites.
Filtre temas de edição de site completo no diretório de temas do WordPress para ver uma lista crescente de temas de bloco.

Editor do site

O Editor do Site é um novo recurso que permite que os usuários do editor de blocos construam e personalizem um site WordPress inteiramente a partir de blocos usando um novo sistema de estilo.

Ele substitui recursos de edição de temas clássicos, como o personalizador de temas, widgets e menus.

Usar o Editor do Site requer ter um “Tema de Bloco” ativo instalado. Com um tema de bloco instalado, o menu Aparência fica muito mais simplificado…

Menu de aparência do WordPress com tema de bloco instalado.
Como o menu Aparência aparece com um tema de bloco do WordPress instalado.

Se o tema ativo em seu site não for um tema de bloco (ou seja, um tema clássico regular não FSE), o menu Aparência exibirá links para o personalizador de temas, widgets, menus etc.

Menu de Aparência do WordPress com um tema regular instalado.
Como o menu Aparência aparece com um tema WordPress normal instalado.

Observação: conforme mencionado anteriormente, existem temas híbridos que podem utilizar o FSE e o Personalizador de temas.

Para acessar o Editor do Site com um tema de bloco instalado, clique no link do menu Aparência > Editor na sua área de administração ou no link Editar site na barra de ferramentas de administração do front-end.

Editar site - barra de ferramentas de administração de front-end.
Clique em Editar site para acessar o Editor do site a partir do front-end.

Isso leva você à tela Editor do site e exibe o modelo que sua página inicial usa. Clique no botão ao lado de 'Início' para visualizar suas áreas de modelo ou selecione Procurar em todos os modelos para visualizar todos os modelos de tema disponíveis.

Áreas de modelo de página inicial
Clique no botão de alternância para visualizar as áreas do modelo da página inicial.

Clique no logotipo do WordPress para visualizar e acessar o modelo de página inicial do tema, diferentes modelos e partes do modelo.

Opções do Editor de Site Completo.
Opções do Editor de Site Completo.

Você pode escolher entre editar o que a página inicial exibe, uma lista de modelos, uma lista de partes do modelo ou voltar ao seu Painel.

Alterne entre as diferentes seções do Editor do Site.

Modelos

Os templates são grupos de blocos que se combinam para criar o design de uma página web. Quando você faz alterações no editor de templates, os blocos em todas as páginas ou posts que usam este template são atualizados automaticamente. Você pode criar modelos personalizados ou usar modelos fornecidos pelo tema ou plugin. Um modelo para uma postagem ou página exibe seu conteúdo com o bloco de conteúdo da postagem.

Modelos do Editor de Sites.
Modelos do Editor de Sites.

Peças do modelo

Uma parte de modelo é um bloco para gerenciar diferentes áreas de sua página da Web e ajuda a definir a estrutura de itens reutilizáveis, como rodapé ou cabeçalho. As peças do modelo são usadas principalmente para a estrutura do site. O WordPress oferece a opção de usar partes de modelo existentes ou adicionar novas.

Partes do modelo do Editor de site.
Partes do modelo do Editor de site.

Clique em qualquer modelo ou parte do modelo para editá-lo editando os blocos que compõem o elemento.

Blocos de modelo
Edite blocos de modelo para modificar modelos e peças de modelo.

Variações Globais de Estilo

Estilos é um recurso incluído nos temas do Bloco que permite personalizar elementos globais do design do seu site usando diferentes cores, tipografia e layouts (ou você pode simplesmente deixar que seu tema cuide disso).

Para acessar esse recurso, certifique-se de ter um tema de bloco ativo instalado, vá para Aparência > Editor e clique no ícone Estilos ao lado da barra lateral de configurações do bloco.

Uma barra lateral de Estilos aberta com todas as opções de estilo listadas.
Use a barra lateral Estilos para alterar estilos globais, como tipografia, cores e o layout do seu tema de bloco.

Estilos permite ajustar e substituir os elementos de design padrão do seu tema, como adicionar uma nova paleta de cores para que seus botões correspondam à sua marca, gerenciar as fontes usadas no site e ajustar diferentes elementos globais, como família de fontes, espessura da fonte e altura da linha, ajustar blocos para o seu tamanho preferido e muito mais.

Você pode acessar esta seção independentemente do modelo ou da parte do modelo que estiver editando.

Esse recurso afeta todo o seu site. Se você alterar as configurações de cor de fundo usando Estilos, por exemplo, a cor de fundo de todas as suas postagens, páginas e modelos também mudará (a menos que você tenha definido anteriormente uma cor personalizada para um bloco de botão individual, nesse caso alterando as configurações de Estilos não substituirá essas cores definidas individualmente).

Usando estilos

Blocos de edição de site completo

Você pode usar todos os blocos disponíveis para editar os temas do seu site no Editor do Site, incluindo um novo conjunto de blocos chamado Blocos de temas.

Os blocos de tema permitem que você faça coisas como criar menus (bloco de navegação), exibir e editar o título do seu site (bloco de slogan do site) e muito mais.

Bloco de tema - bloco de navegação
Adicione menus para bloquear temas com o bloco de navegação.

Usando modelos de FSE hospedados no WPMU

Se você hospeda com o WPMU DEV e está criando novos sites ou clonando sites existentes do WordPress, nossa biblioteca de modelos tem uma variedade de temas de bloco para selecionar.

xxxx

Para usar um tema de bloco de nossa biblioteca de modelos, selecione Filtrar modelos por > Construtores > Editor de site completo .

Biblioteca de modelos WPMU DEV - Modelos de filtro por editor de site completo
Filtre modelos por editor de site completo para visualizar e selecionar um dos modelos de tema de bloco da nossa biblioteca de modelos.

Em seguida, selecione o modelo que deseja usar para criar ou clonar seu site e conclua o processo normal de configuração do site.

Modelos de tema de bloco
Escolha um dos nossos modelos de tema de bloco.

Para obter mais detalhes sobre o uso de modelos, consulte nosso artigo sobre como criar e vender seus próprios modelos de site gratuitamente com a hospedagem WPMU DEV.

Preocupações sobre a edição completa do site

Os temas de bloco são relativamente novos e o conceito de edição completa do site ainda não é tão fácil de entender, por isso muitos usuários têm preocupações sobre a adoção da edição completa do site.

Algumas dessas preocupações incluem:

A edição completa do site é nova

O suporte para edição completa do site começou com a introdução do Editor de modelos no WordPress 5.8 (lançado em julho de 2021). O WordPress 5.9 introduziu recursos adicionais do FSE, como o Editor de sites e o primeiro tema de bloco padrão (veja abaixo).

Embora possamos definitivamente esperar mais novos recursos de edição completa do site e melhorias do WordPress 6.0 em diante, o fato é que o FSE ainda é muito novo, o que traz à tona a próxima área de preocupação…

Controle de projeto limitado

Antes do WordPress 5.9, fazer alterações nos sites do WordPress significa ter um controle de design limitado.

Evoluir de uma simples plataforma de blog com recursos de expansão para uma ferramenta de criação de sites completa com um sistema de gerenciamento de conteúdo poderoso e rico em recursos foi um maravilhoso passo à frente. Embora muitos usuários e desenvolvedores da web ainda resistam a adotar a relativamente nova arquitetura Gutenberg baseada em blocos (introduzida no WordPress 5.0 no final de 2018), ninguém atualmente contesta que essa é a direção para a qual o WordPress está indo.

Enquanto este artigo está sendo escrito, no entanto, projetar, criar, editar e personalizar sites WordPress ainda requer o uso de plugins, temas e/ou construtores de páginas de terceiros e lidar com todos os seus bugs, incompatibilidades e dependências inerentes.

Embora a edição completa do site prometa um futuro empolgante para o design da web do WordPress, é necessária uma combinação de edição completa do site e blocos Gutenberg para criar um site inteiro e criar o tema ideal e o layout do site para usuários individuais.

Portanto, com o FSE, o controle de design da web do WordPress ainda está limitado ao uso dos blocos existentes da biblioteca de blocos principais do WordPress, a nova biblioteca de padrões e plugins de terceiros, que ainda estão na fase “incipiente”.

Padrões do WordPress
A biblioteca de padrões do WordPress pode ajudar no design da web do FSE, mas ainda há alguns caminhos a percorrer.

Isso nos leva à próxima preocupação que os usuários têm sobre a construção de sites WordPress usando o Full Site Editing…

Edição completa de sites vs construtores de páginas

Como você pode ver, existem desafios e limitações quando se trata de projetar um site completo no WordPress.

Os construtores de páginas ajudam a compensar esses desafios e limitações, enquanto a Edição Completa do Site promete resolver ou eliminar muitos deles completamente.

Antes de desinstalar seu construtor de páginas favorito e usar a Edição completa do site, considere o seguinte:

  • Construtores de páginas como Divi ou Elementor são plugins poderosos com anos de desenvolvimento por trás deles, milhões de instalações ativas e suporte de software dedicado para ajudar os usuários a resolver seus problemas e continuar fornecendo atualizações regulares.
  • Os construtores de páginas permitem que qualquer pessoa crie facilmente seu site e integre processos de fluxo de trabalho sem exigir habilidades de codificação usando layouts visuais pré-fabricados e módulos de design de arrastar e soltar ricos em recursos. Milhões de desenvolvedores e usuários da web do WordPress já sabem como usá-los.
  • O FSE ainda é relativamente novo e levará tempo para estabelecer uma base de usuários significativa, como os construtores de páginas estabelecidos, como Elementor e Divi. Isso afeta áreas importantes como suporte, especialmente ao lidar com plugins premium onde suporte, correção de bugs e atualizações estão incluídos em vez de contar com ajuda gratuita da comunidade WordPress.
  • O WordPress conta com plugins como o WooCommerce para construir sites dinâmicos com funcionalidade de comércio eletrônico. Ele não possui uma “solução de bloco” total de comércio eletrônico embutida em seu núcleo. O mesmo se aplica ao construir sites complexos como sites de membros, sites LMS, sites de eventos, diretórios, redes sociais, etc. Levará algum tempo para que o FSE alcance os níveis de integração com funcionalidades complexas que muitos construtores de páginas já oferecem.
  • Milhões de usuários do WordPress ainda não mudaram totalmente para o Gutenberg. Muitos usuários preferem usar o plugin WordPress Classic Editor (mais de 5 milhões de instalações ativas) para criar e editar suas postagens e páginas (incluindo nós), então isso pode retardar consideravelmente a transição da antiga para a nova maneira de pensar sobre o WordPress.
Imagem do site de demonstração criada usando o Divi Page Builder.
O FSE substituirá os Construtores de Páginas? Com sites de comércio eletrônico, provavelmente não por muito tempo!

Edição completa do site WordPress – Próximas etapas

Embora existam muitas razões para continuar usando temas regulares do WordPress e construtores de páginas para criar e manter seus sites, não há razão para que você não possa começar a experimentar e aprender a usar a Edição Completa do Site.

Por exemplo, aqui estão algumas coisas que você pode fazer conforme sugerido no Manual do WordPress.org:

  • Use diferentes blocos específicos de edição completa do site, como o bloco de listas de postagens, o bloco de título do site, o bloco de parte do modelo, o bloco de logotipo do site, o bloco de navegação e muito mais.
  • Explorar Estilos Globais. Tente alterar as configurações dos blocos globalmente.
  • Edite modelos como o modelo de página 404 ou modelo de página única.
  • Explore o modo de edição de modelos.
  • Explore as várias opções de navegação entre seu conteúdo e modelos.
  • Tente construir um site.

Além disso, se você hospedar com o WPMU DEV, experimente o FSE usando um site de teste (incluído em nossos planos de hospedagem) e nossos Block Theme Templates (também incluídos). Se você ainda não é membro, aproveite nosso teste gratuito para conferir tudo.

Você fará a mudança para a edição completa do site ... ou esperará e FSE?

A Edição Completa do Site é promissora e tem um grande potencial.

Embora o FSE ainda não seja uma ameaça significativa ou disruptiva para desenvolvedores de temas e construtores de páginas estabelecidos, é o próximo passo na evolução do WordPress, após a introdução do editor Gutenberg.

A edição completa do site pode oferecer uma dimensão nova e exclusiva ao desenvolvimento da web do WordPress. Só o tempo irá dizer.

Você já tentou usar a edição completa do site? O que faria você mudar do uso de temas clássicos do WordPress e construtores de páginas para o FSE? Compartilhe seus pensamentos e comentários abaixo.