Novidades WordPress 5.4 e Gutenberg: Ícones sociais, botões, ecrã Inteiro & mais

8 Min.
WordPress  5.4
Última atualização em

O WordPress 5.4 O lançamento foi publicado em 31 de Março de 2020. Quais são os benefícios do lançamento para usuários e desenvolvedores? Nossa visão geral: Esta é uma novidade em WordPress e Gutenberg.

WordPress organiza cada vez mais o seu editor Gutenberge proporciona-lhe novas funções. Antes de passar aos próximos passos de desenvolvimento - ou seja, no sentido da colaboração e Multilinguismo. Algumas características novas podem causar confusão para os usuários, você deve estar preparado para isso. Nós resumimos todas as mudanças importantes para você.

Widget: Estado do site

A inovação da WordPress 5.4, o que é perceptível à primeira vista: no painel de instrumentos há agora um novo widget para o "estado do site". A função por trás dela já está disponível desde WordPress 5.2. Você pode encontrá-los no backend em "Ferramentas". Com a nova colocação central, muitos usuários provavelmente se darão conta disso pela primeira vez:

Estado do site
O novo widget

A idéia por trás do recurso: Os administradores, mas também os usuários de WordPress devem ser conscientizados de possíveis pontos fracos na instalação. Da mesma forma, um olhar para os detalhes ligados no widget oferece sugestões de melhoria ou dicas sobre possíveis falhas de segurança. Estes são, por exemplo:

  • Uma lista dos inactivos Pluginse Themes. Você deve sempre removê-los, porque mesmo em estado desativado eles ainda são um alvo dos piratas informáticos pode ser.
  • Sugestões para módulos PHP que devem ser instalados no seu servidor. Caso contrário, pode funcionar WordPress lentamente ou algumas funções podem faltar. Ver essa lista de WordPress Hosting-Equipas.
  • Um aviso se o seu site ainda não utilizar a ligação HTTPS.

Especialmente a encriptação via SSL é uma necessidade absoluta para cada presença profissional na web. Por exemplo, através de Vamos Encriptar. O Google também requer uma conexão segura, caso contrário o seu site perderá classificações e visitantes. O ideal é que os certificados SSL estejam incluídos no seu pacote de hospedagem - o diminui as suas despesas.

Até agora, a funcionalidade da secção de estado ou melhorias do website ainda é controlável. Isto irá certamente mudar com as versões futuras. No entanto, o separador "Relatório" contém informações interessantes:

WordPress  Configuração
A configuração de WordPress

Isto dar-lhe-á muitos detalhes sobre a sua configuração de WordPress e WooCommerce. Você pode exportá-los, por exemplo, como uma ajuda para o seu WordPress -service provider. Ou para a resolução de problemas para desenvolvedores de Pluginse Themes.

Gutenberg em modo ecrã inteiro

Não sabias que tinha Gutenbergum modo ecrã inteiro? Então você ficará irritado quando chamar o editor pela primeira vez na versão 5.4. Porque ali falta a barra do tablier do lado esquerdo. Isto tem vantagens, mas também desvantagens:

  • Especialmente em telas menores você agora tem mais espaço para o seu conteúdo
  • Você não será distraído por comentários recebidos, atualizaçõesPlugins, etc. enquanto escreve
  • Ao mesmo tempo, a barra lateral está ausente em alguns processos

O último ponto abranda especialmente se for necessário alternar entre a síntese de postagem e o editor ao atualizar seus textos. Ou se você quiser chamar a biblioteca de mídia por um momento.

Gutenberg Ecrã completo
Gutenberg em modo ecrã inteiro

O modo tela cheia é contraproducente para o seu trabalho? Então você pode restaurar a velha visão familiar da seguinte forma:

  1. Ir para as opções avançadas de (os Gutenbergtrês pontos verticais ao lado do símbolo da engrenagem no canto superior direito)
  2. Estes são chamados de "Mais ferramentas e opções" no editor até agora
  3. Remova a marca de verificação em "Modo Ecrã Inteiro" aí

O comportamento - modo fullscreen ligado ou desligado - pode ser alterado com algumas linhas de JavaScript, mesmo professar:

const isFullscreenMode = wp.data.select( 'core/edit-post' ).isFeatureActive( 'fullscreenMode' );

if ( isFullscreenMode ) {
    wp.data.dispatch( 'core/edit-post' ).toggleFeature( 'fullscreenMode' );
}

Isto é especialmente útil se você como administrador ou desenvolvedor for ultrapassado por solicitações de seus usuários assim que a WordPress 5.4 entrar em funcionamento em seu site.

Gutenberg Ícones sociais do bloco

Com esta função, você pode adicionar links ou ícones às suas aparências em redes sociais com um clique do mouse. As opções básicas do Ícone Social:

  • Você mesmo pode determinar o tipo, número e ordem dos ícones, assim como os links
  • Há quase 40 ícones ou redes disponíveis
  • Além WordPress disso, Twitter, Facebook, YouTube ou Instagram são por exemplo Dropbox, Etsy, RSS, Flickr, GitHub, LinkedInPinterest, Skype, Vimeo ou Spotify.
  • Links para outros sites (por exemplo, autores convidados) ou para endereços de e-mail também podem ser inseridos

Um pouco confuso: Se você quiser remover um ícone anterior, você pode fazê-lo clicando no ícone e depois selecionando a opção "Remover bloco". Isto não irá apagar o bloco inteiro, mas apenas a respectiva entrada:

Botão Apagar Social Gutenberg
Excluir Botões Sociais em Gutenberg

O seu bloco criado não é um elemento reutilizável por defeito. Isto significa que se você fizer alterações - como adicionar ou remover ícones sociais individuais - você teria que fazer isso novamente quando mais tarde você incluir "ícone social" em outro bloco ou post. A solução: Você converte seu resultado em um bloco reutilizável e depois usa apenas esse bloco.

Dica: Muitos usuários ainda não estão familiarizados com a função "blocos reutilizáveis". É extremamente prático: quando o Google+ desapareceu, por exemplo, você só teve que ajustar a mudança no elemento reutilizável. Isto é então feito automaticamente nos blocos correspondentes dos postos individuais.

Gutenberg Botões de Bloqueio

O nome diz tudo: Este novo WordPress bloco permite que você inclua botões baseados em texto nos seus posts. Por exemplo, para baixar e-books ou para encaminhá-los para a central páginas de destino. Os botões podem ser personalizados da seguinte forma:

  • Estilos diferentes (completamente preenchidos com cor ou apenas com contorno)
  • Cor de fundo e de texto livremente selecionável, também com cores individuais (via valores de cores hexadecimais)
  • Fundo monocromático ou com gradiente (os tempos selvagens do web design são de saudação)
  • Configurações de borda (raio do canto)
  • Opções de ligação como alvo _blank

Usuários atentos de Gutenbergsaber que já existe um bloco chamado "Botão". No entanto, a nova opção "Botões" oferece muito mais opções:

Gutenberg Botões
Gutenberg Botões com gradiente e curvas

Além disso, agora é possível inserir vários botões, um após o outro, sem que isso destrua o seu layout. Você pode alterar a ordem dos botões por arrastar e soltar.

Nota: Originalmente, WordPress 5.4 tinha como objectivo fornecer novo bloco de navegação para inserir um menu de navegação também no conteúdo de uma página ou post. No entanto, este ajuste foi alterado para numa fase posterior Adiado.

Tela: Bem-vindo ao Editor de Blocos

Semelhante ao "Guia de Boas-vindas", os utilizadores WooCommercesão agora também recebidos por Gutenbergum "Guia de Boas-vindas". Isto contém:

  • Uma introdução a como funciona a abordagem baseada em blocos
  • Explicação básica das opções por bloco (por exemplo, cor, largura, alinhamento)
  • Notas sobre a biblioteca do bloco

Uma referência no final leva a instruções para Gutenberg. No entanto, isto está em língua inglesa.

Gutenberg ecrã de boas-vindas
O Guia de Boas-vindas de Gutenberg

Recomendamos as seguintes fontes, caso ainda não tenha trabalhado com o novo editorWordPress :

Para os administradores o guia não é novidade, mas para usuários e editores puros ele pode ser interessante. Eles devem encontrar o seu caminho Gutenbergmais rápido com isso. Isto também pode reduzir os seus esforços de apoio como administrador.

Dica: O Guia de Boas-vindas só começará automaticamente quando você o WordPress instalar ou usar pela Gutenbergprimeira vez. Queres começar manualmente? Você pode fazer isso nas opções gerais em Ferramentas -> Guia de boas-vindas (no ponto em que você pode alternar entre código e editor visual).

Inserir imagem de contribuição por arrastar e soltar

Às vezes são as pequenas mudanças que fazem os usuários de WordPress felizes. Com a versão 5.4 você pode carregar a imagem do post arrastando e soltando. Um exemplo:

  1. Você já processou ou enviou a imagem, e ela está em uma pasta no seu computador
  2. A partir daí, arraste-o com o rato para a área "Definir imagem post" na barra lateral direita da versão WordPress 5.4 e superior do Gutenberg
  3. Feito - o upload para a biblioteca de mídia acontece automaticamente em segundo plano.

Apenas os meta dados da imagem devem ser introduzidos posteriormente, se necessário, clicando na imagem inserida. Ou dentro da mediateca de WordPress . Este pode ser o maior "perigo" da nova opção conveniente: vem à custa de atributos que podem ser importantes para o seu SEO.

