O WordPress 6.5 “Regina” foi lançado em 2 de abril, e estamos aqui para mostrar as incríveis funcionalidades que acompanham essa versão.

A verão 6.5 apresenta novas e poderosas APIs, levando a experiência de desenvolvimento WordPress a um novo patamar. Mas ele também traz inúmeras mudanças que vão te deixar feliz no que diz respeito à construção de sites e criação de conteúdo.

Graças à nova biblioteca de fontes, você poderá injetar valores de campo personalizados no conteúdo dos blocos principais e baixar e instalar o Google Fonts diretamente do editor do site. Novas ferramentas de design e vários aprimoramentos da interface do usuário melhorarão a experiência geral de edição.

Mas essas são apenas algumas das atualizações que virão com o WordPress 6.5. A nova versão reúne tantos aprimoramentos e atualizações que seria impossível mencionar todos em um só artigo. Por isso, reunimos as mais disruptivas e empolgantes neste longo e detalhado artigo.

Vamos começar nossa jornada de descoberta do WordPress 6.5.

Você está interessado em conhecer a nova biblioteca de fontes do WordPress 6.5?

A nova biblioteca de fontes do WordPress

Primeiramente, o WordPress 6.5 apresenta um novo recurso que permite o gerenciamento de fontes a partir da interface de estilos. A nova Biblioteca de Fontes do WordPress permite que você gerencie fontes de uma forma semelhante ao gerenciamento de mídia na Biblioteca de Mídia, mas para fontes.

Graças à Biblioteca de Fontes, você pode instalar ou desinstalar facilmente fontes locais e fontes do Google Fonts e escolher as que deseja ativar ou desativar, independentemente do tema ativo.

Isso não é ótimo? Agora temos um controle muito maior sobre um aspecto essencial de qualquer site: a tipografia. Para usar fontes personalizadas em seu site WordPress, você não precisará mais depender das fontes do seu tema ou brincar com CSS.

Seu uso é bem simples. Na interface de usuário do editor do site, abra a barra lateral Estilos Globais e selecione Tipografia.

O novo painel Tipografia no WordPress 6.5.
O novo painel Tipografia no WordPress 6.5.

Aqui você verá uma lista das fontes e dos elementos disponíveis. Clique no botão Gerenciar fontes à direita, e você verá uma janela pop-up com três abas.

A interface da Biblioteca de Fontes do WordPress 6.5.
A interface da Biblioteca de Fontes do WordPress 6.5.

A aba Biblioteca fornece uma visualização das fontes disponíveis, a aba Upload inclui uma área de arrastar e soltar para carregar ativos de fontes do seu computador, e a aba Instalar fontes permite que você instale fontes do Google Fonts.

Na aba Instalar Fontes você pode se conectar ao Google Fonts.
Na aba Instalar Fontes você pode se conectar ao Google Fonts.

Uma vez conectado ao Google Fonts, você verá uma lista de todas as fontes disponíveis no mesmo painel.

Google Fonts
Google Fonts.

Você também pode pesquisar fontes por nome.

Pesquisando fontes por nome no WordPress 6.5.
Pesquisando fontes por nome no WordPress 6.5.

Escolha as variantes da fonte de que você precisa, clique em Instalar, e pronto.

Variantes da fonte Ubuntu no Google Fonts.
Variantes da fonte Ubuntu no Google Fonts.

Quando você instala uma nova fonte, a Biblioteca de Fontes adiciona a definição da família da fonte às fontes instaladas e baixa o ativo da fonte para a pasta wp-content/uploads/fonts.

Desativar a Biblioteca de Fontes

Os desenvolvedores de plugins e temas podem desativar a Biblioteca de Fontes usando o novo filtro PHP fontLibraryEnabled:

function disable_font_library_ui( $editor_settings ) { 
	$editor_settings['fontLibraryEnabled'] = false;
	return $editor_settings; 
}
add_filter( "block_editor_settings_all", "disable_font_library_ui" );

DataViews

O DataViews é um componente que permite a renderização de conjuntos de dados usando diferentes tipos de layouts, como tabela, grade, lista e outros.

Com essa iteração, novas visualizações e recursos relacionados para o gerenciamento de páginas, padrões e templates passam a fazer parte do núcleo, e podemos esperar melhorias adicionais em futuras versões do WordPress.

