Como Adicionar Texto Sobre uma Imagem no WordPress (3 Métodos)

Quer adicionar texto às suas imagens do WordPress? Títulos e citações atraentes que você vê sobrepostos a fotos podem realmente fazer seu conteúdo se destacar. Isso é chamado de sobreposição de texto e é uma ótima maneira de tornar suas imagens mais envolventes.

Se você está se perguntando como criar essas sobreposições de texto, pode pensar que precisa de software ou habilidades de design especiais. Boas notícias – você não precisa!

Testamos todos os tipos de métodos e encontramos várias maneiras simples de adicionar texto a imagens diretamente no WordPress. Nenhuma experiência em design é necessária, e nenhum software extra para comprar.

Pronto para aprender como? Mostraremos três maneiras diretas de adicionar texto sobre uma imagem no WordPress. Ao final deste guia, você estará criando sobreposições de texto com aparência profissional para seu site com confiança.

Quando Adicionar Texto Sobre Imagens no WordPress

Imagens podem aumentar significativamente o apelo do seu site WordPress, tornando-o mais interessante visualmente e ajudando a quebrar longas seções de texto.

No entanto, há momentos em que uma imagem sozinha não conta toda a história. Nesses casos, adicionar sobreposições de texto pode fornecer contexto adicional, ajudando seu público a entender por que a imagem é relevante para o conteúdo.

Se você está gerenciando um blog WordPress ou uma loja online, as sobreposições de texto podem transformar imagens comuns em cabeçalhos ou banners que chamam a atenção.

Neste post, temos três maneiras fáceis para iniciantes de adicionar texto sobre uma imagem no WordPress. Se você preferir pular direto para um método específico, pode usar os links abaixo:

• Método 1: Adicionar Texto Sobre uma Imagem Usando o Bloco de Capa
• Método 2: Adicionar Texto Sobre uma Imagem Usando o Bloco de Imagem
• Method 3: Create a Custom Page Layout with Text on Top of an Image

Método 1: Adicionar Texto Sobre uma Imagem Usando o Bloco de Capa

Uma maneira de adicionar texto sobre uma imagem no WordPress é usando o bloco de Capa. Você pode usar este bloco para exibir qualquer imagem e, em seguida, digitar texto sobre a imagem. Isso torna o bloco de Capa perfeito para criar imagens de destaque (hero images), cabeçalhos e banners.

Para adicionar um bloco de Capa a uma página ou post, basta clicar no botão de adição ‘+ Adicionar Bloco’ no editor de blocos Gutenberg.

Agora você pode digitar ‘Capa’ e selecionar o bloco correto quando ele aparecer.

Aqui, você pode escolher o bloco de Capa padrão.

Mas você também pode optar pela opção de modelo com a imagem e o texto de espaço reservado. Com a segunda opção, você pode simplesmente substituir a imagem e o texto existentes pelos seus.

Para substituir a imagem padrão, basta clicar para selecionar a imagem. Assim que fizer isso, clique no botão ‘Substituir’.

Se você quiser usar uma imagem que já está na sua biblioteca de mídia do WordPress, basta clicar em ‘Abrir Biblioteca de Mídia’. Você pode então escolher uma imagem existente.

Se você quiser fazer upload de uma nova imagem, clique em ‘Upload’ em vez disso.

Isso abre uma janela onde você pode escolher qualquer arquivo do seu computador.

Após escolher uma imagem, você pode usar as configurações do bloco para criar efeitos interessantes e chamativos.

Por exemplo, você pode fazer a imagem ficar fixa no lugar enquanto o visitante rola a página ou adicionar uma sobreposição de cor à imagem.

Se você usar uma sobreposição, poderá alterar sua opacidade usando o controle deslizante ‘Opacidade’. A configuração de opacidade controla a transparência da imagem de fundo.

Quando estiver satisfeito com a aparência da imagem, você estará pronto para adicionar texto.

Por padrão, o bloco Capa tem um bloco de Título e um bloco de Parágrafo onde você pode adicionar texto sobre a imagem.

Para adicionar texto, basta clicar para selecionar o bloco Título ou Parágrafo. Em seguida, digite o texto que deseja usar.

Ao adicionar texto sobre imagens, certifique-se de que seu texto seja legível para todos os visitantes. Um bom contraste entre o texto e o fundo ajuda todos a lerem seu conteúdo com mais facilidade. Para saber mais, consulte nosso guia sobre como melhorar a acessibilidade em seu site WordPress.

Dito isso, você pode querer estilizar seu texto para que ele seja mais fácil de ler.

Se você estiver trabalhando com um bloco de Título, também poderá experimentar os diferentes estilos de título para ver qual é o mais fácil de ler.

Você também pode ajudar seu texto a se destacar usando uma cor contrastante.

Para escolher uma cor diferente, selecione a aba 'Bloco' no menu do lado direito. Em seguida, clique em 'Cor' para expandir esta seção.

