Posso adicionar um código customizado em minha landing page legada?

Você pode adicionar um código customizado (HTML, CSS e JavaScript) em sua landing page usando o placeholder específico no editor de landing page. Use esta opção sempre que quiser adicionar ferramentas e widgets não inclusos no editor.

O código é adicionado tanto na versão de desktop quando na versão móvel da sua página. Caso deseje executar um teste A/B em sua página de destino, certifique-se de adicionar o placeholder em cada variação. Você também pode adicioná-lo na página de agradecimento.

Existem algumas coisas a se manter em mente quando se trabalha com um código customizado:

  • Você só pode adicioná-lo na seção do <body> do texto.
  • Para manter a conformidade com a GDPR, certifique-se de informar seus leads e visitantes se usa qualquer formulário ou código de terceiros, que envolva mapeamento ou acompanhamento.
  • Adicionar múltiplos códigos de acompanhamento, widgets etc. pode tornar sua landing page mais lenta. Além disso, sobrecarregá-la de conteúdo vai espantar os visitantes.
  • Ao trabalhar no editor de landing page, você verá apenas o placeholder. O script só funciona em modo de pré-visualização e em uma página publicada. Portanto, você deve inspecionar a página assim que publicá-la, de modo a verificar se está funcionando do modo planejado. Você não deve compartilhar o link na página antes de garantir sua qualidade.
  • É uma boa ideia verificar se a página que contém o código é exibida apropriadamente em todos os navegadores, especialmente se estiver modificando CSS.
  • Nossa equipe de Atendimento ao cliente pode oferecer suporte para os recursos padrão disponibilizados no editor. Não podemos oferecer assistência ou garantir a funcionalidade de qualquer script de terceiros.

Você pode adicionar o código customizado em qualquer template novo ou já existente do editor. Segue como chegar lá:

1. Vá para Landing Pages e faça uma das seguintes ações:

Criar botão mostrado na gestão de landing page
  • selecione Editar página no menu de Ações ao lado do nome dela.
Editar opção de página mostrada na gestão de landing page

2. Dê um clique duplo no ícone Código customizado para adicionar o placeholder no template.

Localização do ícone do código customizado na barra de ferramentas mostrada

O placeholder aparece no canto superior esquerdo da seção mostrada.

Placeholder adicionado em uma seção

Ao dar um clique duplo no ícone, uma caixa onde você pode inserir um código é aberta automaticamente.
3. (Opcional) Arraste e solte o placeholder se deseja que ele aparece num local específico da página. Dê um clique duplo nele e uma caixa se abre onde você pode inserir o código.
4. Cole ou digite o código. Certifique-se de fechar seus scripts com a tag <script> (no JavaScript). Ao adicionar múltiplos snippets de código, cole-os um sob o outro.

Modal onde você pode inserir código customizado

5. (Opcional) Se estiver realizando um teste A/B, repita os passos 2 a 4 para cada variação da página.
6. Ao criar uma nova página, clique no ícone de celular para gerar uma versão para dispositivo móvel dela. Se estiver editando uma página já existente, clique para verificar se aprova as mudanças.

Mostrada colocação do ícone da versão móvel

7. (Opcional) Clique em Pré-visualização para verificar se o código exibe corretamente os elementos que adicionou, que devem estar visíveis para seus visitantes.

Mostrado botão de pré-visualização no editor de landing page

8. Salve as mudanças e publique a página de destino.
9. Visualize a landing page o publicada para verificar se sua exibição está adequada.

Artigos relacionados

Recursos populares