# Como criar formulário com Campos Dinâmicos

Chamamos de dinâmicos os campos de formulários de captura que podem ser personalizados com a informação do lead.

{% hint style="warning" %}
**Requisito Obrigatório:** Possuir uma máquina de e-mail criada no leadlovers.
{% endhint %}

## O que são campos dinâmicos

Campos dinâmicos são campos personalizados que podem ser utilizado dentro de páginas da leadlovers, de forma rápida e prática. Após a criação os campos é possivel selecionar um componente de formulário e selecionar os campos desejados sem a necessidade de criar um novo.

## **Localizando os campos dinâmicos na leadlovers:**

1. Acesse a área de F**erramenta,** localizado no canto superior direito de sua conta
2. Clique na opção **Campos de Captura personalizados**
3. Para criação do campo, clique no **botão de +** , localizado no canto inferior direito da tela.

<figure><img src="https://20845639-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2ForSghK2Fo1qO59JbyMSS%2Fuploads%2FK3TQsas6ELN9uRxzQJSX%2Fimage.png?alt=media&#x26;token=0bfd2091-9be7-45da-a5b5-73410e651ddf" alt=""><figcaption></figcaption></figure>

### Criando os campos personalizados

Ao clicar no botão de novo campo, adicione as informações solicitadas.

1. &#x20;**Em nome,** Insira o **Nome** do campo dinâmico/personalizado.
2. **Em Placeholder,** adicione aqui o nome que deseja mostrar no placeholder.&#x20;
3. Em **Tag**, você dará um nome personalizado à ao seu campo dinâmico. \
   \
   Essa tag poderá ser utilizada nas tags de e-mail. Se não sabe o que é uma tag de e-mail, saiba mais [clicando aqui.](https://central.ajudaleadlovers.com/automacoes/maquinas/maquina-de-email/como-utilizar-tags-de-e-mail-em-campos-dinamicos)
4. Em **Tipo de campo**, detre as opções selecione o tipo de campo desejado.&#x20;

{% hint style="warning" %}
&#x20;Lembrando que o campo e-mail é obrigatório e é preciso ser adicionado em seu formulário.
{% endhint %}

Clicando Em **Vincular a um campo fixo**, você pode vincular este campo dinâmico à um campo fixo (padrão) já existente.

Confira os campos e depois clique em **Salvar.**

O campo dinâmico que você acabou de criar será exibido como o exemplo abaixo.

![](https://legado.leadlovers.site/wp-content/uploads/2020/07/0-15-1024x191.png)

Ele poderá ser usado fácilmente em páginas de captura dentro da leadlovers.

## **Como criar um formulário dinâmico:**

O formulário dinâmico, diferente do campo dinâmico, pode ser usado dentro ou fora da leadlovers.

#### Criando um formulário dinâmico

1. Acesse a **Máquina** em que deseja criar seu formulário dinâmico
2. Clique na aba **Formulários de Captura**
3. Clique no **botão de +** para criar um novo formulário de captura
4. Aparecerá uma nova janela, clique na opção Formulário Dinâmico.

### **Configurando o Formulário**

1. **Em nome do formulário,** aqui adicione um nome para identificação do formulário
2. **Em Texto botão**, nesse campo você inclui o texto que será exibido dentro do botão de ação do formulário.
3. Em Url de destino de captura, Nesse campo você inclui a **URL após captura** (Página agradecimento, vendas, checkout, recompensa…etc).
4. Em Url destino (lead), Neste campo você pode incluir **uma URL após captura diferente** para quem já é lead  cadastrado.
5. **Em Direcionamento avançado,** Essa função habilitada, permite que você configure uma URL de direcionamento específica para cada campo, quando preenchida no formulário.
6. **Em Sequência de destino lead**, Aqui, você poderá selecionar o **funil que o lead entrará após captura.**
7. **Em Notificar ao capturar lead**, Se habilitada essa função, você poderá receber uma notificação em seu e-mail ao capturar leads.&#x20;
8. **Em Habilitar LGPD**, Essa opção lhe abrirá mais três campos para configurar qual a mensagem sobre a LGPD que você deseja que o lead leia e concorde ao se capturar no formulário.
9. Em usar **Captcha,** habilitará a função de segurança, isso fará com que o formulário de captura não permita a captura de bots (robôs) em seu formulário de captura.&#x20;
10. Em **Design do formulário**, Aqui você pode personalizar seu formulário, escolhendo a forma que  o formulário será exibido.&#x20;
11. E **Em Preview do Formulário**, você poderá visualizar como o formulário que você personalizou está.

Realize as personalizações que desejar e clique em Salvar no final da página.

{% embed url="<https://youtu.be/NHc6-OpGw5o?si=C4l7Nn9l5Bo6t5o4>" %}

### Como incluir formulário dinâmico em uma página do construtor por blocos

* O construtor por blocos é um construtor mais antigo da leadlovers, habilitado apenas para clientes mais antigos.&#x20;
* Temos também um **vídeo demonstrando como fazer este procedimento**, se preferir assistir o vídeo, [clique aqui.](https://www.youtube.com/watch?v=Xgxuhqt-H3Q\&feature=emb_logo)

Confira abaixo o passo a passo de como adicionar esse formulário na sua página.&#x20;

#### Adicionando o formulário na página&#x20;

{% hint style="info" %}
Adicione os códigos corretamente nos campos descritos
{% endhint %}

Em uma aba abra o seu formulário e deixe a página de códigos aberta, em uma outra aba abra a sua página do construtor por blocos.<br>

![](https://legado.leadlovers.site/wp-content/uploads/2020/07/0-20.png)

* **O código 2:** Será adicionando no head da página
* **O código 3:** Este é o código que será inserido no HTML da página, no local onde deseja que o formulário dinâmico seja exibido.
* **O código 4:** Este é o código que será inserido no campo BODY da página.

## Acessando a página e adicionando o formulário

Você precisa, obrigatoriamente, ter um bloco que contenha um formulário, para que possa substituir o formulário existente pelo seu formulário dinâmico.&#x20;

* &#x20;Clique no tipo **visualização em BLOCOS**, no canto superior esquerdo da página e depois clique em HTML.&#x20;
* Substitua o código do formulário antigo pelo seu código de formulário dinâmico. Encontre o inicio \<form e fim do formulário \</form> e exclua toda a seleção.&#x20;

![](https://legado.leadlovers.site/wp-content/uploads/2020/07/0-22-1024x408.png)

Agora é precisio adicionar os outros códigos dentro da configuração da página.

* &#x20;Clique no ícone de engrenagem no canto superior direito da página.
* **Insira o código do campo HEAD**, que copiou do seu formulário dinâmico.
* **Depois, Insira o código do campo BODY**, que copiou do seu formulário dinâmico.

Clique em **Salvar**.

![](https://legado.leadlovers.site/wp-content/uploads/2020/07/0-26.png)

### Como incluir formulário dinâmico em uma página do construtor componente

Dentro da página do construtor por componentes, utilize um modelo que possua o formulário ou utilize o componentes de formulários do menu lateral.

<figure><img src="https://20845639-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2ForSghK2Fo1qO59JbyMSS%2Fuploads%2FW5NgBWqSdOV1pas8LdgN%2Fimage.png?alt=media&#x26;token=dbb404c3-53fa-49b3-9785-a6e1c8e89cf7" alt=""><figcaption></figcaption></figure>

1. Clica em cima do formulário, abrirá uma barra lateral de edição, clica em **editar Formulário**
2. Abrirá um pop up para alteração do formulário, selecione a opção **Dinâmico.**
3. Agora defina os campos que deseja adicionar em seu formulári&#x6F;**. Clicando no +** é possivel habilitar ou criar novos campos personalizados.

{% hint style="info" %}
Para alterar a ordem dos campos, basta clicar nas flexinhas que surgiram entre um campo e outro.
{% endhint %}

{% embed url="<https://youtu.be/Qswvr02RQSs>" %}