Por enquanto, o WordPress 6.5 apresenta as seguintes exibições no Editor de Site:

  • Templates > Gerenciar todos os templates: layouts de Tabela e Grade.
  • Padrões > Partes do template > Gerenciar todas as partes do template: layouts de Tabela e Grade.
  • Padrões: layout de Grade.
  • Páginas > Gerenciar todas as páginas: layouts de Tabela e de Grade.
Configuração do layout de Grade para templates.
Configuração do layout de Grade para templates.

Além dos layouts, os data views adicionam vários recursos de visualização, incluindo filtros, pesquisa, paginação, classificação, ocultação e exibição de campos.

Configuração Campos na visualização Templates.
Configuração Campos na visualização Templates.

Um botão de Edição em massa permite que você execute várias ações em massa, dependendo do conjunto de dados atual. Para Páginas, você pode Mover para a lixeira, Restaurar e Excluir permanentemente.

Edição de páginas em massa no WordPress 6.5.
Edição de páginas em massa no WordPress 6.5.

O DataViews também vem com uma nova API de filtro principal que visa adicionar um tipo especial de filtro — sempre visível na tela — ao DataViews. A imagem abaixo mostra o novo filtro principal Sync Status na seção de administração Padrões.

O filtro primário Sync Status para padrões.
O filtro primário Sync Status para padrões.

A API DataViews vem com o novo pacote npm @wordpress/dataviews que permite que os desenvolvedores façam experiências com data views.

API Block Bindings

A API Block Bindings é uma nova API que visa a conectar atributos de bloco a valores de diferentes fontes de dados. Esses valores podem ser diferentes dependendo do contexto. Um exemplo simples seria um cabeçalho contendo o nome do autor que muda com o valor post_author.

Esse é um aprimoramento notável, pois amplia os recursos de vários blocos principais. Graças à nova API, você pode vincular dados dinâmicos de qualquer fonte a um atributo de bloco.

As fontes de dados podem ser as mais diversas: dados do site, campos personalizados, dados de usuário, padrões, códigos de acesso, outros blocos e até mesmo ferramentas externas que usam o Gutenberg. Um exemplo disso poderia ser um site do Drupal com o Gutenberg.

Do ponto de vista técnico, podemos descrever a forma como a API Block Bindings funciona como um processo de três etapas:

  1. Primeiro, você cria uma associação entre os atributos do bloco e uma fonte de dados usando um objeto bindings.
  2. A API obtém o valor da fonte de dados definida na vinculação.
  3. Em seguida, atualiza o HTML do bloco usando os valores recebidos da fonte de dados.

A primeira implementação da API Block Bindings que vem com o WordPress 6.5 permite conectar atributos de bloco e campos personalizados. Uma segunda implementação anunciada, Synced Patterns Overrides, foi adiada para uma versão futura.

No início, apenas um número limitado de blocos, como cabeçalhos, parágrafos, imagens e botões, será compatível com a API Block Bindings. Com as iterações futuras, mais blocos, até mesmo blocos personalizados, serão adicionados à lista.

Essa primeira implementação da API também permite que desenvolvedores de plugins registrem suas fontes da mesma forma que o Gutenberg registra a fonte de dados core/post-meta. Com base no exemplo de Santos Guillamot, você pode registrar a fonte de dados do seu plugin desta forma:

register_block_bindings_source(
	'myplugin/plugin-data',
	array(
		'label'              => _x( 'Plugin Data', 'block bindings source' ),
		'get_value_callback' => 'myplugin_block_bindings_post_meta_callback',
	)
);

E, em seguida, adicionar um objeto bindings ao seu bloco:

<!-- wp:paragraph 
{
	"metadata": {
		"bindings": {
			"content": {
				"source": "myplugin/plugin-data",
				"args": {
					"key":"plugin_key"
				}
			}
		}
	}
}
-->
<p>Paragraph</p>
<!-- /wp:paragraph -->

Veja uma descrição de cada propriedade:

  • metadata: Um objeto de metadados do bloco.
  • bindings: Um objeto contendo uma ou mais vinculações.
  • content: O atributo do bloco a ser vinculado a uma fonte de dados. Neste exemplo, um atributo content de um bloco de parágrafo.
  • source: A fonte das vinculações.
  • args: Um objeto de argumentos para passar à fonte de vinculações do bloco.

