Como criar uma página inicial Elementor no WordPress

How to Customize Elementor Landing Page in WordPress

Quer criar uma landing page em seu site WordPress com Elementor?

Você acha que é difícil criar uma landing page alucinante que aumente a conversão? 

Bem, depois de ler este post você perceberá que construir uma landing page Elementor de alta conversão não é tão difícil quanto você pensa. Você pode construir facilmente uma landing page com modelos para qualquer ocasião ou campanha seguindo apenas 7 passos simples. 

Neste guia prático, vou orientá-lo através do processo mais fácil de criação de landing pages com Elementor. Você aprenderá como criar uma landing page no WordPress com modelos de landing page Elementor do zero.

 Parece que você estava procurando por isso? Vá em frente Então.

O que é uma página de destino?

Embora existam muitas controvérsias em relação à definição de landing page, a Wikipedia a descreve de forma bastante elaborada: 

No marketing online, uma página de destino, às vezes conhecida como “página de captura de leads“,“página de propriedade única“,“página estática“,“página do aperto”ou um“página de destino“, é uma única página da web que aparece em resposta ao clique em um resultado de pesquisa otimizado para mecanismo de pesquisa, promoção de marketing, e-mail de marketing ou anúncio online.

Wikipédia

Ao contrário da página inicial ou de qualquer outra página do seu site, uma página de destino é uma página independente. Ainda assim, geralmente gera mais conversões do que uma página de blog ou outras páginas do seu site. 

Resumindo, é uma página onde você leva as pessoas a chegarem. O objetivo de levar as pessoas a uma landing page varia de campanha para campanha.

Se você criar uma landing page WordPress para sua empresa, aqui estão algumas coisas que você pode querer que os visitantes façam em sua landing page: 

  1. Entre em contato com você por ligação
  2. Faça uma compra
  3. Inscreva-se em um evento
  4. Entre em contato com você via chat
  5. Assine boletins informativos
  6. Torne-se um lead preenchendo um formulário, etc. 

Com base no objetivo e na natureza da sua campanha, sua landing page pode ser uma landing page de clique ou uma landing page de geração de leads. 

Configuração inicial

Para fazer sua landing page Elementor, você precisará de: 

  1. WordPress instalado em seu site
  2. Elementor (versão gratuita) e
  3. Elements Kit Pro.

Lembre-se de que cabe a você ativar sua landing page ou armazená-la localmente em seu computador com ferramentas como Local by Flywheel.

Seções comuns de uma página de destino

Falando francamente, não existem regras rígidas e rápidas em relação às seções que uma landing page deve ter.

Quais seções você deve incluir em sua landing page dependem muito da ocasião e do propósito de criação de sua landing page WordPress. 

Por enquanto, deixe-me apenas mencionar alguns dos elementos comuns que uma landing page pode conter: 

1. Seção Herói— Como a seção herói se torna visível assim que os visitantes acessam a página, esta é a parte mais vital de uma landing page. Esta seção pode conter um título, subtítulo, texto e um botão CTA (call to action). 

2. menu de navegação- Menu de navegação A seção é imensamente útil para seus visitantes explorarem qualquer parte da página de destino. 

3. Sobre— Aproveite a seção sobre de sua página de destino para que eles saibam um pouco mais sobre seu negócio e serviço. 

4. Características— Liste as características do produto ou serviço que você oferece com imagens impressionantes e textos convincentes. 

5. Galeria— Esta é a seção onde você pode colocar toda a sua criatividade usando vários widgets. Você pode criar uma galeria de imagens, texto, vídeo, ícones sociais e qualquer coisa que funcione melhor. 

6. Seção de formulário— Se quiser que os visitantes entrem em contato com você, inclua um formulário de contato simples, mas eficaz. Você pode usar Construtor de formulários MetForm para incorporar qualquer tipo de formulário em sua landing page. 

7. Depoimento— Para conquistar a confiança de seus visitantes e dar-lhes uma ideia de como você pode servir de maneira incrível, adicionar um depoimento à sua landing page pode ser uma ótima ideia. 

8. Rodapé— Embora o rodapé não seja uma parte essencial, você pode adicione o rodapé parte da sua landing page para reforçar o apelo à ação ou incentivá-los a “agir agora”.

A propósito, você também pode colocar sua política de privacidade, termos de serviço e links para páginas de perguntas frequentes no final do rodapé. 

7 etapas para criar uma página inicial Elementor

Agora que você tem muitas informações sobre o que é uma landing page e os elementos comuns que uma landing page deve ter, é hora de colocar esse conhecimento em prática. Siga as etapas abaixo para criar uma landing page WordPress de alta conversão usando o plugin Elementor.

Etapa 1: configurar o layout, as fontes globais e as cores

Antes de começar a construir uma landing page com o modelo Elementor, certifique-se de configurar o editor visual corretamente. 

◉ Vá para Páginas >> Adicionar novo
◉ Clique em “Editar com Elementor”
◉ Vá para Configurações do Elementor no canto inferior esquerdo da página
Defina o layout da página como “Elementor Canvas” e publicar a página.

crie uma nova página para Elementor
Crie uma nova página para o Elementor

Quando se trata de escolher cores e fontes globais, você pode definir as cores primária, secundária, de texto e de destaque nas configurações do site.

As configurações globais serão aplicadas automaticamente quando você adicionar qualquer novo widget à área Elementor.

Etapa 2: construir a seção herói da página inicial do Elementor

dois caminhos para construir uma seção heróica de sua landing page com Elementor.

1. Crie a seção herói manualmente arrastando e soltando os widgets Elementor.
2. Escolha a seção de heróis pré-fabricados na lista de blocos disponíveis no Elementor.

Construa a seção do herói do zero

Se você é um especialista e procura o mais alto nível de personalização, pode construir manualmente a seção herói com widgets Elementor.

Começar com, clique no ícone “+” da área Elementor e escolha uma coluna única ou seção de duas colunas (preferível). Uma seção de duas colunas ajudará você a mostrar seu título, subtítulo e imagem/vídeo lado a lado.

Adicionar títulos: Arraste e solte dois widgets de 'título' (um abaixo do outro) da área do bloco Elementor.

Use a tag HTML H1 para o primeiro título e a tag HTML H2 ou H3 para o subtítulo.

Embora o título deva descrever o que você está oferecendo em uma frase, o subtítulo expandirá a ideia em duas frases.

adicionar título à página inicial do Elementor
Certifique-se de usar cabeçalho e subtítulo com tags HTML apropriadas

Adicionar CTA: Adicione um botão de CTA atraente para incentivar seus visitantes a agir imediatamente. Para fazer isso: 

  • Clique no “ícone ElementsKit” na área de conteúdo do Elementor. 
  • Escolha “Call to Action” nas categorias da seção pronta.
  • Escolha qualquer um dos botões de call to action da lista e clique em “Inserir”
  • Faça as alterações que desejar no conteúdo, estilo e layout e pronto!
Adicione CTA à sua landing page com o modelo de landing page Elementor
Um CTA atraente na página de destino aumenta a conversão

Use a seção Elementor Hero pronta

Se for a primeira vez que você está construindo uma landing page com Elementor, você pode escolher a seção hero na lista de blocos prontos do Elementor. Veja como: 

  • Clique em “Adicionar modelo” da área de conteúdo Elementor. 
  • Vá para “Blocos”
  • Escolha “Herói”
  • Encontre o bloco de herói que você gosta e clique em “INSERIR”
  • Faça as alterações que desejar. 
Adicione uma seção de herói pronta para a página de destino
Adicione uma seção de herói pronta para a página inicial do WordPress

Etapa 3: construir a área de navegação

