Deseja saber como adicionar texto a uma imagem no WordPress?
A adição de texto sobre uma imagem é uma ótima maneira de mostrar mais informações sobre fotos ou gráficos. Você também pode usar uma caixa de texto sobre imagens para criar rapidamente cabeçalhos, banners e anúncios on-line.
Neste artigo, mostraremos a você como adicionar texto a uma imagem no WordPress de várias maneiras diferentes.
Por que adicionar texto sobre imagens no WordPress?
As imagens são uma maneira fantástica de tornar seu site WordPress mais atraente e envolvente. Elas também podem separar grandes porções de texto, facilitando a leitura dos visitantes.
Às vezes, os visitantes podem precisar de mais informações sobre o significado de uma imagem. Por exemplo, uma imagem de demonstração de um produto pode precisar de rótulos que expliquem os diferentes recursos. Nessas situações, adicionar texto à imagem dará mais contexto aos usuários.
Além disso, você pode adicionar texto sobre uma imagem para criar uma marca d'água e evitar o roubo de direitos autorais.
Na maioria dessas situações, você precisará de ferramentas de edição de fotos, como o Photoshop, para adicionar uma sobreposição de texto. Entretanto, os editores de fotos podem ser difíceis de usar se você não estiver familiarizado com o design gráfico.
Em vez disso, há várias maneiras de adicionar texto em imagens diretamente no WordPress de forma rápida e fácil.
Como adicionar texto a uma imagem no WordPress
A seguir, você encontrará três maneiras diferentes de adicionar texto sobre uma imagem no WordPress. Começaremos usando um poderoso plug-in do WordPress e, em seguida, explicaremos como criar sobreposições de texto com o editor de blocos do WordPress.
Vamos nos aprofundar no assunto.
Método 1. Adicionar texto em uma imagem usando o bloco de galeria do SeedProd
O plugin do WordPress com o qual começaremos é o SeedProd, o melhor construtor de sites para WordPress. Ele tem um editor visual de arrastar e soltar que permite criar temas para WordPress, páginas de destino e layouts flexíveis para seu site sem escrever código.
Você pode começar com um kit de site completo ou um modelo de página de destino e, em seguida, personalizar seu design visualmente com blocos do WordPress. Por exemplo, os blocos Gallery permitem que você ative uma sobreposição colorida e mostre os títulos, as descrições e as legendas das fotos ao passar o mouse.
O SeedProd também vem com os seguintes recursos avançados:
- Em breve e modo de manutenção
- Criador de temas do WordPress
- Páginas 404 e de login
- Painel de gerenciamento de assinantes
- Integrações de marketing por e-mail
- Incorporações de mídia social
- Controles de acesso do usuário
- Substituição dinâmica de texto
- Mapeamento de domínio
- E mais.
Siga o guia abaixo para saber como adicionar texto em uma imagem com o SeedProd.
Etapa 1. Instalar e ativar o SeedProd
Primeiro, clique no botão abaixo para criar sua conta SeedProd e fazer o download do arquivo do plug-in em seu computador.
Em seguida, no painel de controle de sua conta, clique na guia Downloads e copie sua chave de licença do SeedProd.
Em seguida, carregue o arquivo .zip do plug-in em seu site do WordPress. Se precisar de ajuda com essa etapa, siga estas instruções sobre como instalar e ativar um plug-in do WordPress.
Depois de ativar o SeedProd, acesse SeedProd " Settings na área de administração do WordPress e cole a chave de licença que você copiou anteriormente.
Agora, clique no botão Verify Key (Verificar chave ) e vá para a próxima etapa.
Etapa 2. Criar um novo layout do WordPress
Para esta etapa, você precisará decidir que tipo de layout do WordPress deseja criar com o SeedProd. Você pode criar um tema WordPress do zero usando um dos Kits de site completos ou escolher um modelo de página de destino para criar uma página de destino independente.
A opção Theme Builder é ideal se você quiser substituir completamente o tema existente do WordPress. No entanto, se você quiser apenas criar ou personalizar uma página e manter o tema atual, o Landing Page Builder é uma opção melhor.
Felizmente, temos muitos tutoriais para ambas as soluções. Siga este guia para criar um tema do WordPress ou estas etapas para criar uma página de destino no WordPress com o SeedProd.
Ambos os tutoriais o orientarão na escolha de um modelo predefinido e na configuração do layout básico. Para este guia, selecionaremos a opção Theme Builder.
Depois de escolher um modelo para seu design, você pode editá-lo e adicionar suas personalizações. Neste caso, estamos usando o tema Photography Portfolio e planejamos personalizar a página Portfolio.
Para editar a página do portfólio, acesse Pages " All Pages, localize a página desejada e clique no link Edit with SeedProd.
Etapa 3. Incorporar e personalizar o bloco Gallery
Ao abrir seu design, você verá um layout como o do exemplo abaixo:
À direita, há uma visualização ao vivo da sua página, na qual você pode clicar e editar em tempo real. Em seguida, à esquerda, há blocos e seções do WordPress que você pode arrastar e soltar no seu design.
Você também pode remover elementos passando o mouse sobre eles e clicando no ícone da lixeira. Faremos isso com o bloco Gallery que veio com nosso modelo porque o substituiremos pelo Advanced Gallery.
O bloco Advanced Gallery do SeedProd vem com poderosas opções de personalização. Vamos usá-las para adicionar texto sobre as imagens do portfólio, portanto, localize o bloco Advanced Gallery e arraste-o para sua página.
Como você pode ver, as configurações do bloco serão abertas na barra lateral esquerda. Dentro desse painel, primeiro, escolha Single (Único) ou Multiple (Múltiplo) no menu suspenso "Type" (Tipo).
A opção "Multiple" permite que você adicione mais de uma galeria à sua página com um filtro no qual você pode clicar para ver cada galeria. Já a opção "Single" exibe apenas uma galeria sem os filtros.
Depois de escolher o tipo de galeria, você pode começar a adicionar suas fotos. Basta clicar no botão Add Gallery Images e selecionar as imagens do seu computador ou da biblioteca de mídia do WordPress.
Você pode adicionar qualquer foto, inclusive JPEG/JPG, PNG, GIF e outros tipos de arquivo.
Depois de carregar suas fotos, você pode abrir o menu Settings (Configurações ) e escolher o número de colunas, o espaçamento, a proporção, o tamanho da imagem e o link.
Por exemplo, clicar no tipo de link Media File garantirá que cada foto da galeria seja aberta em uma galeria pop-up lightbox.
Agora, clique no menu Overlay (Sobreposição ) e alterne a opção Background Overlay (Sobreposição de fundo ) para a posição "Yes" (Sim).
Abaixo, você pode escolher o texto a ser exibido ao passar o mouse sobre cada foto. Para ambas as opções, você pode mostrar o seguinte:
- Título
- Legenda
- Alt
- Descrição
Esta é a aparência com a legenda da imagem exibida ao passar o mouse:
Se as legendas forem difíceis de ler, você poderá ajustar a cor de fundo da sobreposição e editar a fonte, o alinhamento e o estilo do texto.
Além disso, a guia Advanced tem muitas outras opções de personalização, incluindo estilos de sombra, borda, espaçamento e visibilidade móvel.
Por exemplo, com o Device Visibility, você pode mostrar e ocultar elementos específicos em diferentes tamanhos de dispositivos, como tablets Android, iPhones, iPads da Apple, laptops Mac iOS e desktops da Microsoft.
Quando estiver satisfeito com seu design, lembre-se de salvar as alterações clicando no botão Save (Salvar ) no canto superior direito.
Etapa 4. Publicar suas alterações
Agora, tudo o que resta é fazer com que as personalizações do WordPress sejam ativadas em seu site. Se estiver criando uma página de destino, basta clicar em Publish (Publicar) no menu suspenso Save (Salvar).
No entanto, se estiver usando o Theme Builder do SeedProd, será necessário acessar SeedProd " Theme Builder e ativar a opção Habilitar tema do SeedProd.
Agora você pode visualizar sua página e ver as sobreposições de texto da imagem em ação.
Método 2. Adicionar texto a uma imagem usando as seções do SeedProd
Outra maneira de adicionar texto a uma imagem no WordPress é com as seções predefinidas do SeedProd. Ao editar qualquer modelo com o construtor de páginas do SeedProd, você verá uma guia Sections (Seções) no lado esquerdo da tela.
Clicar nessa guia mostrará várias seções para seu cabeçalho, rodapé, herói, chamada para ação, recursos e perguntas frequentes. São coleções de blocos do WordPress em um layout pronto que você pode adicionar à sua página com um clique.
Por exemplo, se você quiser mostrar uma imagem com um botão de call to action, poderá escolher uma seção da biblioteca Call to Action e clicar no ícone de adição para incorporá-la.
A seção aparecerá na parte inferior do seu design, onde você poderá personalizá-la para atender às suas necessidades.
Nesse caso, alteramos a imagem de fundo, adicionamos uma cor de sobreposição para escurecer o fundo e personalizamos o texto do cabeçalho e os botões de call-to-action.
Lembre-se de salvar e publicar suas alterações quando terminar. Em seguida, você poderá visualizar seu design ao vivo em seu site.
Método 3. Adicionar texto sobre uma imagem com o Cover Block do WordPress
O método a seguir mostrará como adicionar texto a uma imagem no WordPress sem um plug-in. Você pode usar o bloco de capa do WordPress para exibir qualquer imagem e digitar o texto sobre a imagem.
Esse método não oferece tantas opções de personalização quanto o anterior; no entanto, é uma maneira útil de adicionar texto a imagens se você não quiser adicionar outro plug-in do WordPress ao seu site.
Para adicionar o bloco Cover a um post ou página, clique no ícone de mais (+) no editor de blocos do WordPress. Em seguida, você pode digitar "Cover" e escolher o bloco Cover quando ele for exibido.
Em seguida, clique no botão "Upload" ou "Media Library" para escolher uma imagem para sua capa.
Depois de escolher uma imagem, você pode digitar diretamente na foto para adicionar um título ou uma descrição.
Você pode personalizar a imagem de fundo no painel direito, ativando um fundo fixo ou repetitivo. Você também pode alterar o foco da imagem arrastando o marcador na visualização.
Além disso, o painel Overlay Settings (Configurações de sobreposição ) permite que você escolha uma sobreposição de cor ou gradiente para sua imagem. No mesmo painel, você pode definir a opacidade, o preenchimento e as dimensões da sobreposição.
Clicar no texto sobreposto abrirá as ferramentas de texto, onde você poderá alterar a cor do texto e a cor do plano de fundo e brincar com os diferentes estilos de fonte.
Por exemplo, a alteração das letras maiúsculas e minúsculas, do espaçamento entre letras e do tamanho da fonte nos permitiu criar esse efeito de rótulo.
Quando estiver satisfeito com a aparência do Cover Block, você poderá publicar ou atualizar sua página. Ao visitar o site, você verá o texto na parte superior da imagem.
Aí está!
Esperamos que este artigo tenha ajudado você a aprender como adicionar texto a uma imagem no WordPress. Pronto para mergulhar de cabeça e experimentar o SeedProd por si mesmo?
Você também pode gostar dos seguintes tutoriais do WordPress:
- Como criar guias no WordPress para conteúdo com guias
- Como personalizar trechos de postagens no WordPress (sem código)
- Como criar animações de texto no WordPress (etapas fáceis)
Obrigado pela leitura! Gostaríamos muito de ouvir sua opinião, portanto, fique à vontade para deixar um comentário com perguntas e feedback.
Você também pode nos seguir no YouTube, no X (antigo Twitter) e no Facebook para obter mais conteúdo útil para expandir seus negócios.
