Imagem de capa X Imagem em destaque no editor de blocos do WordPress (guia para iniciantes)

10/01/2025 | WordPress

Imagem De Capa

Com o editor de blocos do WordPress , você pode adicionar um bloco de Capa. Ele permite que você adicione imagens de capa às suas postagens e páginas. Esse recurso confundiu alguns usuários porque pode parecer semelhante à opção Imagem em Destaque.

Neste artigo, explicaremos as diferenças entre uma imagem de capa e uma imagem em destaque no editor de blocos do WordPress.

O que é uma imagem de capa?

Uma imagem de capa geralmente é uma imagem larga usada como foto de capa para uma nova seção em uma postagem ou página de blog. Ela faz parte do artigo geral. Você pode usar uma imagem de capa quando estiver iniciando uma nova seção ou uma nova história dentro do seu artigo.

Com o bloco Capa no site WordPress , você pode adicionar texto e sobreposição de cores na sua imagem de capa.

Imagem de capa no WordPress

Ao adicionar uma sobreposição de cor apropriada que combine com a cor do seu tema ou com o clima do conteúdo, você pode tornar seu artigo mais envolvente.

Da mesma forma, adicionar sobreposição de texto ajuda seus usuários a identificar facilmente onde uma nova seção começa no seu artigo e do que ela se trata.

Tradicionalmente, os blogueiros usam texto de título para separar seções em um post de blog. Com imagens de capa, agora você tem opções para separar seções de uma forma mais visualmente atraente.

O que é uma imagem em destaque?

Uma imagem em destaque (também conhecida como miniatura de post) é a imagem principal do artigo que representa o conteúdo. Elas são exibidas com destaque no seu site em posts únicos, páginas de arquivo de blog, bem como na homepage de sites de notícias, revistas e blogs.

Além disso, imagens em destaque também são exibidas em feeds de mídia social quando um artigo é compartilhado.

As imagens em destaque são projetadas cuidadosamente para torná-las atraentes. Essas imagens dão aos usuários uma rápida olhada no seu conteúdo e os levam a ler o artigo inteiro.

Você encontrará uma metacaixa na tela de edição de sua postagem para adicionar uma imagem em destaque, pois quase todos os temas do WordPress oferecem suporte a imagens em destaque por padrão.

Imagem em destaque no WordPress

Onde e como as imagens em destaque são exibidas é controlado inteiramente pelo seu tema WordPress.

Como adicionar uma imagem de capa no WordPress

O editor de blocos do WordPress (Gutenberg) vem com um bloco de capa para permitir que você adicione uma imagem de capa no WordPress.

Primeiro, você precisará criar uma nova postagem ou editar uma existente. Na tela de edição de postagem, basta clicar no botão ‘+’ para adicionar um novo bloco e então escolher o bloco Capa.

Adicionar bloco de capa no editor de blocos do WordPress

Você pode encontrar o bloco Capa dentro da aba Blocos Comuns.

Ao clicar no bloco, você verá o bloco Capa adicionado ao seu editor de conteúdo com opções para adicionar sua nova imagem de capa.

Carregar imagem para cobrir bloco

Você pode simplesmente arrastar e soltar uma imagem ou vídeo na área de bloco para carregar uma nova imagem de capa. Como alternativa, você pode clicar no botão Upload, escolher uma imagem no seu computador e abri-la para carregar.

Se você quiser adicionar uma imagem que já foi carregada na sua biblioteca de mídia, clique no botão Biblioteca de mídia e selecione uma imagem da sua galeria de mídia .

Carregar imagem de capa no editor de blocos do WordPress

Depois que sua imagem de capa for adicionada, você pode personalizá-la facilmente clicando nela.

Isso mostrará uma barra de ferramentas com opções de personalização acima da imagem, o campo Escrever título… no centro da imagem e as configurações de bloco no painel do lado direito.

Imagem de capa no WordPress

Em seguida, você pode adicionar um título para sua imagem de capa. Ao clicar na imagem de capa, você verá o campo ‘Escrever título…’ no centro de sua imagem de capa.

Basta clicar nessa área para adicionar texto. Você pode escrever o título da sua imagem de capa e formatá-la usando as opções de formatação que aparecem em cima do texto ou em cima da imagem de capa.

Adicionar texto à imagem da capa

Por fim, há configurações de bloco de cobertura no painel do lado direito.

Por exemplo, você pode habilitar as opções para manter um fundo fixo e um fundo repetido.

