Como Adicionar uma Imagem de Cabeçalho ou Logo em um Formulário no WordPress

Você quer aprender como adicionar uma imagem de cabeçalho ou logo em um formulário no WordPress?

Adicionar uma imagem é uma ótima maneira de personalizar seu formulário, dar aos usuários uma ideia do que se trata o formulário ou destacar um logo para o seu negócio.

Felizmente, é fácil fazer isso com o WPForms. O campo de conteúdo no WPForms simplifica o processo de upload de texto e mídia, como imagens ou logos, diretamente em seus formulários.

Neste post, vamos guiá-lo pelo processo de uso do campo de conteúdo para adicionar uma imagem de cabeçalho em um formulário no WordPress.

Adicione uma Imagem de Cabeçalho ao Seu Formulário Agora

Por que Devo Adicionar uma Imagem de Cabeçalho a um Formulário?

Personalizar seu formulário com uma imagem de cabeçalho personalizada é uma maneira fácil de complementar seu site WordPress com um design consistente e coeso. Como nosso construtor de formulários de arrastar e soltar torna a personalização de formulários uma brisa, você pode usar suas imagens em uma variedade de estilos.

Além disso, usar uma imagem dará aos usuários do seu site uma ideia clara do que esperar do seu site e formulário. As imagens também ajudam a trazer interesse visual aos seus formulários e a integrá-los ao esquema de cores e tema de design geral do seu site.

Sua imagem de cabeçalho pode refletir o assunto do conteúdo do seu formulário, ou pode ser uma imagem que representa seu negócio ou organização, como um logo.

Como Adicionar uma Imagem de Cabeçalho ou Logo em um Formulário no WordPress

Neste guia passo a passo, mostraremos como editar o cabeçalho em formulários do WordPress sem nenhum código. Este tutorial é perfeito para iniciantes e não requer o uso de CSS personalizado, um construtor de páginas ou o Personalizador do WordPress.

Apenas siga esta tabela de conteúdo para todas as etapas que mostraremos:

1. Instale o Plugin WPForms

Primeiro, você precisa instalar o Plugin WPForms. Confira todas as licenças do WPForms aqui, ou baixe o plugin do seu painel do WordPress.

Para usar a funcionalidade de upload do campo de Conteúdo para adicionar uma imagem de cabeçalho ao formulário, você precisará selecionar uma licença atualizada como Pro, Plus ou Elite.

Aqui está um tutorial útil sobre como instalar um plugin do WordPress.

2. Selecione o Modelo de Formulário de Contato Simples

Assim que o plugin estiver configurado no seu site, navegue até WPForms no seu painel do WordPress e clique em Adicionar Novo.

A partir daqui, você encontrará uma grande seleção de modelos para escolher para criar seu formulário.

Mas primeiro, vamos nomear o formulário. Para este tutorial, nomearemos nosso formulário como “Fale Conosco”, que será exibido no topo do formulário.

Agora, selecionaremos o Formulário de Contato Simples.

Isso nos levará a uma nova página, onde usaremos o construtor de formulários fácil de usar para personalizar este modelo.

3. Adicione o Campo de Conteúdo

Agora que estamos no construtor de formulários, adicionaremos o campo de conteúdo das seleções na aba Campos.

Simplesmente clique em Conteúdo e arraste e solte o campo onde você o deseja em seu formulário.

Estamos arrastando o campo de conteúdo para o topo da página para que a mídia carregada atue como uma seção de cabeçalho em nosso formulário.

Quando o campo de conteúdo estiver no lugar na área de visualização, clicaremos nele para acessar suas Opções de Campo e adicionar nossa mídia e editar o texto usando o editor fácil no painel esquerdo.

Você pode editar seu conteúdo visualmente ou usar o editor de Texto para editá-lo usando HTML.

Ótimo! Agora estamos prontos para carregar nossa imagem e inserir algum texto no formulário.

4. Faça o Upload do Logo/Imagem da Sua Empresa

Em seguida, clicaremos em Adicionar Mídia para carregar nossa imagem no campo de conteúdo.

Você poderá carregar uma nova imagem ou selecionar uma de sua Biblioteca de Mídia. Arquivos JPG e PNG são aceitos.

Com nosso logotipo personalizado no lugar, podemos então editar opções de personalização, como o tamanho da imagem, orientação e outros detalhes.

Para garantir que nossa imagem atue como um cabeçalho de formulário, fomos para a aba Avançado e definimos o Tamanho do Campo como Grande.

Em seguida, de volta à aba Geral, certificamos-nos de que a imagem esteja centralizada no campo usando as opções de formatação dentro do campo de texto.

Também temos a capacidade de editar o texto no campo. Editamos o texto aqui para ser uma mensagem curta para os visitantes e um prompt para preencher o formulário de contato.

Assim como a mídia acima, você pode formatar o texto livremente com o campo de Conteúdo. Clique em Expandir Editor abaixo da caixa de texto para ainda mais opções de edição.

Para nosso logotipo aqui, centralizamos o texto com o restante da imagem.

Você pode querer personalizar os outros campos do formulário também.

Por exemplo, aumentamos o tamanho do campo de nome para Grande, para corresponder à largura de nossa imagem de cabeçalho acima dele.

Existem muitas maneiras de personalizar os detalhes dos campos no formulário como achar melhor, e você pode visualizar suas alterações à medida que avança.

Certifique-se de clicar em Atualizar Visualização para ver os ajustes feitos no campo de Conteúdo.

Excelente! Agora estamos prontos para incorporar o formulário em qualquer página que quisermos!

5. Salve e Incorpore o Formulário

Pressione o botão Salvar no canto superior direito do formulário para ver as alterações refletidas na visualização da página.

Seja verificando a visualização da página ou não, você precisará clicar em Salvar antes de prosseguir.

Agora, clicaremos no botão Incorporar no topo para adicionar este formulário em uma nova página de nosso site WordPress.

Após clicar em Incorporar, escolheremos onde colocar o novo formulário.

Temos a opção de Selecionar Página Existente ou Criar Nova Página. Para este tutorial, estamos criando uma nova página, então clicaremos em Criar Nova Página.

Depois disso, somos solicitados a nomear a nova página.

Chamaremos a nossa de “Fale Conosco”, já que foi assim que nomeamos este formulário quando selecionamos o modelo.

Agora podemos ver o formulário em uma página recém-criada para o nosso site WordPress. A partir daqui, podemos visualizar a página, salvar a página como rascunho ou publicá-la.

Recomendamos que você configure as definições do bloco no lado direito do editor para ocultar o título do formulário, se ainda não o fez. Você não quer que ele distraia da imagem do cabeçalho do seu formulário.

Apenas certifique-se de que o controle deslizante Mostrar Título esteja na posição desativada.

Quando estiver pronto, clique em Publicar para tornar esta página ativa em seu site.

Fantástico! Você agora adicionou com sucesso um cabeçalho de formulário com uma imagem ou logotipo ao seu site WordPress.

Adicione uma Imagem de Cabeçalho ao Seu Formulário Agora

Em seguida, pare o spam de formulários de contato no WordPress.

Com um novo formulário atraente, personalizado com a imagem de cabeçalho de sua escolha, você convidará muitos visitantes do site a preencher seu formulário.

Mas você não quer coletar spam com seu novo formulário.

Para impedir que spammers preencham seus formulários, confira este artigo sobre como evitar envios de spam em seus formulários do WordPress.

Pronto para criar seu formulário? Comece hoje mesmo com o plugin de criação de formulários do WordPress mais fácil. O WPForms Pro inclui muitos modelos gratuitos e oferece uma garantia de devolução do dinheiro em 14 dias.

Se este artigo ajudou você, por favor, siga-nos no Facebook e Twitter para mais tutoriais e guias gratuitos do WordPress.