# Widget de geração de leads

O widget gerador de leads vai ajudar você a coletar solicitações de usuários do seu site 24 horas por dia. Vamos ver como você pode instalar e configurar o widget.

## Configurações

<div data-with-frame="true"><figure><img src="/files/263fb3d2ce15f6bffa0438415183c0bf4f790fd5" alt="" width="346"><figcaption></figcaption></figure></div>

Nas configurações do widget, na seção "Informações básicas", você precisa preencher os seguintes campos obrigatórios:

1. **Nome do widget;**
2. **O domínio do site onde você coloca o widget:** ele pode ser tanto um site desenvolvido na Mavibot quanto no serviço Tilda, assim como no seu próprio site.

Em seguida, há caixas de seleção que ajudarão a enviar callbacks para o sistema depois que o cliente enviar a solicitação, bem como a exibir o logotipo.

Os campos de configuração a seguir ajudarão você a determinar quais informações precisam ser solicitadas ao cliente:

<div data-with-frame="true"><figure><img src="/files/29efedbea82023b21eb9551c73cad4aad0e743ec" alt=""><figcaption></figcaption></figure></div>

Se necessário, o formulário enviado aos clientes não será exibido em seu site até que o cliente preencha o campo obrigatório.

## Condições de disparo

<div data-with-frame="true"><figure><img src="/files/45e6af6ec9a86f11f8ed29f6d253d3a019863e9e" alt=""><figcaption></figcaption></figure></div>

### Intervalo de tempo

Você pode definir o horário de exibição do widget no site. Para isso, use o recurso "Quando mostrar o widget":

1. **Imediatamente**\
   Essa configuração exibirá o widget quando o usuário visitar o site.
2. **Após atraso de tempo**

<div data-with-frame="true"><figure><img src="/files/f77a9244aca89faea36c6a9d1ccf721281c17346" alt=""><figcaption></figcaption></figure></div>

O widget será exibido no site após um determinado número de segundos ter se passado desde que o cliente visitou o site.

O intervalo de tempo é definido em segundos, onde o valor mínimo é 1 segundo e o máximo é 15 segundos.

3. **Após rolagem**

<div data-with-frame="true"><figure><img src="/files/326b908bac25732bcf1334a9a0fbb247dde14d65" alt=""><figcaption></figcaption></figure></div>

A condição "Após rolar" significa que, assim que o usuário executar uma ação para rolar a página do site, independentemente de ter rolado o site inteiro até o final ou visualizado uma pequena parte, o widget será exibido no site após um número definido de segundos.

O valor mínimo do intervalo de tempo é 1 segundo; o máximo é 15.

## Aparência visual

<div data-with-frame="true"><figure><img src="/files/77469b552f32d054d66835af84211157b042632c" alt=""><figcaption></figcaption></figure></div>

Use a função de upload de imagem nas configurações de aparência para adicionar uma capa.\r\nRecomendamos escolher um design vibrante e interessante para atrair o máximo de atenção possível dos usuários.

<div data-with-frame="true"><figure><img src="/files/788cd254aa4463cd84823f26ae5235e34567bab3" alt=""><figcaption></figcaption></figure></div>

Em seguida, posicione a imagem alinhando-a em relação às bordas superior, esquerda e direita:

<div data-with-frame="true"><figure><img src="/files/adf61708b53814e83ec326d169eafdc2c32c4a1f" alt=""><figcaption></figcaption></figure></div>

Depois, os campos vazios são definidos: você precisará deles se quiser especificar o título e o subtítulo do widget:

<div data-with-frame="true"><figure><img src="/files/84e2077519986ad9e6dda50eeb6c4b094e41f1e2" alt=""><figcaption></figcaption></figure></div>

Depois, escreva um texto motivacional para заинтересar o usuário na sua oferta:

<div><figure><img src="/files/3b511ec8cca0be99dddf8ae0947602a284847aa2" alt=""><figcaption></figcaption></figure> <figure><img src="/files/2cb9d89c1d717a10c016fa4a10f0f170612297a6" alt=""><figcaption></figcaption></figure></div>

#### **Personalização gráfica**

Nas configurações de aparência, você pode aplicar suas habilidades de design gráfico para criar um widget totalmente exclusivo.

<div data-with-frame="true"><figure><img src="/files/1b61e2b510f71679f04655382759d7b4be74b368" alt=""><figcaption></figcaption></figure></div>

Você tem acesso a uma paleta de cores abrangente.

Também recomendamos experimentar padrões exclusivos para o plano de fundo do widget para aumentar seu apelo visual.

## **Como adicionar seu widget a um site**

Depois de configurar todas as opções e editar a aparência do widget de acordo com seu design exclusivo, clique no botão "Adicionar widget" na parte inferior da tela:

<div data-with-frame="true"><figure><img src="/files/6ea3212551111281601434a08760ee80cbc043d7" alt=""><figcaption></figcaption></figure></div>

Depois disso, você irá para a lista de widgets prontos, onde precisa clicar no botão "Código de incorporação no site":

<div data-with-frame="true"><figure><img src="/files/69561d4caa175c35a8d5a48a5bb9da11a47ba0e6" alt=""><figcaption></figcaption></figure></div>

Depois disso, você verá uma janela modal com um script:

<div data-with-frame="true"><figure><img src="/files/f6beee04b8e633b1f088da4829e3cf6c323949e8" alt=""><figcaption></figcaption></figure></div>

Em seguida, copie o script e vá para as configurações do site (o domínio especificado na configuração do seu widget). Insira o script no HTML `<head>` seção.

{% hint style="info" %}
**Para incorporar o widget em um site Tilda:**

1. Copie o script do widget clicando no **"Código de incorporação no site"** .
2. No seu editor Tilda, cole o script nas configurações do projeto ou em um bloco HTML na página correspondente.
   {% endhint %}

**Perfeito!** A configuração e instalação do seu widget agora estão concluídas.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.mavibot.ai/doc/pt/websites/widgets/leads.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.