Depois de fazer isso, clique em 'Texto'. Isso abre um pop-up onde você pode escolher uma nova cor para todo o texto no bloco.

Normalmente, texto maior é mais fácil de ler.

Para aumentar o tamanho do seu texto, clique no campo ao lado de 'Tamanho' e digite um número maior neste campo.

Assim que estiver satisfeito com a aparência do seu bloco de Capa, você pode publicar ou atualizar sua página normalmente. Agora, se você visitar seu site WordPress, verá seu texto sobre a imagem.

Método 2: Adicionar Texto Sobre uma Imagem Usando o Bloco de Imagem

O bloco de Capa é ótimo para criar banners e cabeçalhos. No entanto, você também pode adicionar texto sobre um bloco de Imagem padrão do WordPress.

Para começar, você precisará adicionar um bloco de Imagem à sua página ou postagem. Para fazer isso, basta clicar no botão 'Adicionar Bloco' (+) no editor de blocos do WordPress.

Em seguida, você pode digitar 'Imagem' e selecionar o bloco correto para adicioná-lo à sua postagem.

Você pode então fazer upload de uma imagem do seu computador ou clicar em ‘Biblioteca de Mídia’ para escolher uma imagem da biblioteca de mídia do WordPress.

Após escolher sua imagem, você pode alterar seu ponto focal, adicionar uma sobreposição e alterar a opacidade seguindo o mesmo processo descrito acima.

Você também pode experimentar os diferentes controles deslizantes ‘Fundo fixo’ e ‘Fundo repetido’ para ver o que funciona melhor para o seu bloco de Imagem.

Quando estiver satisfeito com a aparência da sua imagem, basta clicar no botão ‘Adicionar texto sobre a imagem’.

Isso adiciona uma área onde você pode digitar seu texto.

Dependendo da sua imagem, os visitantes podem ter dificuldade em ler o texto da sobreposição. Aqui, pode ajudar tornar o texto em negrito ou alterar sua cor seguindo o mesmo processo descrito acima.

Você também pode aumentar o tamanho do seu texto.

Para fazer isso, encontre a seção ‘Tamanho’ no menu do lado direito. Você pode então prosseguir e clicar nos diferentes números para tornar seu texto maior ou menor.

Quando estiver satisfeito com a aparência do seu texto e imagem, prossiga e visualize seu site. Em seguida, clique em ‘Salvar rascunho’, ‘Atualizar’ ou ‘Publicar’ para salvar suas alterações.

Se você usar um tema de bloco do WordPress, poderá usar os Métodos 1 e 2 para adicionar texto sobre uma imagem em qualquer parte do seu tema usando o Editor de Site Completo do WordPress (FSE).

Você pode aprender mais sobre FSE em nosso guia completo para iniciantes sobre Edição de Site Completo do WordPress.

Método 3: Criar um Layout de Página Personalizado com Texto Sobre uma Imagem

Os blocos nativos do WordPress são uma maneira rápida e fácil de adicionar texto sobre uma imagem no WordPress. No entanto, se você quiser a liberdade de criar designs de página completamente personalizados, precisará de um plugin de construtor de páginas.

SeedProd é o melhor plugin de construtor de páginas do WordPress do mercado. Ele permite que você adicione texto sobre qualquer imagem em todo o seu site.

Você pode ler nossa análise completa do SeedProd para mais detalhes.

Primeiro, você precisa instalar e ativar o plugin SeedProd. Para mais detalhes, veja nosso guia passo a passo sobre como instalar um plugin WordPress.

Após a ativação, você precisará inserir sua chave de licença do SeedProd. Você pode obter essa chave fazendo login na sua conta do SeedProd. Em seguida, clique na aba 'Downloads'.

Depois de fazer isso, você pode copiar a chave na seção ‘Chave de licença’.

Agora você pode colar esta chave na sua área de administração do WordPress acessando a página SeedProd » Configurações.

Uma vez aqui, prossiga e cole sua chave no campo ‘Chave de licença’.

Em seguida, você só precisa clicar em ‘Verificar Chave’.

Depois disso, vamos acessar SeedProd » Páginas de Destino e clicar em ‘Adicionar Nova Página de Destino’.

Esta primeira etapa é necessária antes que você possa adicionar texto sobre suas imagens.

Sua próxima tarefa é escolher um modelo, que será o ponto de partida da sua página.

Não importa qual modelo SeedProd você escolher, você pode personalizar todas as partes do modelo para se adequar perfeitamente ao seu site e marca. Se preferir começar com uma tela em branco, clique em ‘Modelo em Branco’.

Em todas as nossas imagens, estamos usando o modelo Tasty Squeeze Page, que é perfeito para campanhas de obtenção de mais assinantes.

Depois de encontrar um modelo que você possa querer usar, passe o mouse sobre ele. Você pode então clicar no ícone ‘Visualizar’.

Isso mostrará uma prévia do modelo.

Se você estiver satisfeito com a aparência deste modelo, prossiga e clique no botão ‘Escolher Este Modelo’.