Existem diferentes maneiras de construir a área de navegação com Elementor. Deixe-me mostrar a maneira mais fácil de construir a área de navegação de sua landing page Elementor para facilitar a rolagem. 

Construa o menu de navegação com Elementor

  • Clique em “Adicionar modelo” na área de conteúdo do Elementor. 
Adicionar modelo de cabeçalho elementor
Adicionar novo modelo Elementor
  • Vá para “Blocos”
Adicionar modelo de cabeçalho elementor 2
Vá para a seção do bloco Elementor
  • Escolha “Cabeçalho”
adicione um cabeçalho elementor 3
Vá para o bloco de cabeçalhos
  • Encontre o bloco de cabeçalho de sua preferência (todos os cabeçalhos no Elementor são apenas para usuários PRO) e clique em “INSERIR”.
  • Faça as alterações necessárias.

Construa o menu de navegação com ElementsKit [melhor alternativa ao Elementor Pro]

  • Clique no “ícone ElementsKit” na área de conteúdo do Elementor.
comece a construir o menu de navegação Elementor com ElementsKit
Comece a construir o menu de navegação com ElementsKit
  • Vá para “Seções”. Na categoria, escolha o “Cabeçalho”
escolha o cabeçalho da página inicial do Elementor
Nas categorias da seção, escolha o “Cabeçalho”
  • Escolha qualquer um dos cabeçalhos da lista e clique em “Inserir” 
escolha um cabeçalho para sua landing page
Escolha o cabeçalho que você precisa
  • Faça as alterações que desejar para construir o menu de navegação Elementor que você precisa fazer.

Etapa 4: Sobre a área da página de destino do WordPress

Quando se trata de construir a seção sobre da sua página de destino do WordPress, você não precisa obedecer a nenhuma regra rígida e rápida. Esta seção pode ocupar uma coluna ou mais. Você pode adicionar um ícone, título e alguns textos conforme sua necessidade. 

Veja como construir a área Sobre da landing page no WordPress com Elementor:

  • Clique em “Adicionar modelo” na área de conteúdo do Elementor. 
Adicionar novo modelo do Elementor
Adicionar novo modelo do Elementor
  • Vá em “Blocos”. Escolha “Sobre”
Encontre seu bloco about preferido para usar em sua landing page
Encontre seu bloco about preferido para usar em sua landing page Elementor
  • Encontre o bloco about que você gosta e clique em “INSERT”
Escolha qualquer bloco about que atenda às suas necessidades para criar uma página de destino do WordPress
Escolha qualquer bloco about que atenda às suas necessidades
  • Faça as alterações necessárias no conteúdo e no estilo. 

Aliás, adicionar fotos da equipe e um vídeo relevante a esta área também é uma boa ideia. Nesse caso, aproveite as seções “equipe” e “vídeo” da lista de seções do ElementsKit. 

Represente sua equipe para obter mais confiança
Represente sua equipe para obter mais confiança

Etapa 5: Projetando uma área de recursos

É importante que os visitantes conheçam os principais recursos do produto ou serviço que você oferece em sua landing page. Educar os visitantes com recursos incríveis os ajudará a agir de acordo com suas expectativas. Deixe-nos saber como você pode projetar a seção de recursos de sua landing page Elementor.

  • Clique em “Adicionar modelo” na área de conteúdo do Elementor. 
  • Vá para “Blocos”
  • Escolha “Recursos” da categoria
  • Encontre o bloco de recursos que você gosta e clique em “INSERIR”
  • Faça quaisquer alterações para atender às suas necessidades.

Etapa 6: área da galeria

Coloque uma área de galeria em sua landing page para torná-la visualmente atraente para os visitantes. Você pode facilmente criar uma área de galeria com o construtor de páginas Elementor usando ElementsKit. Deixa-me mostrar-te como. 

  • Vá para Elementos >> Widgets de pesquisa
  • Procure por “Galeria” e pressione Enter
Uma galeria chama muito a atenção
Uma galeria chama muito a atenção
  • Encontre o widget “Galeria” com “EKIT” no canto superior direito
  • Arraste e solte o widget na área de conteúdo do Elementor
Crie uma área de galeria atraente com ElementsKit
Crie uma área de galeria atraente com ElementsKit
  • Adicione conteúdo, defina o layout e faça outras configurações conforme sua preferência.

Observe que, se você for criar uma galeria de vídeos, também poderá arrastar e soltar o widget da galeria de vídeos do ElementsKit.

Etapa 7: Área de contato e formulário de contato

Se você deseja que os visitantes da página de destino entrem em contato com você, é obrigatório adicione um formulário de contato lá. Embora existam muitos formulários de contato por aí, poucos deles são personalizáveis com Elementor. 

Desses poucos, MetForm é o melhor deles para qualquer site Elementor WordPress. Isso o ajudará a criar formulários de uma ou várias etapas em minutos com Elementor. 

MetForm é tudo que você precisa para criar qualquer tipo de formulário com Elementor
MetForm é tudo que você precisa para criar qualquer tipo de formulário com Elementor

Para ajudar os iniciantes a criar formulários, o MetForm apresenta mais de 30 modelos prontos predefinidos que você pode começar a usar instantaneamente. A propósito, se você quiser criar o formulário de contato do zero, também permite fazer isso com mais de 25 campos de formulário de arrastar e soltar.

Veja como criar um formulário de contato com MetForm para sua landing page WordPress 

Aprender sobre Como criar um formulário com MetForm

Integrar métodos de pagamento e CRM nunca foi tão fácil como agora com MetForm.

MetForm vem com integração de CRM confiável e métodos de pagamento
MetForm vem com integração de CRM confiável e métodos de pagamento


Usando o MetForm, os visitantes podem facilmente fazer upload de arquivos e enviar formulários sem recarregar a página.

Em caso de necessidade, você também pode coletar dados do navegador do usuário com formulários criados pelo MetForm.

Interessado em usar o MetForm para construir todos os seus formulários de contato? 
Explore os recursos e demonstrações do MetForm daqui

Ajustes que você pode desejar em sua página de destino

Agora que você conhece os elementos comuns que compõem uma landing page, isso não é tudo que você pode fazer com o Elementor. Ainda há espaço suficiente para adicionar mais reviravoltas e variações à sua landing page.

Deixe-me falar sobre alguns ajustes que você pode aplicar ou pelo menos executar um teste A/B em sua landing page.

Usando modelos de página de destino Elementor em vez de construir do zero

Se você deseja construir toda a sua landing page em poucos minutos, é melhor usar os modelos de landing page prontos oferecidos pelo construtor de páginas Elementor. Existem muitos exemplos de landing pages impressionantes do Elementor que são construídas com esses modelos.

Como o Elementor tem modelos de landing page gratuitos e profissionais, você pode escolher conforme seu orçamento. Além disso, esses modelos de landing page gratuitos e profissionais do Elementor são altamente otimizados para o dispositivo, SEO.

Veja como inserir os modelos de landing page Elementor:

  • Clique no ícone “Adicionar modelo” na área de conteúdo do Elementor. 
Adicione um modelo de página de destino gratuito ou profissional com Elementor
Adicione um modelo de página de destino com Elementor
  • Vá para “Páginas”
  • Pesquise “Página de destino” e pressione Enter
  • ou proEncontre a landing page que deseja usar e clique em “INSERIR”
Um modelo de página de destino Elementor torna tudo mais fácil
Um modelo de página de destino Elementor torna tudo mais fácil
  • Faça quaisquer alterações no layout, no texto e no que desejar. 

Adicionando menu fixo e âncora

Se você deseja definir seu menu como fixo e mantê-lo sempre no topo, você deve aproveitar o recurso de menu fixo em sua página de destino.

Aprender: Como criar um cabeçalho transparente com Elementor 