Editar configurações de mídia da imagem da capa

Abaixo disso, há opções de sobreposição de cores.

Por padrão, ele adiciona a cor do seu tema como uma cor de sobreposição com 50% de transparência. No entanto, você pode alterar a cor de sobreposição e também alterar a opacidade movendo o ponto.

Color overlay settings

Por fim, você pode adicionar código CSS e adicionar mais estilos à sua imagem de capa clicando na opção Avançado .

Pronto! Você pode repetir esta etapa para adicionar várias imagens de capa em um único artigo, se necessário.

Como adicionar uma imagem em destaque no WordPress

O processo de adicionar uma imagem em destaque é o mesmo de antes. Se você tem um blog WordPress há algum tempo, então já sabe como uma imagem em destaque é adicionada.

Para adicionar uma imagem em destaque, você precisará primeiro abrir uma tela de pós-edição e depois navegar até a caixa meta Imagem em destaque no lado direito da tela.

Você precisará clicar na opção Definir imagem em destaque .

Adicionar uma imagem em destaque

Em seguida, você pode carregar uma nova imagem usando o carregador de arrastar e soltar ou selecionando uma imagem da sua biblioteca de mídia existente.

Depois disso, você pode adicionar um título e um texto alternativo para sua imagem em destaque e clicar na opção Selecionar .

Carregar imagem em destaque no WordPress

Você adicionou com sucesso uma imagem em destaque ao seu artigo.

Depois de adicionar sua imagem em destaque, você pode visualizar sua postagem e ver como ela ficou.

Se você estiver usando um tema padrão ou outros temas modernos como o Astra, você também poderá ver uma sobreposição de cores nas imagens em destaque.

Você pode removê-lo ou alterar a cor acessando o personalizador do WordPress .

Basta ir para a página Aparência » Personalizar no seu menu do WordPress.

Opção de personalização do WordPress

Uma vez no painel Personalizar , você precisará clicar na opção Cores à esquerda.

É aqui que você pode alterar a cor das suas imagens em destaque.

Customize colors WordPress twenty nineteen theme

Nesta aba, você verá a opção de cor primária do seu tema e a opção de ativar ou desativar o filtro de imagem.

O tema usará a opção “Padrão”.

Color options in twenty nineteen theme

Você pode alterar a cor primária do seu tema selecionando a opção Personalizado .

Depois disso, basta escolher uma sobreposição de cor.

Change primary color in Twenty Nineteen theme

Se você quiser desabilitar o filtro de cor nas suas imagens em destaque, basta desmarcar a opção “Aplicar um filtro às imagens em destaque usando a cor primária”.

Observe que as imagens em destaque são gerenciadas pelos temas do WordPress, então você pode não encontrar essa opção no seu tema se ele não suportar filtros de imagem.

Disable color filter on featured images in Twenty Nineteen theme

Conclusão – Imagem de capa X Imagem em destaque no WordPress

Agora que você sabe como adicionar uma imagem de capa e uma imagem em destaque, vamos dar uma olhada em algumas práticas recomendadas.

Imagens em destaque têm sido usadas popularmente por blogs WordPress, revistas on-line, sites de notícias e entretenimento como miniaturas de postagens ou imagens de artigos principais.

Imagens em destaque bem projetadas ajudam a atrair mais usuários para abrir um artigo. Elas são ótimas para fazer seu site parecer atraente e visualmente interativo.

As imagens de capa são, na verdade, partes do seu artigo. Um usuário vê sua imagem de capa depois de abrir seu artigo para ler. Assim, elas tornam seus artigos mais envolventes e divertidos de ler.

O melhor uso de imagens de capa é adicionar belas transições entre seções dentro de um artigo longo.

As imagens de capa são diferentes das imagens de postagens comuns porque têm a opção de largura total e você pode adicionar sobreposição de texto a elas.

Ao adicionar corretamente as imagens de capa, você pode melhorar o envolvimento do usuário em suas postagens.

Desenvolvido por Daniel Peres

Profissional especialista em WordPress com 10 anos de experiência na área. Já atuei em diversas empresas na área de tecnologia e marketing a fim de consolidar negócios baseados em sites WordPress. Voluntário nos Meetups WordPress e Divi Rio de Janeiro.

Agora é a sua vez!

Compartilhe sua opinião e deixe seu comentário no post. Queremos ouvir o que você pensa!

0 comentários

Enviar um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *