Como Criar um Funil Completo do Zero e Utilizar os Componentes na inlead

Visão Geral dos Componentes
Ao adicionar uma nova etapa no seu funil, você terá acesso a uma biblioteca de componentes. Cada um possui configurações específicas de estilo, exibição e funcionalidade.

1. Alerta
Utilizado para exibir avisos ou informações em destaque para o visitante.

• Estilos disponíveis: Vermelho (erro/urgência), informativo (azul), sucesso (verde), atenção (amarelo), cinza neutro e cor do tema.
• Nota: A "cor do tema" pode ser configurada no menu lateral acessando Design > Cores.

2. Altura
Componente focado em coleta de medidas corporais.

• Modelo de régua: Permite que o usuário arraste um marcador para definir a altura em centímetros ou polegadas.
• Modelo de input: Permite que o usuário digite o valor exato da medida manualmente.

3. Argumentos
Ideal para apresentar benefícios ou características em formato estruturado. Diferencia-se do componente de texto padrão por possuir uma caixa de destaque em volta do conteúdo.

• Layouts: Lista, duas, três ou quatro colunas. Atenção: O uso de quatro colunas não é recomendado para a versão mobile, pois prejudica a leitura.
• Disposição: Permite alternar a posição da imagem em relação ao texto (cima, baixo, lados).
• Largura: Você pode ajustar a largura do componente (ex: 50%) para alinhar dois componentes lado a lado na tela.

4. Áudio
Permite inserir mensagens de voz no funil.

• Estilos: Layout padrão com nome, modelo simulando o Instagram e versão em modo escuro.
• Formato de arquivo: É estritamente recomendado o upload de arquivos no formato .MP3. Isso garante a compatibilidade e o funcionamento correto em todos os dispositivos e sistemas operacionais (Android, iOS, Windows, Mac).

5. Botão
O componente fundamental para a progressão do funil.

• Ações: Pode ser configurado para Redirecionar (enviar para uma URL externa, como checkout ou WhatsApp) ou Navegar entre as etapas (avançar para a próxima página ou pular para uma etapa específica).
• Estilização: Cores sólidas ou transparentes, opções de animação (piscar) e auto relevo.
• Fixo no rodapé: Mantém o botão sempre visível na parte inferior da tela, acompanhando a rolagem do usuário.

6. Captura
Utilizado para a coleta de dados de leads.

• Permite alterar o título do campo e configurar os tipos de entrada (e-mail, telefone, texto).
• Possui máscaras de preenchimento automático para formatação de datas, decimais e telefones.

7. Texto
Um editor de texto completo (Rich Text).

• Permite alterar tamanho da fonte, cores do texto e do fundo, criar listas e inserir hiperlinks clicáveis dentro do parágrafo.

8. Timer
Cria senso de urgência e escassez na página.

• A configuração de tempo é feita em segundos (ex: para exibir 5 minutos, configure 300 segundos).
• Atraso de exibição: Você pode configurar a regra "Mostrar após", fazendo com que o timer só apareça na tela e inicie a contagem após um tempo determinado (ex: exibir após 3 segundos).

9. Vídeo
Permite incorporar players de vídeo externos.

• Formato obrigatório: A inlead exige a utilização do código de incorporação iframe (Embed Code). Links diretos da URL não funcionarão.
• Como obter: Em plataformas como YouTube ou Vturb, clique com o botão direito sobre o vídeo e selecione "Copiar código de incorporação" (Copy embed code). Cole esse código diretamente no componente.
• Dica para vídeos verticais (Shorts/Reels): Nas configurações do componente, altere o padrão de exibição para "Mobile" para enquadrar corretamente.

Material Complementar
Para acompanhar a montagem visual das etapas, a aplicação prática de proporções lado a lado e configurações detalhadas na tela, assista ao nosso tutorial completo: