Os formulários da Atendare podem ser adicionados em páginas externas usando o código de incorporação.
Para adicionar um formulário do Atendare em uma página externa, primeiro acesse sua lista de formulários:
- Navegue até o painel de Marketing.
- Clique em Campanhas.
- E depois em Formulários.
Em seguida, você será direcionado para a lista dos formulário criados.
- Procure pelo formularaio que você deseja incorporar
- clique nos três pontinhos
- E selecione a opção Editar.
As configurações do formulário serão exibidas. Clique na aba Código de Incorporação para visualizar e copiar o código. Caso a opção código de incorporação não esteja disponível, entre em contato com a equipe de suporte da Atendare para que possam habilitar essa funcionalidade para você.
Agora, copie o código de incorporação exibido. Você pode fazer isso selecionando o código manualmente e pressionando Ctrl+C (ou Cmd+C no Mac) ou clicando no ícone de copiar localizado no canto direito da caixa de código.
Depois, navegue até a página onde deseja incorporar o formulário. Em seguida, insira o código fornecido em um elemento de HTML na página. Para fazer isso, abra o editor da página, adicione um bloco ou elemento HTML, e cole o código no local apropriado. Isso permitirá que o formulário seja exibido corretamente na sua página, integrando-se com o restante do conteúdo de forma fluida.
Em seguida, o formulário da Atendare será adicionado automaticamente à sua página, garantindo que ele apareça exatamente onde você o posicionou no editor HTML.
Para customizar as cores e as letras do formulário, você terá que adicionar um script abaixo do código do formulário, anexado abaixo.
O processo de customização do formulário em uma página externa não é tão simples como nas landing pages do Atendare, mas com um pouco de conhecimento em CSS, você conseguirá deixar o formulário do seu jeito.
Depois de adicionar o formulário à sua página externa, todos os visitantes que o preencherem serão automaticamente registrados como contatos no CRM.
ANEXO – Código customização adicional via CSS de personalização
<script>
function formInit(atd){
atd.setButtonHTML("Texto do botãoo");
// atd.setHeaderHTML("Innher Html do Header");
// atd.setFooterHTML("Innher Html do Footer");
atd.setCSS(`
.atdFormPanel .atdForm .atdFormItem {
color: #252525;
font-size: 18px;
}
.atdFormPanel .atdForm .atdFormButtonContainer .atdFormButton {
width:100%;
background: #00B151;
color: #FFFFFF;
font-weight: bold;
padding: 15px 10px;
margin: 0px 0px 20px 0px;
border: 0px;
}
.atdFormPanel .atdFormFooter { }`);
}
</script>