Para permitir que os visitantes naveguem rapidamente pelas páginas, use a âncora widget do Elementor para todas as seções. 

Escondendo a navegação

Se você está entediado de ver a área de navegação em todo o site e quer dar um tempo, ocultar a navegação na sua landing page pode ser uma boa ideia. 

Nesse caso, a melhor maneira é ocultar a área de navegação quando os usuários passam de um determinado ponto da sua landing page.

Adicionando Depoimentos

Os depoimentos de seus usuários são uma ótima prova social que você pode usar em sua landing page para WordPress. Você pode adicionar depoimentos pelos widgets e blocos prontos do Elementor ou ElementsKit:

Use o widget de depoimento

  • Vá para Elementos >> Widget de pesquisa
  • Pesquise “Depoimento” e pressione Enter
  • Escolha o widget de depoimento por Elementor ou ElementsKit
Você pode usar qualquer widget de depoimento em sua página de destino
Você pode usar qualquer widget de depoimento em sua página de destino
  • Adicione conteúdo, escolha um estilo e faça alterações nas configurações avançadas da guia. 
Certifique-se de ajustar o depoimento
Certifique-se de ajustar o depoimento

Use o bloco de depoimento pronto da Elementor

  • Clique no ícone “Adicionar modelo” na área de conteúdo do Elementor. 
  • Vá para “Blocos”
  • Escolha “Depoimentos” na categoria
  • Encontre o bloco de depoimento que você gosta e clique em “INSERIR”
  • Faça as alterações necessárias. 

Ou

Use a seção de depoimentos prontos do ElementsKit 

  • Clique no “ícone ElementsKit” na área de conteúdo do Elementor. 
  • Vá para “Seções”.
  • Na categoria, escolha o bloco “Depoimento”.
Um depoimento garante aos seus leads sobre sua reputação
Um depoimento garante aos seus leads sobre sua reputação
  • Escolha qualquer um dos estilos de depoimento da lista e clique em “Inserir” 
Adicione uma seção de depoimentos à sua landing page com ElementsKit
Adicione seção de depoimentos com ElementsKit
  • Edite a seção conforme necessário. Além disso, você também pode mostrar depoimentos no WordPress e personalize-os de acordo com seu desejo usando ElementsKit.

✨ Verificar como importar e exportar modelos Elementor.

Perguntas frequentes (FAQ)

A página inicial e a página de destino são semelhantes?

Não, a página inicial e a página inicial não são semelhantes. Algumas diferenças importantes separam essas duas páginas. A página inicial é a primeira página do seu site. Por outro lado, uma página de destino refere-se a qualquer página onde um visitante chega. Além disso, uma página inicial inclui mais links e informações do que uma página de destino necessária para descrever completamente uma marca ou produto. Simplificando, uma página inicial transmite todas as informações necessárias para uma marca ou produto e uma página de destino concentra-se em um determinado recurso ou tópico.

Quais elementos devo adicionar a uma landing page para ofertas de Halloween com Elementor?

Para criar uma landing page WordPress para promover ofertas de Halloween, você pode considerar o uso dos seguintes materiais: 

  • ➜ Um fundo assustador
  • ➜ Animação misteriosa
  • ➜ Ícones espirituais
  • ➜ Tipografia especial
  • ➜ Símbolos tradicionais de Halloween, etc. 

Leia este blog para conhecer todo o processo de criação de uma landing page Elementor com templates para o Halloween:  Como criar uma página inicial para o Halloween

Como adicionar uma seção de FAQ à página inicial do Elementor? 

Use uma seção de perguntas frequentes para adicionar perguntas frequentes à sua página de destino. Deixe-me mostrar os passos que você deve seguir. 

Use o bloco de perguntas frequentes Readymade da Elementor
  • Clique no ícone “Adicionar modelo” do Elementor para abrir a biblioteca de modelos
  • Vá para “Blocos”
  • Escolha “Faq” na categoria
