O WordPress 5.5 “Eckstine” foi lançado, e está na hora de introduzirmos as mudanças e características mais notáveis adicionadas ao Core com o segundo lançamento do WordPress do ano.

Hoje em dia, estamos acostumados a ver muitas adições ao editor de blocos a cada versão do WordPress. O WordPress 5.5 não é exceção!

Esta versão também traz toneladas de mudanças não relacionadas com o editor que devem ter um grande impacto na forma como usamos o CMS,

Enquanto o WordPress 5.5 traz muitas mudanças ao WordPress Core, várias características esperadas com 5.5 foram adiadas e removidas desta versão por causa de várias questões não resolvidas. Portanto, edição completa do site, bloco de navegação, tela de navegação e tela widget não fazem parte do WordPress 5.5.

Se você quiser ler mais sobre o ciclo de desenvolvimento do WordPress 5.5, verifique os links abaixo:

  • 7 de Julho de 2020: Beta 1
  • 14 de Julho de 2020: Beta 2
  • 21 de Julho de 2020: Beta 3
  • 27 de Julho de 2020: Beta 4
  • 28 de Julho de 2020: RC 1
  • 4 de Agosto de 2020: RC 2
  • 10 de Agosto 2020: RC 3
  • 10 de Agosto de 2020: Dry run para lançamento do WordPress 5.5
  • 11 de agosto de 2020: Lançamento final do WordPress 5.5 “Eckstine

Então, o que há de novo no WordPress 5.5?

O que há de novo com The Block Editor

Com o lançamento final do WordPress 5.5, dez versões do plugin Gutenberg foram adicionadas ao núcleo, trazendo um grande número de melhorias, características, correções de bugs que afetam cada aspecto da experiência de edição, desde a usabilidade até a funcionalidade e o desempenho.

Seria quase impossível mencionar todas essas mudanças aqui, portanto, neste post, você encontrará apenas uma seleção escolhida a dedo de nossas novidades e melhorias favoritas.

Para uma lista mais abrangente de melhorias e recursos adicionados ao editor de blocos com WordPress 5.5, veja os anúncios oficiais dos lançamentos dos plugins: 7.5, 7.6, 7.7, 7.8, 7.9, 8.0, 8.1, 8.2, 8.3, 8.4, 8.5.

Dito isto, aqui vamos cobrir as seguintes adições trazidas ao editor de blocos com o WordPress 5.5:

  1. Novo design UI
  2. Ferramentas de desenho de blocos
  3. Edição de imagens em linha
  4. Categorias de blocos e novo painel de inserção de blocos
  5. O Diretório de Blocos e Plugins de Bloco
  6. Novo desenho da IUs

Novo design UI

Cada versão do plugin Gutenberg traz pequenas e não tão pequenas melhorias que estão mudando silenciosamente a experiência geral de edição. Muitas dessas mudanças serão agora fundidas no núcleo do WordPress. Portanto, quando você lançar o editor de blocos no WordPress 5.5 pela primeira vez, uma interface ligeiramente diferente deverá chamar sua atenção. Você vai encontrar:

  • Uma barra de ferramentas de blocos simplificada
  • Contraste de cor mais forte
  • Novos ícones
  • Movimentadores de blocos
  • Elementos circundantes
  • Pré-visualização do dispositivo
  • Arrasto e queda melhorados
  • Estilos de foco em bloco melhorados e unificados em toda a IU
  • Capacidade de formatar vários blocos ao mesmo tempo
  • Melhor desempenho
Formatação de múltiplos blocos no WordPress 5.5
Formatação de múltiplos blocos no WordPress 5.5

As mudanças mencionadas acima são apenas algumas das muitas mudanças que afetam a experiência de edição.

Visualização móvel no WordPress 5.5
Visualização móvel no WordPress 5.5

As mudanças adicionais também incluem:

Opções de Assinatura e Superescrito

As opções de formatação para texto subscrito e superescrito estão agora disponíveis através dos controles Rich Text (Gutenberg 8.0).

A nova barra de ferramentas de blocos com ícones redesenhados, movimentador de blocos e melhor contraste de cores
A nova barra de ferramentas de blocos com ícones redesenhados, movimentador de blocos e melhor contraste de cores

Seleção dos blocos de pais

Um novo botão da barra de ferramentas aparece agora ao pairar sobre o lado esquerdo da barra de ferramentas do bloco. O novo botão permite selecionar os blocos pai em contextos aninhados (Gutenberg 8.3).

O seletor pai em um bloco de Mídia & Texto
O seletor pai em um bloco de Mídia & Texto

Ferramentas de desenho de blocos

Várias ferramentas de projeto foram adicionadas ao plugin Gutenberg nos últimos meses e agora serão incluídas no núcleo com o WordPress 5.5.

Controle de Altura e Gradientes de Fundo

Um primeiro conjunto de ferramentas fornece controle sobre dimensões e cor de fundo para vários blocos (Gutenberg 7.9).

Configurações do gradiente de fundo para o bloco Colunas
Configurações do gradiente de fundo para o bloco Colunas

Padding e controle de cores do link

Duas características adicionais chegaram ao núcleo (Gutenberg 8.3), mas no momento em que foram escritas ainda estão marcadas como experimentais:

  • Controle de estofamento para bloco de cobertura.
  • Controle de cores de link para Parágrafo, Título, Grupo, Colunas e Blocos de Mídia e Texto.

O controle de estofamento e controle de cores do link estão desligados por padrão e os desenvolvedores têm que declarar explicitamente o suporte a eles, como explicado no Manual do Editor de Blocos.

Se você quiser adicionar controles de acolchoamento para o bloco Cover block a seus temas, basta adicionar a seguinte linha às funções de seu tema.php:

add_theme_support( 'experimental-custom-spacing' );

Se você quiser ativar o controle de cores de link para Parágrafo, Título, Grupo, Colunas e Blocos de Mídia e Texto, basta adicionar a seguinte linha ao arquivo de funções do seu tema:

add_theme_support( 'experimental-link-color' );

Unidades personalizadas e alturas de linha personalizadas

Esta nova característica permite definir valores px, em, rem, vw e altura vh para o bloco Cover (Gutenberg 7.9). Também é suportado, mas é omitido devido à imprevisibilidade da renderização das alturas percentuais.

Com o controle de altura aprimorado, você pode saltar valores em 10 segurando o Shift enquanto pressiona up ou down.

O novo Controle de Unidade
O novo Controle de Unidade

Os desenvolvedores podem adicionar suporte às unidades personalizadas definindo a bandeira de suporte das custom-units:

add_theme_support( 'custom-units' );

Você também pode definir unidades personalizadas específicas:

add_theme_support( 'custom-units', 'rem', 'em' );

Os desenvolvedores também podem adicionar alturas de linha personalizadas para cabeçalho e parágrafos definindo a bandeira de suporte de custom-line-height:

add_theme_support( 'custom-line-height' );

Edição de imagens em linha

Um novo recurso de edição foi adicionado ao editor de blocos com Gutenberg 8.4 permitindo aos usuários editar imagens diretamente do bloco de imagens.

Agora ele foi fundido ao núcleo e, a partir do WordPress 5.5, você pode cortar, girar, fazer zoom e ajustar as posições das imagens sem a necessidade de lançar a Biblioteca de Mídia, resultando em uma experiência de edição mais rápida.

Se você usar para publicar toneladas de fotos, sem dúvida você vai gostar deste recurso.

Edição de imagens em linha no WordPress 5.5
Edição de imagens em linha no WordPress 5.5

Basta clicar no botão Cortar na barra de ferramentas de imagem e você terá acesso às novas funcionalidades de edição. Quando você estiver satisfeito com suas personalizações, aplique suas alterações e pronto.

O WordPress salvará uma nova imagem como anexo na Biblioteca de Mídia e copiará detalhes da imagem original (título, descrição, legenda, texto alt, e dados EXIF). Isto lhe dá controle completo sobre as novas versões da imagem.

Categorias de blocos e novo painel de inserção de blocos

Um painel de inserção de blocos redesenhado mostra blocos e padrões por categorias, melhorando significativamente a experiência de edição e tornando os blocos e padrões mais fáceis de encontrar (Gutenberg 8.3).

Blocos e abas Padrões no novo inseridor de blocos
Blocos e abas Padrões no novo inseridor de blocos

O Diretório de Blocos e Plugins de Bloco

Com a implementação do diretório de blocos, você pode encontrar, instalar e adicionar blocos de terceiros diretamente do inseridor de blocos.

Quando você procurar por um bloco, se ainda não o tiver instalado, será solicitado a você uma lista de plugins disponíveis no Plugin Directory. Esses plugins são chamados de “plugins de bloco” e você pode adicioná-los ao seu editor com um único clique.

Um bloco de terceiros da comunidade WordPress
Um bloco de terceiros da comunidade WordPress

Graças a este novo recurso fantástico, você pode agora construir seus próprios blocos e publicá-los no Diretório de Plugins, tornando suas criações disponíveis para toda a comunidade WordPress.

A boa notícia é que, para criar seus blocos personalizados, você não precisa ser um guru PHP. Você só precisaria de alguns conhecimentos de JavaScript.

Não tem certeza de como começar a desenvolver seus próprios blocos? A fantástica comunidade WordPress o cobriu com um tutorial passo a passo fácil.

A primeira versão do tutorial de blocos já está disponível no Manual Oficial do Editor de Blocos para ajudá-lo a aprender os conceitos básicos do desenvolvimento de blocos. Você pode ler mais sobre o diretório de blocos e o desenvolvimento de plugins de blocos no blog Make WordPress Plugins.

Padrões de blocos

Em março de 2020, Gutenberg 7.7 e Gutenberg 7.8 introduziram padrões de blocos e o API de padrões de blocos para temas e plugins.

Os padrões de blocos são layouts de blocos predefinidos, permitindo aos usuários adicionar rapidamente estruturas complexas de blocos aninhados a suas páginas. Sua intenção é ajudar escritores de conteúdo e administradores de sites a superar a “síndrome da página em branco” e construir layouts profissionais e visualizações avançadas com facilidade.

Devemos ver os padrões de blocos no seu melhor com edição completa no local.

Uma explicação clara do que se pretende com os padrões de blocos vem de Mathias Ventura, arquiteto líder do projeto Gutenberg:

Um esclarecimento – a configuração de “padrões de blocos” é menos sobre peças de modelo (que são estruturalmente significativas) e mais sobre elementos de design geral feitos de blocos menores. Uma vez inseridos, eles não são armazenados separadamente. Por exemplo, uma imagem de “capa” que combina alguns blocos para conseguir um visual específico que, de outra forma, levaria algum trabalho a ser realizado pelos usuários. Pense nisso mais como uma coleção de desenhos que podem ser adicionados em qualquer lugar sem necessariamente representar uma parte reutilizável de um modelo temático.

Diferente das peças do modelo, os padrões de blocos são elementos de design que devem ajudar os administradores do site e os criadores de conteúdo a acelerar e melhorar sua experiência de edição.

Lançado com Gutenberg 7.7, a princípio os Padrões de Bloco apareceram em um plugin de barra lateral. Mais tarde, com o lançamento do Gutenberg 8.0, eles passaram para um inseridor de blocos remodelado, agora aparecendo como um painel colocado no lado esquerdo do editor, como mostrado na imagem abaixo:

O Padrão da Galeria em WordPress 5.5
O Padrão da Galeria no WordPress 5.5

Em seu estágio inicial, os padrões de blocos vêm com um conjunto muito limitado de padrões. De qualquer forma, elas trazem um enorme aprimoramento à experiência de edição e, espera-se, mais seria acrescentado no futuro próximo.

Como blocos regulares, os padrões são pesquisáveis e vêm organizados nas seguintes categorias:

  • Texto
  • Herói
  • Colunas
  • Botões
  • Galeria
  • Características
  • Depoimentos
  • Não categorizado
O padrão de características numeradas no WordPress 5.5
O padrão de características numeradas no WordPress 5.5

Além dos padrões de blocos integrados, os desenvolvedores do WordPress podem fornecer seus temas e plugins com padrões personalizados, aproveitando uma API totalmente nova.

Você pode registrar seus padrões personalizados usando a função register_block_pattern e register_block_pattern_category para categorias.

register_block_pattern aceita dois argumentos:

  1. O nome do padrão.
  2. Um conjunto de propriedades de padrões.

As propriedades incluem o seguinte:

  • title
  • content
  • description
  • categories
  • keywords
  • viewportWidth

register_block_pattern_category leva também dois argumentos:

  1. O nome da categoria do padrão.
  2. Um conjunto de propriedades.

A API também fornece duas funções para desregistrar padrões e categorias: unregister_block_pattern e unregister_pattern_category.

A maneira como você pode construir seus próprios padrões de blocos é bastante simples. Por exemplo, copie e cole o seguinte código em um plugin personalizado ou em um arquivo de funções de um tema infantil, depois mude o nome do padrão de acordo com suas preferências

add_action( 'init', function(){

	register_block_pattern_category( 
		'kinsta', 
		array( 'label' => __( 'Kinsta stuff', 'kinsta-pattern' ) ) );

	register_block_pattern(
	'kinsta-pattern/my-custom-pattern',
	array(
		'title'			=> __( 'Two Kinsta buttons', 'kinsta-pattern' ),
		'description'	=> _x( 'Two nice buttons.', 'Kinsta Buttons', 'kinsta-pattern' ),
		'content'		=> "<!-- wp:buttons {\"align\":\"center\"} -->\n<div class=\"wp-block-buttons aligncenter\"><!-- wp:button {\"backgroundColor\":\"very-dark-gray\",\"borderRadius\":0} -->\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link has-background has-very-dark-gray-background-color no-border-radius\">" . esc_html__( 'Button One', 'kinsta-pattern' ) . "</a></div>\n<!-- /wp:button -->\n\n<!-- wp:button {\"textColor\":\"very-dark-gray\",\"borderRadius\":0,\"className\":\"is-style-outline\"} -->\n<div class=\"wp-block-button is-style-outline\"><a class=\"wp-block-button__link has-text-color has-very-dark-gray-color no-border-radius\">" . esc_html__( 'Button Two', 'kinsta-pattern' ) . "</a></div>\n<!-- /wp:button --></div>\n<!-- /wp:buttons -->",
		'categories'	=> array( 'kinsta' ),
	)
	);
});

O código acima é uma simples personalização do trecho original do Bloco de Referência API. Como você pode ver, não é necessário JavaScript.

Um padrão de blocos personalizados
Um padrão de blocos personalizados

Veja também Block Patterns no WordPress 5.5.

Carregamento preguiçoso de imagem nativa no WordPress Core

O ‘carregamento preguiçoso‘ é uma técnica de otimização que adia o carregamento de recursos não críticos. Isto significa que o navegador é instruído a carregar o conteúdo visível na página e diferir o download e a renderização das imagens colocadas abaixo da dobra até que elas sejam realmente necessárias.

Antes do carregamento preguiçoso nativo, os desenvolvedores web podiam carregar os ativos via JavaScript, usando o IntersectionObserver API ou usando os manipuladores de eventos de scroll, resize e orientationchange.

Mas como o carregamento preguiçoso se tornou um padrão, não precisamos mais escrever códigos personalizados ou usar bibliotecas JavaScript e as imagens de carregamento preguiçoso podem ser implementadas usando o novo atributo de loading nas tags img e iframe.

Carregamento preguiçoso via atributo para imagens e iframes
Carregamento preguiçoso via atributo para imagens e iframes (Fonte: caniuse.com)

O atributo de loading determina se o navegador deve carregar um recurso imediatamente ou esperar até que algumas condições sejam cumpridas. Atualmente, ele suporta os seguintes valores:

  • lazy: esperar até que algumas condições sejam cumpridas
  • eager: carregue o recurso imediatamente
Configurações de carregamento preguiçoso em Chrome
Configurações de carregamento preguiçoso em Chrome(disponível em chrome:// bandeiras/#enable-lazy-image-load)

No momento desta redação, o carregamento nativo preguiçoso é suportado pela Microsoft Edge, Firefox, Google Chrome, navegador Opera, navegador Android, e Chrome para Android.

Configurações de carregamento preguiçoso em Autoptimize
Configurações de carregamento preguiçoso em Autoptimize

Antes do WordPress 5.5, o carregamento preguiçoso só era possível no WordPress com um plugin de otimização comoAutoptimize, BJ Lazy Load, ou outros. Agora ele faz parte do núcleo do WordPress e não vai requerer a instalação de plugins adicionais!

Carregamento nativo preguiçoso no WordPress

Como Felix Arntz relatou em um antigo post no blog Make WordPress Core blog, uma implementação JavaScript de carregamento preguiçoso no WordPress foi inicialmente proposta há alguns anos, mas nunca se tornou parte do Core. A nova implementação de carregamento de imagem preguiçosa nativa remove qualquer preocupação de compatibilidade. Assim, o novo recurso poderia ser fundido com segurança no Core com o WordPress 5.5.

De acordo com Felix, o carregamento preguiçoso de imagens nativas no WordPress teria um impacto benéfico no desempenho do site e na experiência do usuário para um grande número de sites WordPress que não fazem uso de plugins de carregamento preguiçoso:

… sem exigir nenhum conhecimento técnico ou mesmo consciência da carga preguiçosa como um conceito. A adoção do novo atributo de carga é uma grande chance para o WordPress liderar o caminho para uma web mais rápida em geral.

A fim de evitar mudanças de layout, o loading="lazy" será automaticamente adicionado às tags img com atributos de width e heighte isso só é possível se a imagem estiver disponível para WordPress como anexo e incluir uma classe wp-image-$id.

O carregamento preguiçoso é uma otimização obrigatória para cada instalação e website WordPress com uma quantidade considerável de imagens. Notas de Félix:

Isto economizará drasticamente largura de banda em ambos os servidores, bem como nos agentes do usuário em sites onde as imagens mais abaixo da página costumavam ser carregadas imediatamente, mesmo no caso de o usuário nunca rolar em direção a eles.

A carga preguiçosa nativa no WordPress funciona com as seguintes imagens:

  • Imagens no conteúdo do post (o_content).
  • Imagens em trechos postais (the_excerpt).
  • Imagens em widgets de texto (widget_text_content).
  • Imagens de avatares feitas via get_avatar().
  • Imagens modelo usando wp_get_attachment_image

Com a primeira implementação, a carga preguiçosa suporta apenas imagens, mas podemos esperar um futuro aumento da carga preguiçosa nas etiquetas do iframe.

Carregamento preguiçoso para desenvolvedores WordPress

Os desenvolvedores podem anular o comportamento padrão usando vários novos filtros. Entre esses filtros, wp_lazy_loading_enabled e wp_img_tag_add_loading_attr são os mais úteis para os desenvolvedores:

  • wp_lazy_enabled_enabled liga e desliga o atributo de carga. Este filtro pode ser aplicado globalmente ou por tag.
  • wp_img_tag_add_load_attr filtra o valor do atributo de carga e fornece uma maneira de controlar a carga preguiçosa por imagem.

O exemplo a seguir mostra como desativar globalmente a carga preguiçosa:

add_filter( 'wp_lazy_loading_enabled', '__return_false' );

Também podemos desativar o carregamento preguiçoso para uma etiqueta específica. No exemplo abaixo, o carregamento preguiçoso é desativado em imagens the_content (leia mais em Make WordPress Core):

add_filter(
	'wp_lazy_loading_enabled',
	function( $default, $tag_name, $context ){
		if ( 'img' === $tag_name && 'the_content' === $context ){
			return false;
		}
		return $default;
	},
	10,
	3
);
  • $default: O valor padrão booleano (verdadeiro).
  • $tag_name: O nome da etiqueta dos elementos a serem carregados preguiçosamente.
  • $context: Um parâmetro opcional especificando o contexto da imagem (veja a lista acima).

Observe que, no momento desta redação, o parâmetro $tag_name só suporta a tag img. De qualquer forma, como mencionado acima, mais tags devem ser adicionadas a futuras implementações.

Se você quiser um controle mais granular sobre o carregamento preguiçoso da imagem no WordPress, você pode seguir duas abordagens diferentes, dependendo do contexto.

Se você estiver trabalhando no conteúdo (ou seja, the_content, the_excerpt, widget_text_content), você poderia usar o filtro wp_img_tag_add_load_attr. O exemplo seguinte mostra como desativar o carregamento preguiçoso em uma imagem específica:

add_filter(
	'wp_img_tag_add_loading_attr',
	function( $value, $image, $context ){
		if ( 'the_content' === $context ){
			$image_url = wp_get_attachment_image_url( 67, 'medium' );
			if ( false !== strpos( $image, ' src="' . $image_url . '"' ) ) {
				return false;
			}
		}
		return $value;
	},
	10,
	3
);

Os desenvolvedores de temas também podem controlar imagens através do wp_get_attachment_image. Neste cenário, você pode simplesmente definir o valor do atributo de loading da imagem como false:

echo wp_get_attachment_image(
	67,
	'medium',
	false,
	array( 'loading' => false ),
);
A primeira imagem na galeria acima não é preguiçosa
A primeira imagem na galeria acima não é preguiçosa

Você encontrará mais informações sobre o carregamento de imagens preguiçosas no WordPress 5.5 no blog Make WordPress Core.

Atualizações Automáticas para Plugins e Temas

Uma das maiores preocupações dos proprietários de sites é a segurança do site e manter seu software atualizado é uma recomendação comum que todo proprietário de site deve levar em conta.

As atualizações automáticas do WordPress estão disponíveis como uma característica desde o WordPress 3.7. Agora, o problema aqui é que enquanto as atualizações automáticas são ativadas por padrão para manutenção e lançamentos de segurança, antes do WordPress 5.5, muitos proprietários de sites não aproveitavam as atualizações automáticas para plugins e temas.

O motivo é que esta característica exigia conhecimento básico do desenvolvimento do WordPress. De fato, os desenvolvedores poderiam afinar suas preferências de atualização definindo uma ou mais constantes no wp-config.php ou usando um filtro em um plugin.

Agora com o WordPress 5.5, os administradores do site podem ativar e desativar o plugin e a atualização automática do tema com um único clique diretamente no painel de controle do WordPress.

As atualizações automáticas de plugins podem ser ativadas e desativadas clicando no link que aparece na coluna Atualizações Automáticas agora disponível na tela de Plugins.

Possibilitando atualizações automáticas para plugins

Possibilitando atualizações automáticas para pluginsSe você quiser ativar atualizações automáticas para seu tema, navegue até Aparência > Temas, depois passe o mouse sobre seu tema e clique em Detalhes do Tema. Em seguida, clique no novo link Habilitar Atualizações Automáticas e pronto.

Possibilitando atualizações automáticas para um único tema
Possibilitando atualizações automáticas para um único tema

A nova IU de autoatualização para plugins e temas vem junto com várias funções e ganchos disponíveis para que os desenvolvedores possam personalizar a experiência de autoatualização.

Funções de autoatualização e filtros para desenvolvedores de plugins e temas

Uma nova função e vários filtros permitem que os desenvolvedores do WordPress personalizem muitos aspectos das atualizações automáticas de plugins e temas.

Verificar atualização automática do UI

A nova função wp_is_auto_update_enabled_for_type() WordPress verifica se a IU de atualização automática está habilitada para um determinado tipo. A nova função mantém um único argumento ($type) que determina o tipo de atualização a ser verificado ('theme' ou 'plugin') e retorna verdadeiro ou falso de acordo.

A nova IU de autoatualização pode ser desativada para plugins ou temas graças a dois novos filtros: plugins_auto_update_enabled e themes_auto_update_enabled. Veja o exemplo abaixo:

// Disable plugins auto-update UI elements.
add_filter( 'plugins_auto_update_enabled', '__return_false' );

// Disable themes auto-update UI elements.
add_filter( 'themes_auto_update_enabled', '__return_false' );

Os filtros acima estão documentados em wp-admin/includes/update.php.

Personalização de Links de Atualização Automática

Os desenvolvedores de plug-ins e temas podem personalizar a saída HTML dos links de atualização automática.

O filtro plugin_auto_update_setting_html permite a troca personalizada de links e lapsos de tempo entre duas tentativas de atualização.

A função de chamada de retorno mantém os argumentos das árvores:

  • $html: O HTML do conteúdo da coluna de atualização automática do plugin, incluindo a alternância de links de ação de atualização automática e tempo para a próxima atualização.
  • $plugin_file: Caminho para o arquivo de plugins em relação ao diretório de plugins.
  • $plugin_data: Um conjunto de dados de plugin.

Agora, se você quiser personalizar o rótulo do texto do link de atualização automática, você pode usar o filtro como mostrado no snippet a seguir.

add_filter( 'plugin_auto_update_setting_html', function( $html, $plugin_file, $plugin_data ){
	if ( 'kinsta-plugin/kinsta-plugin.php' === $plugin_file ) {
		$html = __( 'Custom HTML', 'kinsta-plugin' );
	}
	return $html;	
	}, 
	10, 
	3 
);

A imagem abaixo mostra o resultado na tela.

HTML personalizado para um link de atualização automática
HTML personalizado para um link de atualização automática

Este filtro é documentado em wp-admin/includes/class-wp-plugins-list-table.php.

Em sites únicos, você pode personalizar o modelo JS do link de atualização automática por meio do filtro de modelo de filtro de modelo de theme_auto_update_setting_template. O post do blog que introduz plugins e autoatualizações temáticas fornece o seguinte exemplo para este filtro:

function myplugin_auto_update_setting_template( $template ) {
    $text = __( 'Auto-updates are not available for this theme.', 'my-plugin' );
 
    return "<# if ( [ 'my-theme', 'twentytwenty' ].includes( data.id ) ) { #>
        <p>$text</p>
        <# } else { #>
        $template
        <# } #>";
}
add_filter( 'theme_auto_update_setting_template', 'myplugin_auto_update_setting_template' );

É recomendado verificar o tema alvo usando o parâmetro data.id.

Se você estiver trabalhando em uma instalação multisite do WordPress, então você precisa do filtro theme_auto_update_setting_html, que lhe permite personalizar os links Automatic Updates da tela Temas da mesma forma que a tela Plugins.

Finalmente, dois filtros adicionais controlam todas as atualizações automáticas para cada tema e plugin, incluindo temas e plugins que devem ser instalados no futuro.

Estes filtros, disponíveis desde o WordPress 3.7, substituem todas as configurações de atualização automática em seu painel do WordPress. Você pode ler mais sobre isso em nossas Atualizações Automáticas de Mergulho Profundo no WordPress. Para uma visão mais profunda das Atualizações Automáticas para plugins e temas, leia mais neste post do blog.

Notificações automáticas por e-mail e informações sobre saúde do site

Desde o WordPress 5.5, uma notificação por e-mail é enviada após qualquer tentativa de atualização automática.

O filtro auto_plugin_theme_update_email hook filtra os e-mails enviados após uma atualização automática de fundo. Veja o post do blog dev-notes para um exemplo de uso.

As notificações por e-mail de atualização automática também podem ser desativadas usando dois novos filtros:

// Disable auto-update email notifications for plugins.
add_filter( 'auto_plugin_update_send_email', '__return_false' );

// Disable auto-update email notifications for themes.
add_filter( 'auto_theme_update_send_email', '__return_false' );

As informações de atualização automática de plugins e temas também são exibidas na guia Informações de saúde do site.

A aba Informações de saúde do site mostra o status do plugin e da atualização automática do tema
A aba Informações de saúde do site mostra o status do plugin e da atualização automática do tema

Os desenvolvedores podem personalizar o texto que aparece nesta tela usando os filtros plugin_auto_update_debug_string e theme_auto_update_debug_string. Mais informações e vários exemplos estão disponíveis aqui.

Mapa do site principal extensível

Um mapa do site é simplesmente uma lista de URLs que permite aos mecanismos de busca rastrear rapidamente seu site.

Os sitesmaps são bastante similares aos robots.txt, com a diferença que um arquivo robots.txt exclui o conteúdo de ser indexado, enquanto um sitemap fornece uma lista de URLs a serem indexadas pelos mecanismos de busca.

Antes do WordPress 5.5, os sites só podiam ser adicionados a sites WordPress usando um plugin ou outras ferramentas.

Agora, o WordPress 5.5 traz um novíssimo recurso XML para o WordPress Core.

O novo recurso acrescenta funcionalidades básicas, mas vem com um bom número de ganchos e filtros que permitem aos desenvolvedores de plugins ampliar ainda mais as funcionalidades embutidas.

Os mapas de sites XML são ativados por padrão (a menos que você desencoraje os mecanismos de busca de indexar seu site) e fornecem os seguintes tipos de objetos:

  • Página inicial
  • Página de postagens
  • Principais tipos de correio (Páginas e Correios)
  • Tipos de correio personalizados
  • Taxonomias centrais (Tags e Categorias)
  • Taxonomias personalizadas
  • Arquivos dos autores

O índice do sitemap está disponível em /wp-sitemap.xml, que contém um máximo de 2.000 URLs. Quando o limite máximo é atingido, então um novo arquivo de mapa do site é adicionado.

Exemplo de mapa do site principal do WordPress
Exemplo de mapa do site principal do WordPress

Como mencionado anteriormente, os desenvolvedores de plugins podem personalizar seus mapas de site usando uma ou mais das muitas ações e filtros disponíveis. Para uma lista abrangente de sitesmaps relacionados, veja a documentação de plugins e o post introdutório no blog.

Como exemplo, você pode desativar programmaticamente os sitesmaps centrais usando o filtro wp_sitemaps_enabled:

add_filter( 'wp_sitemaps_enabled', '__return_false' );

Os mapas principais do site não devem entrar em conflito com nenhum plugin de mapa do site que você possa ter instalado em seu site. De acordo com Pascal Birchler em Make WordPress Core:

A característica principal do sitemaps foi construída de forma robusta e facilmente extensível. Se por alguma razão dois sitesmaps são expostos em um site (um por núcleo, um por plugin), isto não resulta em nenhuma conseqüência negativa para a capacidade de descoberta do site.

Como parte do recurso XML Sitemaps, uma nova função esc_xml() escapa das cadeias de caracteres para os blocos XML. A função e o filtro correspondente estão documentados em wp-includes/formatting.php.

No momento desta redação, o novo sitemap não suporta sitemaps de imagem/vídeo/notícias e provavelmente isto não irá mudar no futuro. De qualquer forma, novos filtros e ganchos que permitem aos desenvolvedores adicionar este recurso podem ser adicionados em versões futuras.

Para mais informações sobre sitesmaps extensíveis, veja a introdução do desenvolvedor aos sitesmaps que cobre novas classes, funções, ganchos e filtros.

Passagem de argumentos para arquivos Template

Antes do WordPress 5.5, só era possível passar dados para arquivos de modelos através de variáveis globais, variáveis de consulta e algumas outras opções não otimizadas. Agora, começando com o WordPress 5.5, um parâmetro $args foi adicionado às funções de carregamento de modelos (os ganchos correspondentes foram atualizados de acordo):

  • get_header()
  • get_footer()
  • get_sidebar()
  • get_template_part()
  • locate_template()
  • load_template()

Os desenvolvedores de temas podem agora definir uma variável em um arquivo modelo e torná-lo acessível em qualquer parte do modelo incluído, simplesmente passando uma série de argumentos.

Agora, enquanto esta característica abre novas e amplas oportunidades para desenvolvedores de temas, Justin Tadlock na WP Tavern coloca uma boa questão:

Uma pergunta permanece: a chegada deste recurso é tarde demais? Com o WordPress no caminho certo para reformular todo o sistema temático para se integrar com o próximo recurso de edição completa do site, este recurso será útil apenas nos próximos meses?

Um bom ponto vem de John Blackbourne:

Mesmo em um futuro com a edição completa do site, ainda há muita necessidade de peças modelo. Os tipos de blocos dinamicamente renderizados podem e fazem bom uso de peças de modelo estruturadas, por exemplo. Eles não são mutuamente exclusivos, e sempre haverá temas com opiniões que não fazem uso extensivo de blocos para layout.

Finalmente chegamos a Enrico Sorcinelli, WP Core Contributor, que compartilhou conosco seus pensamentos:

Se você me pergunta se chegamos tarde demais, do meu ponto de vista nunca é tarde demais! Acredito que no futuro os desenvolvedores do tema podem se beneficiar desta oportunidade, o que não exclui que ela possa ser usada em simbiose com a abordagem emergente de edição completa do site (por exemplo, para blocos com renderização dinâmica).

Talvez seja simplesmente muito cedo para dizer como exatamente este recurso se combinaria com a edição completa do site, mas uma coisa parece certa: o desenvolvimento futuro trará grandes oportunidades de construir melhores sites tanto para usuários quanto para desenvolvedores.

Atualização de Plugins e Temas a partir de um arquivo . zip

Eu sei o que você está pensando: pode parecer bastante “inesperado” ver este recurso aparecer em conjunto com as atualizações automáticas. No entanto, faz sentido.

Antes do WordPress 5.5, quando faltava um recurso de atualização com um clique, os administradores do site só podiam carregar atualizações de plugins/tema via FTP/SFTP ou gerenciador de arquivos (saiba a diferença entre FTP e SFTP). Isso era verdade principalmente com plugins/temas personalizados ou com extensões hospedadas em mercados de terceiros.

A partir do WordPress 5.5, você pode atualizar plugins e temas carregando um pacote . zip de seu computador dentro de seu painel do WordPress.

Se você quiser atualizar um plugin, navegue até Plugins > Adicionar nova tela e clique no botão Upload Plugin. Então, se você tiver o plugin instalado em seu site, uma nova tela permite saber que “Este plugin já está instalado” e mostra a versão atual e os detalhes da versão carregada.

Este plugin já está instalado
Este plugin já está instalado

O processo é bastante semelhante com atualizações de temas.

Navegue até a tela Appearance > Themes, depois clique em Add New, depois em Upload Theme. Se você já tem o tema instalado em seu site WordPress, uma nova tela lhe permite saber que “Este tema já está instalado” e mostra a versão atual e os detalhes da versão carregada.

Este tema já está instalado
Este tema já está instalado

Melhorias adicionais para desenvolvedores que vêm com o WordPress 5.5

Além do que já cobrimos até agora, alguns acréscimos merecem a atenção de um desenvolvedor.

Nova função wp_get_environment_type()

Uma nova função wp_get_environment_type() permite detectar o tipo de ambiente atual de um website, permitindo aos desenvolvedores adaptar as funcionalidades de plugin e tema ao ambiente atual.

Por padrão, wp_get_environment_type() retorna a production. Outros valores suportados são o developement e staging. De qualquer forma, os desenvolvedores podem definir tipos de ambiente adicionais, se necessário.

Há três métodos disponíveis para definir um tipo de ambiente de website. A partir de uma ordem de prioridade, você pode usar:

  • WP_ENVIRONMENT_TYPE Variável de ambiente PHP.
  • WP_ENVIRONMENT_TYPE constante.
  • wp_get_environment_type filtro.

Como exemplo, se você quiser configurar seu ambiente de teste , você pode definir a constante WP_ENVIRONMENT_TYPE em seu arquivo wp-config.php como mostrado abaixo:

define( 'WP_ENVIRONMENT_TYPE', 'staging' );

Se o tipo de ambiente for desenvolvimento, o WP_DEBUG será automaticamente definido como true mesmo que você não o tenha definido explicitamente.

Alterações do REST API no WordPress 5.5

O WordPress 5.5 também traz muitas mudanças para o REST API. Veremos vários novos pontos finais, novos parâmetros e mudanças no esquema JSON, novas funções e mais aperfeiçoamentos.

Aqui está uma rápida lista de novos pontos finais:

Tipos de blocos

Um novo ponto final permite obter todos os tipos de blocos registrados:

  • GET /wp/v2/block-types devolverá todos os tipos de blocos registrados.
  • GET /wp/v2/block-types/core devolverá todos os blocos dentro do namespace core.
  • GET /wp/v2/block-types/core/quote retornará a definição do bloco de quote block.

Plugins

Um novo ponto final permite gerenciar os plugins:

  • GET /wp/v2/plugins will return a list of all installed plugins.
  • GET /wp/v2/plugins/plugin-name/plugin-name will return information about the specified plugin.
  • POST /wp/v2/plugins { slug: "plugin-name" } installs the specified plugin from the Plugins Directory
  • PUT /wp/v2/plugins/plugin-name/plugin-name { status: "active" } activates the specified plugin
  • DELETE /wp/v2/plugins/plugin-name/plugin-name deletes an inactive plugin.

Diretório de blocos

Um novo ponto final permite a busca no diretório de blocos:

  • GET /wp/v2/block-directory/search?term=block-name pesquisa no diretório de blocos por block-name

Edição de imagens

Emparelhando com o novo recurso de edição de imagem em linha, um novo ponto final permite editar anexos de imagem na Biblioteca de Mídia:

POST /wp/v2/media/5/edit edita a imagem com ID 5

Veja as notas do WordPress Core dev dev para uma visão mais próxima de todas as mudanças na API REST que vem com o WordPress 5.5.

Resumo

Estamos entusiasmados com todas estas novas características e melhorias que o WordPress 5.5 traz em um único lançamento.

Ele mostra a enorme quantidade de trabalho acontecendo nos bastidores e nós apreciamos profundamente todos os esforços e compromissos de cada contribuinte central.

Se as mudanças listadas acima não forem suficientes para você, aqui estão outras melhorias adicionais que você deve verificar com o WordPress 5.5:

Não deixe de participar do nosso webinar gratuito totalmente dedicado ao WordPress 5.5!

Agora é a sua vez. Quais são as características e/ou melhorias que você mais gosta no WordPress 5.5? E quais características você gostaria que fossem adicionadas ao WordPress 5.6? Compartilhe suas idéias na seção de comentários abaixo!

Carlo Daniele Kinsta

Carlo is a passionate lover of webdesign and front-end development. He has been playing with WordPress for more than 20 years, also in collaboration with Italian and European universities and educational institutions. He has written hundreds of articles and guides about WordPress, published both on Italian and international websites, as well as on printed magazines. You can find him on LinkedIn.