Landing pages - Parte 4: Adicionando um formulário e usando opções avançadas

Quando você estiver confortável o suficiente com as configurações e os arranjos da landing page, você pode usar as opções avançadas descritas abaixo.

Criamos uma série de artigos para ajudar você a criar suas landing pages. 

💡 Dica
Landing pages estão disponíveis para os planos Premium e Empresa.

Neste artigo, veremos as seguintes opções avançadas:

Como adicionar um formulário para criar uma página geradora de lead

Formulários permitirão que você recupere endereços de e-mail e automaticamente os classifique em suas listas na Sendinblue.

Se estiver criando landing page geradoras de lead, comece adicionando um elemento Formulário:

Adicione uma nova Seção > Filtrar seções pré-fabricadas > Formulários e então escolha uma seção pré-definida que possa ser editada para se adequar ao seu desejo. Ou comece do zero, adicionando um novo Elemento > Formulário.
Form_1.png form_2.png

Administrador de campos

Nesta parte, você escolherá onde armazenar os contatos que você vai recuperar com o formulário e o próprio formulário: adicione e ordene campos, torne-os obrigatórios ou não, adicione texto de ajuda, etc.

Para acessar as configurações no Administrador de campos, clique no formulário no editor de sua landing page. Descreveremos abaixo as diferentes opções que você vai encontrar.

Escolha sua lista de contato

Edit_form_-_lists.png
  1. Clique no formulário para abrir o Painel de edição do formulário à direita
  2. No Administrador de campos, você vai configurar onde os e-mails coletados serão armazenados em sua conta Sendiblue:
    • Selecione uma pasta lista a partir do primeiro menu suspenso
    • Selecione uma lista de contato a partir do segundo menu suspenso

Observe que o formulário criado com o construtor de landing page não aparecerá na página API e formulários de sua conta Sendinblue.

❗️ Importante
Se quiser atualizar os contatos de sua lista quando eles preencherem o formulário, você precisa marcar Atualizar contatos existentes no envio do formulário em Controles do formulário de assinatura.

Configurando os campos

A seguir, para os dados que quiser coletar, você irá adicionar os diferentes campos ao seu formulário gerador de lead. 

mceclip1.png

  1. Adicionar um campo de contato: você pode adicionar campos pré-existentes ao seu formulário a partir deste menu suspenso.
  2. Criar um novo campo: se o atributo de contato ainda não existir, você pode criar um a partir daqui.
  3. Reordenar os campos: Simplesmente clique em = e então arraste um campo para reordená-lo.
    Excluir um campo: você pode remover os campos usando o ícone da lixeira.

    Clique no campo e escolha suas configurações:
  4. Etiqueta: exiba o selo sobre o campo.
  5. Oculto: clique no toggle para criar um campo oculto ou um que seja visível neste formulário. 
    Você pode adicionar um campo oculto no formulário quando desejar que este seja preenchido automaticamente, passando este dado na URL com parâmetros de consulta.
  6. Obrigatório: escolha se o campo é obrigatório ou não para o envio do formulário.

7. De acordo com cada campo, você terá diferentes configurações:

  • Etiqueta: mude o nome da etiqueta exibida sobre o campo
  • Placeholder: digite o texto exibido em seu campo. Por padrão, é o mesmo texto que sua etiqueta.
  • Texto de ajuda: digite o texto que você quer exibido debaixo do seu campo. Pode ser útil para sugestões.
  • Valor padrão: é o valor que será sincronizado em sua lista de contato SendinBlue se o visitante não preencher o campo.
  • Parâmetro URL: é o valor que será automaticamente inserido no campo do formulário. Seu usuário pode ser substituído, se ele escolher.

❗️ Importante
Se você adicionar um número de telefone em seu formulário, o único formato válido será o formato internacional:  +447911123456 para o Reino Unido, +12025550101 nos EUA ou +33655678834 na França.
Use o Placeholder para ajudar seus usuários a colocarem o formato correto.

Redirecionamento ao enviar o formulário

Nas Opções de redirecionamento, você pode escolher para onde seus usuários serão redirecionados ao enviar os dados de contato (ao clicarem no botão Call to Action): 

  • Página no funil = seleciona a página no funil na lista suspensa
  • URL externo = digite o link da página.

Double opt-in

Com a opção double opt-in:

  1. Seu novo assinante insere o endereço de e-mail dele em seu formulário.
  2. O assinante deve clicar no link em um e-mail de confirmação para ser adicionado à sua lista de e-mail SendinBlue.

Design

A lista suspensa permite que você escolha o design de seus campos: nenhum, delineado, contorno curvo, sublinhado com fundo, sublinhado sem fundo.

Style_form_gif.gif

Seu formulário também pode ser exibido como um formulário horizontal. Se você escolher esta opção, recomendamos que você remova as etiquetas dos seus campos.

Para mudar a cor do plano de fundo, vá em configurações de colunas, como explicado em Parte 3: editando as configurações de todos os elementos de sua landing page.

Controles do formulário de assinatura

Atualize contatos existentes no envio do formulário: aqui você pode escolher atualizar contatos existentes quando eles enviam seus formulários. É essencial marcar esta caixa se quiser atualizar as informações dos seus contatos quando eles preencherem o formulário.

Você também pode desabilitar o re-CAPTCHA.

Rastreamento Javascript (Facebook Pixel / Google Analytics)

O Rastreamento dará a você a oportunidade de inserir seus scripts de rastreamento em certas partes da página.

Serviços como Facebook e Google Analytics requerem que você tenha o script na tag head, enquanto outros serviços podem requerer isso na tag body. Consulte suas orientações atentamente sobre onde colocar o script.

Para acessar a parte do Rastreamento, acesse Configurações no canto inferior esquerdo da página e clique na aba Rastreamento:

mceclip0.png

Landing page multi-páginas

Se quiser adicionar páginas adicionais para criar um funil, acesse a barra lateral esquerda e clique na Aba administrar páginas, então clique em + CRIAR UMA PÁGINA EM BRANCO.

Renderização com base no dispositivo

Quando sua landing page estiver completa, os ícones desktop, tablet e smartphone no canto superior direito permitirá que você teste sua landing page renderizando-a em diferentes dispositivos.

Graças aos botões Desktop/Dispositivos móveis no topo, você pode testar a renderização de sua landing page no desktop, tablet, e smartphone.

Observe que se você ocultar no Celular ou Tablet, a seção mostrará em pré-visualização e no construtor caso você precise fazer edições. No entanto, na página ao vivo, após o lançamento, isso não será exibido.

Você pode escolher exibir ou não blocos de acordo com o dispositivo. Mais detalhes em nosso artigo Parte 3: editando as configurações de todos os elementos de sua landing page > Visibilidade.

⏩ O que vem a seguir?