Bloco otimizado Contribuições recentes

Mostrar mais artigos sob seus posts no blog é uma característica que muitos leitores gostam de usar. É semelhante com os últimos posts (atualmente chamados de "Últimos Gutenbergposts"). Desta forma, os seus utilizadores ficam mais tempo no seu site. Os valores "duração da estadia" e "page views per visit" aumentam - ambos são valores chave importantes para Optimização para motores de busca (SEO).

A taxa de cliques desta função aumenta significativamente se você usar não apenas links de texto, mas também as respectivas imagens de postagem são exibidas. Isto é exactamente o que é possível a partir de WordPress 5.4:

Últimos posts WordPress
Últimas contribuições com foto de contribuição

Outras inovações no bloco "Postos Recentes":

  • Defina o tamanho da imagem para a miniatura
  • Você pode definir valores fixos em pixels, ou usar diferentes tamanhos percentuais
  • O alinhamento da imagem também pode ser ajustado (alinhado à esquerda, centrado, alinhado à direita)

A pré-visualização deve mostrar o artigo completo ou apenas um excerto de texto? Alguns blogs relatam que esta opção também foi adicionada. No entanto, ele já está disponível em 5WordPress .3, em "Post content settings" .

Cor do texto para palavras e sentenças individuais

Até agora, a cor do texto no Gutenberg só podia ser alterada para um parágrafo ou secção completos. Com WordPress 5.4 há agora uma opção para mudar a cor de letras, palavras ou frases:

Cor do texto em Gutenberg
Agora também pode ficar colorido em partes dos seus textos

Para isso, marque a parte correspondente no texto contínuo com o mouse. Nas opções avançadas (ao lado do símbolo do link) você encontrará agora a entrada "Cor do texto". Aí você pode escolher entre cores predefinidas ou definir uma cor individual. Para isso, você pode usar uma tabela de cores RGB e valores de cores hexadecimais.

Outras alterações para os utilizadores

WordPress 5.4 traz para debaixo do capô numerosos ajustes menores, para o próprio sistema ou também para o editor Gutenberg. Aqui está uma visão geral dos pontos mais importantes:

  • Para blocos individuais existem agora blocos ampliados Opções de cor e gradientepara o bloco de capa (imagem ou vídeo com texto sobreposto) mas também para grupos e colunas
  • A navegação no pão ralado de blocos aninhados está mais claramente disposta
  • Na visão do smartphone permanece a barra de ferramentas no topopor isso ela já não está desfocada.
  • No bloco "Galeria" você pode influenciar o tamanho da imagem (quatro níveis: imagem de pré-visualização, médio, grande, tamanho completo)
  • Existe agora uma assinatura ("legenda") para tabelas, para imagens o atributo título pode ser atribuído directamente no editor (sob as opções avançadas)
  • Os vídeos do portal TikTok estão disponíveis no editor de blocos como uma nova fonte de incorporação

Além disso, a usabilidade de foi Gutenbergotimizada em alguns lugares, por exemplo, facilitando a seleção de vários blocos ou a navegação com a tecla de tabulação. Este último agora também funciona dentro das barras laterais dos blocos.

Tabela de legendas WordPress
Uma tabela com assinatura (legenda)

Dica: Se você está procurando informações sobre o futuro roadmap deWordPress o blog do WordPress projecto de língua alemã. Ou a página https://de.wordpress.org/sobre/roteiro/.

Mudanças para os desenvolvedores

Há também novas oportunidades para todos os que trabalham nos WordPress bastidores. Mas também mais desempenho:

  • Maior velocidade: A equipe de desenvolvimento em torno do editor de blocos, de acordo com suas próprias declarações, desenvolveu um Redução do tempo de carregamento de 14 por cento alcançado
  • Widget calendário: Os links de navegação são movidos para um elemento HTML de navegação que segue imediatamente o elemento tabela, para HTML válido (de acordo com a especificação 5.1)
  • Semântica Uniforme: A função do_shortcode() é representado por apply_shortcode() substituído
  • Favicons: Os pedidos para o favicon podem ser geridos de forma mais flexível, o WordPress logotipo serve como uma solução de recurso
  • Registo de erros: Erro em wp_login_failed são mais pormenorizadas

Você pode ler mais sobre isso - assim como outros ajustes - no anúncios oficiais para WordPress 5.4 leia mais. Notas sobre os testes WordPress 5.4 você vai encontrar aqui.

Que perguntas sobre WordPress 5.4 você tem? Você pode usar a função de comentário. Você quer saber sobre novos posts para WordPress ser informado? Então siga-nos. TwitterFacebook ou sobre o nosso Newsletter.

Artigos relacionados

Comentários sobre este artigo

Escreva um comentário

O seu endereço de e-mail não será publicado. Os campos obrigatórios estão marcados com * marcado.