Futuras iterações acrescentarão mais recursos à API Block Bindings. Além disso, em breve você poderá criar vinculações a partir do Visual Editor, conectar atributos de bloco a mais fontes de dados, como dados do site ou dados de taxonomia, e usar esse recurso com mais blocos.

Dito isso, vamos nos aprofundar nas primeiras implementações da API Block Bindings.

Conexão de campos personalizados a blocos

Antes do WordPress 6.5, não havia como injetar valores de campos personalizados no conteúdo dos blocos principais. Os desenvolvedores só podiam criar blocos personalizados para exibir campos personalizados no frontend.

A partir do WordPress 6.5, você pode exibir dados armazenados em campos personalizados dentro de blocos principais, incluindo botões, cabeçalhos, imagens e parágrafos.

Conforme mencionado anteriormente, a API Block Bindings permite que você conecte atributos de bloco e diferentes fontes de dados, inclusive a fonte “meta_fields”. Para usar esse recurso, primeiro você precisa ativar os campos personalizados no editor em Opções -> Preferências -> Geral -> Avançado.

O modal Preferências no Editor de Artigos.
O modal Preferências no Editor de Artigos.

Observe que, a partir do WordPress 6.5, você não tem um controle de interface do usuário para vincular um valor de campo personalizado a um atributo de bloco.

Portanto, depois de adicionar a chave e o valor do campo personalizado, você terá de mudar para o editor de código e adicionar um objeto “bindings” dentro do delimitador de bloco, conforme mostrado no código abaixo:

<!-- wp:paragraph 
	{
		"metadata": {
			"bindings": {
				"content": {
					"source":"core/post-meta",
					"args": {
						"key":"my_custom_field"
					}
				}
			}
		}
	} -->
	<p>Paragraph</p>
<!-- /wp:paragraph -->

A adição de um campo personalizado a um bloco bloqueia os controles apropriados, tornando o conteúdo do bloco não editável.

Agora, vamos explorar como isso funciona com um bloco de imagem. Adicione dois campos personalizados para os atributos alt e src.

Dois campos personalizados para armazenar valores alt e src.
Dois campos personalizados para armazenar valores alt e src.

Em seguida, adicione um bloco de Imagem, mude para o editor de código e adicione um objeto bindings ao bloco, como no exemplo a seguir:

<!-- wp:image {
	"metadata":{
		"bindings":{
			"url":{
				"source":"core/post-meta",
				"args":{
					"key":"img_src"
				}
			},
			"alt":{
				"source":"core/post-meta",
				"args":{
					"key":"img_alt"
				}
			}
		}
	}
}
-->
<figure class="wp-block-image"><img src="" alt="" /></figure>
<!-- /wp:image -->

Você vai notar que não poderá substituir a fonte de imagem usando os controles do editor.

O espaço reservado para a imagem sem controles de mídia.
O espaço reservado para a imagem sem controles de mídia.

Com essa primeira iteração, somente os seguintes atributos de bloco podem ser conectados a campos personalizados:

  • Parágrafo: conteúdo.
  • Cabeçalho: conteúdo.
  • Imagem: URL, alt e título.
  • Botão: texto, URL, linkTarget, rel.

Para obter uma visão geral mais abrangente sobre conexão campos personalizados a atributos de bloco, consulte esta introdução abrangente ao Block Bindings.

Sistema aprimorado de revisão

As revisões lhe dão a confiança de poder desfazer qualquer alteração restaurando uma versão anterior da aparência do site a qualquer momento. Devido à importância de um sistema de revisão confiável em sites colaborativos, as revisões de estilo ocupam um lugar de destaque na fase atual de desenvolvimento WordPress. O WordPress 6.5 traz vários aprimoramentos significativos para o sistema de revisão.

Aqui está o que você pode esperar ver com as revisões no WordPress 6.5.

Descrição das alterações

Na versão anterior do WordPress, somente a data, a hora e o autor de cada revisão eram visíveis. A partir do WordPress 6.5, além desses detalhes, você também verá um breve resumo e outros detalhes dessa versão.

Resumo da revisão no WordPress 6.5.
Resumo da revisão no WordPress 6.5.

Revisões ilimitadas e paginação

Antes da versão 6.5, devido ao limite da API Rest, só era possível visualizar um máximo de 100 revisões em um único painel da barra lateral.

Graças aos dois novos seletores getRevisions e getRevision, introduzidos com o Gutenberg 17.2 e agora incorporados ao núcleo com o WordPress 6.5, o limite de 100 revisões não existe mais. Além disso, você pode navegar por todas as revisões existentes divididas em páginas de 10 itens cada.

Integração do livro de estilo de revisão

Outra mudança faz com que o painel Revisões também esteja disponível com o Livro de Estilo. Isso permite que você verifique as alterações feitas nos seus estilos em padrões e blocos não incluídos no template atual.

O Livro de Estilo agora suporta revisões.
O Livro de Estilo agora suporta revisões.

Revisões de templates e partes de templates

As revisões de templates e partes de templates também estão disponíveis para que você possa mudar para uma versão anterior do seu projeto de design, acrescentando uma camada de segurança adicional ao seu fluxo de trabalho.

API de interatividade

Antes do WordPress 6.5, para adicionar interatividade às suas páginas, os desenvolvedores deveriam ter implementado suas bibliotecas JavaScript favoritas por conta própria. Infelizmente, isso levou a uma falta de consistência no desenvolvimento de JavaScript no frontend.

A partir do WordPress 6.5, uma nova API de interatividade oferece uma maneira moderna e padronizada de adicionar interatividade ao frontend dos seus sites WordPress.

Se você está se perguntando o que essa nova API faz, tivemos uma amostra dela no início do WordPress 6.4, visto que os blocos de núcleo Imagem, Pesquisa, Arquivo, Navegação e Consulta foram refatorados usando a versão privada da API. O efeito lightbox nas imagens é outro bom exemplo.

Paginação dinâmica, pesquisa instantânea e interação em tempo real entre blocos são apenas alguns exemplos do que você poderá implementar em seus sites usando a API de interatividade:

Os blocos podem compartilhar dados, ações e retornos de chamada entre eles. Isso torna a comunicação entre os blocos mais simples e menos propensa a erros. Por exemplo, ao clicar em um bloco “adicionar ao carrinho”, você pode atualizar sem problemas um bloco “carrinho” separado.

E é incrivelmente rápido. Todos os scripts necessários para adicionar interatividade só serão carregados no frontend se você tiver pelo menos um bloco interativo na página.

A API de interatividade adota uma abordagem moderna de desenvolvimento de frontend que aproveita o poder dos atributos HTML personalizados para reduzir a quantidade de JavaScript necessária para adicionar interatividade às suas páginas.

Se você estiver familiarizado com bibliotecas de frontend como HTMX e Alpine.js, ficará feliz em ver a mesma lógica implementada no WordPress com a API de interatividade. Então, do que se trata? Vamos nos aprofundar.

O que é API de interatividade?

A API de interatividade é um novo sistema padrão de diretivas para a criação de blocos interativos que permitirá aos desenvolvedores adicionar facilmente interatividade ao frontend dos seus blocos para que os visitantes do site possam interagir com seu conteúdo sem precisar recarregar a página. Pense em coisas como pesquisa instantânea, adição de comentários, adição a um carrinho e paginação dinâmica.

A nova API atende a uma série de requisitos que a tornam uma ferramenta de desenvolvimento moderna, incluindo os seguintes:

  • Ela oferece suporte a renderização no lado do servidor e a HTML hidratado pelo cliente.
  • Funciona bem com PHP e com o sistema de blocos atual.
  • É compatível com as versões anteriores dos hooks do WordPress e bibliotecas JavaScript existentes.
  • Segue uma abordagem declarativa em vez de uma abordagem imperativa.
  • Tem desempenho e é extensível.
  • É atômica e componível: Cada diretiva controla uma pequena parte do DOM, e várias diretivas podem ser combinadas para criar aplicativos complexos.
  • É compatível com as ferramentas de desenvolvimento do WordPress existentes.

Conforme mencionado acima, a API de interatividade é baseada em diretivas, que são atributos HTML especiais que permitem que você anexe um comportamento específico aos elementos do DOM. Aqui está um exemplo de um bloco interativo:

<div
	<?php echo get_block_wrapper_attributes(); ?>
	data-wp-interactive='{ "namespace": "create-block" }'
	data-wp-context='{ "isOpen": false }'
	data-wp-watch="callbacks.logIsOpen"
>
	<button
		data-wp-on--click="actions.toggle"
		data-wp-bind--aria-expanded="context.isOpen"
		aria-controls="<?php echo esc_attr( $unique_id ); ?>"
	>
		<?php esc_html_e( 'Toggle', 'inter-block' ); ?>
	</button>

	<p
		id="<?php echo esc_attr( $unique_id ); ?>"
		data-wp-bind--hidden="!context.isOpen"
	>
		<?php
			esc_html_e( 'Inter Block - hello from an interactive block!', 'inter-block' );
		?>
	</p>
</div>

O WordPress processa essas diretivas no servidor e gera a marcação correspondente.

Como começar a usar a API de interatividade

A implementação da API de interatividade não afetará o fluxo de trabalho de criação de blocos. Você pode criar um plugin que registre um bloco interativo usando o comando @wordpress/create-block e um template interativo específico.

Inicie sua ferramenta de linha de comando favorita, navegue até o diretório plugins e execute o seguinte comando:

npx @wordpress/create-block@latest my-interactive-block --template @wordpress/create-block-interactive-template

Isso gera um bloco interativo a partir de um template que usa o campo de metadados viewScriptModule. O módulo de script declarado em viewScriptModule será enfileirado quando um bloco for renderizado no frontend. (Consulte também as notas de desenvolvimento de viewScriptModule e Script Modules).

Um projeto de bloco interativo no Visual Studio Code.
Um projeto de bloco interativo no Visual Studio Code.

Quando o processo de instalação estiver concluído, você encontrará um novo plugin no painel WordPress. Ative-o e, em seguida, volte para a linha de comando, navegue até o diretório do novo plugin e inicie o serviço:

cd my-interactive-block && npm start

Agora, crie um novo artigo ou página, abra o inseridor de blocos e role para baixo até a seção Widgets. Lá você encontrará um novo bloco chamado Meu bloco interativo, que pode ser usado como template para novas criações interessantes e interativas:

Um bloco de desenvolvimento interativo.
Um bloco de desenvolvimento interativo.

Adicione o bloco ao seu conteúdo e salve o artigo. A visualização do artigo mostrará um botão de alternância para ocultar/exibir um texto de amostra. E é isso. Agora você pode começar a criar blocos interativos.

Você pode ler mais sobre como criar blocos interativos usando a API de interatividade no blog WordPress Core, na documentação do GitHub e na nota de desenvolvimento da API de interatividade.

Um ótimo exemplo da API de interatividade em funcionamento é o site de demonstração wpmovies.dev.

Novas ferramentas de design

O WordPress 6.5 também apresenta novas ferramentas de design que permitem que você personalize ainda mais seu design sem depender de código CSS personalizado.

Suporte a tamanho e repetição de imagem de fundo para o bloco Grupo

O bloco Grupo agora oferece suporte a recursos de tamanho e repetição para imagens de fundo. Isso também permite que você defina o tamanho da imagem de fundo para cobrir ou conter, mantendo a mesma proporção.

Controle do tamanho da imagem de fundo para um bloco Grupo.
Controle do tamanho da imagem de fundo para um bloco Grupo.

Além disso, quando você define o tamanho do plano de fundo como Fixo, um botão Repetir é exibido para permitir que você ative ou desative a repetição do plano de fundo.

Suporte a tamanho proporcional para o bloco Cobertura

O bloco Cobertura recebeu suporte a tamanho proporcional. Você pode controlar a proporção do aspecto do bloco de forma global na interface Estilo Global ou ajustá-la individualmente no seu conteúdo.

O controle de proporção de aspecto do bloco Cobertura.
O controle de proporção de aspecto do bloco Cobertura.

Suporte de sombra para mais blocos

Até agora, o bloco Botão era o único bloco com suporte a sombras. O WordPress 5.6 adiciona suporte a sombra aos blocos Colunas, Coluna e Imagem.

Você pode adicionar sombras a esses blocos na aba Estilos do bloco nas configurações do bloco.

O bloco Imagem agora suporta sombra.
O bloco Imagem agora suporta sombra.

Atualizações no editor de site

Vários aprimoramentos no editor de site devem melhorar significativamente sua experiência de edição e otimizar seu fluxo de trabalho.

Aprimoramentos na Exibição em lista

A Exibição em lista é um elemento central do fluxo de trabalho de design, e o WordPress 6.5 apresenta vários aprimoramentos.

Primeiro, agora você pode clicar com o botão direito do mouse na Exibição em lista para acessar o menu suspenso de configurações de bloco. Esse é um aprimoramento pequeno, mas útil, que deve agilizar seu processo de criação, pois facilita o acesso às configurações de bloco na Exibição em lista.

Um segundo aprimoramento permite que você renomeie quase todos os blocos na Exibição em lista, exceto os seguintes blocos:

  • core/block
  • core/template-part
  • core/pattern
  • core/navigation

A Visualização de lista também foi aprimorada com um atalho de teclado. Agora você pode selecionar todos os blocos na Exibição em lista clicando em CTRL + A no Windows e em CMD + A no Mac. Isso permite que você execute ações em massa com facilidade.

Duplicar e renomear padrões

Os padrões fornecidos pelos temas não são editáveis, portanto você não pode usá-los para criar seus próprios padrões ou simplesmente alterar algo no padrão. O WordPress 6.5 adiciona um recurso pequeno, mas útil que permite duplicar e renomear padrões, possibilitando que você altere as configurações de sincronização e modifique os padrões conforme necessário.

Agora é possível renomear e excluir padrões.
Agora é possível renomear e excluir padrões.

Além disso, duas novas categorias de padrões foram adicionadas: Áudio e Vídeo.

O painel Categorias de padrões no WordPress 6.5.
O painel Categorias de padrões no WordPress 6.5.

Um painel Preferências aprimorado

Com o WordPress 6.5, o painel Preferências foi atualizado e as configurações existentes foram reorganizadas. As principais alterações incluem:

  • Novos painéis “Aparência” e “Acessibilidade”.
  • Uma nova configuração Barra de ferramentas superior em Aparência.

Ao ativar a Barra de ferramentas superior, você move todas as ferramentas de bloco e documento para uma única barra de ferramentas na parte superior do editor.

A interface Preferências renovada com a barra de ferramentas superior ativada.
A interface Preferências renovada com a barra de ferramentas superior ativada.

Bloqueio da barra de ferramentas em modo livre de distrações

Antes do WordPress 6.5, não era possível acessar a barra de ferramentas de blocos no modo sem distrações, e você era obrigado a ativá-la e desativá-la em cada alteração. A partir do WordPress 6.5, ao mover o cursor sobre a área superior do editor, você verá a barra de ferramentas de bloco para suas personalizações.

A barra de ferramentas de bloco no modo sem distrações.
A barra de ferramentas de bloco no modo sem distrações.

Componente LinkControl aprimorado

O LinkControl foi aprimorado e agora é mais fácil adicionar links. A imagem a seguir mostra o novo painel que aparece quando você clica em um link para editar.

Editando um link no WordPress 6.5.
Editando um link no WordPress 6.5.

Para obter uma lista completa das mudanças no componente LinkControl, consulte PR #50891.

Melhorias no recurso Arrastar e soltar

O recurso Arrastar e soltar foi aprimorado em várias áreas do editor.

Na Exibição em lista:

  • Quando você solta um bloco em um bloco recolhido, o bloco recolhido se expande.
  • Um cursor de arraste aparece quando você está arrastando elementos.

Na tela do editor:

  • Agora você pode arrastar e soltar elementos no início ou no final do seu conteúdo.
  • O recurso de arrastar e soltar elementos entre blocos de contêineres irmãos foi aprimorado.
  • Também é possível arrastar blocos em partes de templates.
  • Uma nova indicação visual agora informa que um bloco não pode ser arrastado.
  • Você pode arrastar e soltar elementos no início ou no final de um documento.
  • Você pode criar linhas ou galerias simplesmente arrastando e soltando blocos próximos a outros blocos. Por exemplo, adicionar uma imagem ao lado de outra imagem converterá o bloco Imagem existente em um bloco Galeria.
Arrastando e soltando uma imagem perto de um bloco Imagem.
Arrastando e soltando uma imagem perto de um bloco Imagem.
Agora você pode converter um bloco de imagem em uma galeria arrastando e soltando imagens.
Agora você pode converter um bloco de imagem em uma galeria arrastando e soltando imagens.

Para obter uma lista mais abrangente de aprimoramentos em arrastar e soltar, consulte Block drag and drop tracking issue.

Mudanças e aprimoramentos adicionais

Mas, espere, isso não é tudo! O WordPress 6.5 também traz várias outras mudanças e aprimoramentos que vale a pena mencionar.

Ferramentas de aparência para temas clássicos

Os temas clássicos também podem tirar proveito de alguns dos recursos de design introduzidos no editor de site, mesmo sem usar o theme.json. Começando com o WordPress 6.5, se você optar pelo suporte ao tema appearanceTool, poderá incluir os seguintes recursos de design:

  • Borda
  • Cor
  • Espaçamento
  • Tipografia

Isso pode dar aos usuários de temas clássicos uma prévia dos recursos do editor de site e simplificar a transição dos temas clássicos para os de blocos.

Ferramentas de aparência no WordPress 6.5 com o tema Twenty Twenty-One.
Ferramentas de aparência no WordPress 6.5 com o tema Twenty Twenty-One.

Suporte a AVIF

O WordPress 6.5 também introduz suporte ao formato de imagem AVIF, caracterizado por um algoritmo de compactação avançado que permite uma qualidade de imagem superior em uma taxa de compactação elevada. Consequentemente, o AVIF produz arquivos de imagem menores em comparação com os formatos convencionais, incluindo o formato WebP.

Agora os usuários podem fazer upload de arquivos AVIF sem problemas por meio da biblioteca de mídia do WordPress da mesma forma que outros formatos de imagem. No entanto, verifique a compatibilidade com o formato de arquivo AVIF em sua plataforma de hospedagem.

Suporte do navegador ao formato de imagem AVIF
Suporte do navegador ao formato de imagem AVIF (Fonte: Can I Use).

Você pode verificar se o seu provedor de hospedagem suporta o formato de imagem AVIF na tela Site Health da sua instalação do WordPress, clicando na aba Info e expandindo a seção Media Handling.

Dependências de plugin

Alguns plugins adicionam novos recursos a outros plugins como extensões/complementos. Para que esses plugins funcionem, primeiro você precisa instalar e ativar suas dependências — os plugins dos quais eles dependem.

Desde o WordPress 6.5, os desenvolvedores de plugins podem usar um novo cabeçalho de plugin “Requires Plugins” (plugins necessários). Esse cabeçalho desbloqueia um recurso avançado que simplifica o processo de instalação e ativação de dependências. Ele contém uma lista de slugs separados por vírgulas das dependências necessárias para que um plugin dependente funcione.

Isso fornece informações ao usuário do plugin com links para o Repositório de Plugins do WordPress.org para instalar e ativar as dependências.

Além disso, o plugin de dependência fornece um detalhe “Required by” (necessário para) que lista os plugins dependentes que precisam dele para funcionar. Você também notará que não tem permissão para excluir o plugin de dependência, a menos que exclua o plugin dependente.

Plugins necessários no WordPress 6.5.
Plugins necessários no WordPress 6.5.

O WordPress 6.5 também apresenta um novo filtro wp_plugin_dependencies_slug que permite que você filtre slugs de dependência de forma programática.

Consulte a nota do desenvolvedor sobre dependências de plugins para uma discussão mais detalhada.

Atualizações da API HTML

Com o WordPress 6.5, o Processador de Tag da API HTML recebeu vários aprimoramentos, e agora escaneia todo tipo de token de sintaxe, incluindo tokens de tag e não tag, comentários, definições de doctype e nós de texto.

Isso permite alterar o texto contido nos limites do token, conhecido como texto modificável, sem afetar a estrutura de um documento.

O texto modificável é o conteúdo inteiro de um nó de texto, o conteúdo de um comentário HTML ou o conteúdo entre as tags de abertura e fechamento de elementos especiais, como os elementos script ou style.

Vários novos métodos foram introduzidos:

  • next_token() — passa para o próximo token no documento
  • get_token_type() — obtém o tipo de token encontrado
  • get_token_name() — obtém o nome de um token
  • get_modifiable_text() — retorna o conteúdo de texto decodificado corretamente para um determinado token
  • get_comment_type() — obtém o tipo de comentário
  • paused_at_incomplete_token() — retorna true se o Processador de Tag chegar ao final de um documento truncado no meio de um token.