Elementor tem blocos de FAQ prontos para usar em páginas de destino
Elementor tem blocos de FAQ prontos para usar
  • Encontre o bloco de FAQ que você gosta e clique em “INSERIR”
Escolha seu bloco de FAQ favorito e use-o em sua landing page Elementor
Escolha seu bloco de perguntas frequentes favorito
  • Faça as alterações necessárias. 

Ou

Use a seção de perguntas frequentes Readymade do ElementsKit 
  • Clique no “ícone ElementsKit” na área de conteúdo do Elementor. 
  • Vá para “Seções”
  • Na categoria, escolha o bloco “FAQ”
ElementsKit oferece bloco de perguntas frequentes pronto para páginas de destino
ElementsKit oferece bloco de perguntas frequentes pronto
  • Escolha qualquer um dos estilos de FAQ da lista e clique em “Inserir” 
Deixe seus visitantes saberem mais sobre as perguntas frequentes de sua página de destino
Deixe seus visitantes saberem mais do FAQ
  • Edite a seção conforme necessário.

Como criar uma landing page Elementor em WordPress para uma campanha de Black Friday? 

Se você está planejando iniciar uma campanha da Black Friday, criar uma landing page dedicada para oferecer ofertas da Black Friday o ajudará a obter mais vendas. Nós escrevemos um blog sobre como criar uma landing page para promover ofertas da Black Friday. Basta seguir as etapas para criar uma ótima landing page da Black Friday com Elementor. 

Como posso adicionar uma contagem regressiva à página de destino? 

Adicionando uma contagem regressiva em sua página de destino é uma ótima estratégia de marketing que cria FOMO (medo de perder) nos visitantes e os inspira a agir imediatamente. 

Veja como você pode adicionar um cronômetro de contagem regressiva no Elementor: 

  • Vá para Elementos >> Widget de pesquisa
  • Procure por “Temporizador de contagem regressiva” e pressione Enter
  • Arraste e solte o widget de contagem regressiva (com EKIT no canto superior direito) do ElementsKit 
Adicione um cronômetro de contagem regressiva para criar FOMO
Adicione um cronômetro de contagem regressiva para criar FOMO
  • Escolha seu estilo de cronômetro de contagem regressiva favorito e faça as alterações necessárias nas configurações. 
Adicione qualquer cronômetro de contagem regressiva que desejar à sua página de destino
Adicione qualquer cronômetro de contagem regressiva que desejar

Como criar uma landing page Elementor para campanhas de vendas de final de ano e ano novo?

As campanhas de vendas de final de ano e ano novo podem ajudá-lo a aumentar muito sua receita anual. Para ajudá-lo a construir uma landing page Elementor atraente para as ofertas que você está oferecendo, elaboramos um guia passo a passo para você.

Confira aqui: Como criar uma landing page para campanha de ano novo

Quais temas gratuitos/premium devo usar para landing pages do Elementor WordPress?

Embora a maioria dos temas WordPress funcionem com o construtor de páginas Elementor sem qualquer conflito, alguns deles funcionam melhor. Se você está procurando ótimos temas gratuitos, pode escolher qualquer um dos seguintes: 

  • Astra
  • GerarPress
  • neve
  • OceanoWP

Mas, escolhendo Astra é altamente preferível, pois oferece os melhores temas populares do WordPress.

Relacionado: Explorar 15 melhores temas gratuitos e profissionais para Elementor junto com suas características, prós e contras.

Conclusão

Parabéns! Agora você sabe criar uma landing page Elementor com e sem templates no WordPress para qualquer ocasião e campanha de marketing. Se você tiver alguma confusão ou dúvida, sinta-se à vontade para nos informar na caixa de comentários.


Comentários

  1. Avatar de Pedro

    Obrigado, isso é muito útil. O que ainda não entendo é como posso adicionar um rodapé personalizado.

Deixe um comentário

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