No campo ‘Nome da Página’, digite um nome para a página.

Por padrão, o SeedProd usará este nome como o URL da página. Se você quiser alterar este URL criado automaticamente, basta editar o texto no campo ‘URL da Página’.

Quando estiver satisfeito com as informações que inseriu, clique no botão ‘Salvar e Começar a Editar a Página’. Isso abrirá o modelo no editor de arrastar e soltar do SeedProd.

Na barra lateral esquerda, você verá todos os blocos e seções que pode arrastar e soltar em sua página.

A menos que você esteja usando o Modelo em Branco, sua página SeedProd já terá alguns blocos e seções. Para editar qualquer um desses conteúdos, basta clicar para selecionar o bloco ou seção.

O menu lateral do SeedProd agora mostrará todas as configurações que você pode usar para personalizar este bloco ou seção. Como você pode ver na imagem a seguir, você pode alterar o texto que aparece no bloco de Título.

A maneira mais fácil de adicionar texto sobre uma imagem é usando uma das seções de Herói prontas do SeedProd.

Essas seções têm uma imagem de fundo de largura total como espaço reservado, com algum texto de espaço reservado adicionado por cima. Você pode simplesmente substituir a imagem de fundo e o texto padrão pelo seu próprio conteúdo.

Para começar, clique na aba ‘Seções’ no menu lateral do SeedProd.

Você pode então clicar em ‘Herói’ para ver todas as seções de herói prontas que você pode adicionar à sua página.

Para visualizar qualquer um desses modelos de seção, basta passar o mouse sobre o modelo e clicar no ícone de lupa.

Para prosseguir e adicionar esta seção de herói ao seu design, basta clicar em ‘Escolher Esta Seção.’

Em seguida, você vai querer substituir a imagem padrão do modelo pela sua própria imagem. Para fazer isso, basta clicar na imagem padrão para selecioná-la.

Em seguida, no menu lateral do SeedProd, passe o mouse sobre a prévia da ‘Imagem de Fundo’ até que um ícone de lixeira apareça.

Você pode então prosseguir e clicar neste ícone para excluir a imagem de espaço reservado.

Em seguida, clique em ‘Usar Sua Própria Imagem.’ Você pode então escolher uma imagem da biblioteca de mídia do WordPress ou usar uma imagem de estoque.

O SeedProd oferece acesso fácil a milhares de imagens de estoque isentas de royalties. Para dar uma olhada na biblioteca de imagens de estoque do SeedProd, clique em ‘Usar uma Imagem de Estoque.’

Na barra de pesquisa, digite uma palavra ou frase que descreva a imagem que você está procurando e clique no botão ‘Pesquisar.’

O SeedProd agora mostrará todas as imagens de estoque que correspondem ao seu termo de pesquisa.

Quando encontrar uma imagem que deseja adicionar ao seu design, basta clicar nela.

Depois de adicionar uma imagem, você está pronto para substituir o texto do espaço reservado.

Para fazer isso, clique para selecionar o bloco de Texto. Em seguida, na área 'Texto', simplesmente digite o texto que você deseja usar.

Alguns dos modelos de herói do SeedProd têm conteúdo extra, como botões de call-to-action.

Quer alterar este conteúdo? Então, simplesmente clique para selecionar o bloco e faça suas alterações no menu esquerdo do SeedProd.

Outra opção é excluir o bloco do modelo de herói.

Para fazer isso, simplesmente clique para selecionar o bloco e, em seguida, clique no ícone da lixeira.

Quando estiver satisfeito com o design da sua página, você pode clicar no botão 'Salvar'.

A partir daqui, você pode escolher publicar a página ou salvá-la como um modelo.

Para mais detalhes sobre como criar layouts de página personalizados com o SeedProd, você pode ver nosso guia sobre como criar uma landing page no WordPress.

Dicas Bônus para Gerenciar Imagens e Arquivos no WordPress

Adicionar texto a imagens é apenas uma maneira de deixar seu site mais bonito. Quer fazer mais com suas fotos? Confira estes guias fáceis:

• Como Carregar Imagens Lentamente (Lazy Load) Facilmente no WordPress
• Como Adicionar Múltiplas Galerias em Posts e Páginas do WordPress
• Como Adicionar Corretamente um Slider de Conteúdo em Destaque no WordPress
• Como Adicionar uma Borda ao Redor de uma Imagem no WordPress
• Como Cortar e Editar Miniaturas de Posts do WordPress
• Como Adicionar Facilmente Imagens Interativas de 360 Graus no WordPress

Esperamos que este artigo tenha ajudado você a aprender como adicionar texto sobre uma imagem no WordPress. Você também pode querer ver nosso guia sobre como editar imagens em destaque em massa e nossas melhores escolhas para os melhores plugins de slider para WordPress.

Se você gostou deste artigo, por favor, inscreva-se em nosso Canal do YouTube para tutoriais em vídeo do WordPress. Você também pode nos encontrar no Twitter e no Facebook.