Para obter uma visão geral mais ampla, consulte a nota de desenvolvimento Atualizações da API HTML na versão 6.5.

Unificação do editor de sites e artigos

No WordPress 6.5, os editores recebem várias atualizações destinadas a unificar a interface do usuário e o comportamento.

Vários painéis da barra lateral foram movidos do pacote edit-post para o pacote @wordpress/editor para trazer as funcionalidades correspondentes para o Editor de site:

  • Atributos da página (PR #57151)
  • Taxonomia do artigo (PR #57049)
  • Adicionado o link Exibir ao editor de site para tipos de artigo (PR #57153)
  • Adicionado o painel Discussão à barra lateral do editor de site para os tipos de artigo que o suportam (PR #57150)
  • Adicionado o painel de imagens em destaque (PR #57053)
  • Adicionado o painel de revisão ao editor de site (PR #57010)

Outra mudança permite que você visualize o template ao editar uma página no Editor de Artigos, como já era possível no Editor de Site, e você pode ativar/desativar a pré-visualização do template na barra lateral de Configurações da página.

Aprimoramentos de desempenho

Mais de 110 aprimoramentos de desempenho levaram a um aumento significativo na velocidade e na eficiência do Editor de Artigos e do Editor de Site. Os tempos de carregamento agora são duas vezes mais rápidos do que na versão 6.4, e a velocidade de processamento de entrada é quase quatro vezes mais rápida. Além disso, a integração da biblioteca i18 da Performant Translations contribui para reduzir o uso da memória e a sobrecarga do tempo de carregamento de sites traduzidos.

Melhorias na acessibilidade

Com o lançamento do WordPress 6.5, mais de 65 atualizações serão incorporadas ao núcleo para melhorar a acessibilidade em todo o painel de controle. Essas melhorias incluem estilo de foco, taxa de contraste, ordenação do menu do Personalizador e muito mais.

Atualizações dos Hooks de Blocos

Introduzidos pela primeira vez no WordPress 6.4, os Hooks de Blocos permitem colocar automaticamente um bloco em uma posição específica quando outro bloco é adicionado ao conteúdo.

Os Hooks de Blocos estavam disponíveis anteriormente para templates, partes de templates e padrões que não tivessem nenhuma modificação do usuário. Agora, eles também podem ser usados com layouts modificados.

Antes do WordPress 6.5, um bloco com hook só podia ser adicionado antes ou depois do Bloco de Navegação. Com essa iteração, esses blocos também podem ser adicionados a um Bloco de Navegação como o primeiro ou último child.

Além disso, essa iteração introduz os novos filtros hooked_block e hooked_block_{$hooked_block_type}.

Para obter uma visão geral mais detalhada e exemplos de uso, consulte a nota do desenvolvedor sobre as atualizações dos Hooks de Blocos.

Resumo

O WordPress 6.5 traz inúmeras mudanças que vão te deixar feliz no que diz respeito à construção de sites e criação de conteúdo.

A nova Biblioteca de Fontes do WordPress permite que você gerencie fontes de forma semelhante ao gerenciamento de mídia na Biblioteca de Mídia, proporcionando maior controle sobre a tipografia. Com o DataViews, você pode renderizar seus conjuntos de dados usando diferentes layouts, filtros e opções de pesquisa, melhorando a experiência geral. Com a API Block Bindings e a API de interatividade, você pode proporcionar uma experiência mais dinâmica e personalizada aos usuários do seu site.

Com todas essas atualizações interessantes, o WordPress 6.5 é um divisor de águas.

Você já testou a nova versão do WordPress em seu ambiente de desenvolvimento? De quais recursos novos você mais gosta no WordPress 6.5? Compartilhe suas ideias na seção de comentários.

Carlo Daniele Kinsta

Carlo é um apaixonado por webdesign e desenvolvimento frontend. Ele tem mais de 10 anos de experiência com WordPress e colaborou com diversas universidades e instituições educacionais na Itália e na Europa. Carlo já publicou inúmeros artigos e guias sobre WordPress, tanto em sites italianos quanto internacionais, além de revistas impressas. Você pode seguir ele no LinkedIn e no X.