Próximos passos na criação de sua landing page

217 views 21 de fevereiro de 2019 21 de fevereiro de 2019 villetarget_helper 2

Após cadastrada a sua landing page e você estar confortável com os primeiros passos no nosso construtor podemos mover para detalhes mais específicos na criação de sua página de captura.

  • Os botões: Elementos, Conteúdo e Detalhes:

O pagebuilder possui três botões ativáveis que são chave para construção das páginas e personalização dos elementos disponíveis. Vejamos quais são eles e suas possibilidades:

  • Botão Elementos:

Este botão é utilizado para todas as ações relacionadas ao arrastar e soltar, ordenar e reordenar, alterar manualmente o código fonte, clonar e resetar o elemento desejado dentro do construtor ou excluir o mesmo. Quando esse botão está selecionado ao passar o mouse sobre qualquer elemento é possível ver o botão com as opções anteriormente citadas.

  • Botão Conteúdo:

Este botão é utilizado para todas as ações referentes ao conteúdo das landing pages, ou seja, todo texto apresentado por elas. Após você arrastar e soltar o elemento desejado dentro do construtor o mesmo virá com textos padrão que devem ser substituídos pelo seu conteúdo. Para fazer isso basta clicar no botão conteúdo e todas as partes textuais do elemento serão marcadas com uma borda pontilhada cinza. Ao clicar sobre o texto desejado é possível alterá-lo assim como nas sequência de imagens abaixo:

  • Botão Detalhes:

Este botão é o que apresenta as configurações técnicas do subelemento escolhido como cor, fontes, ícones, links, etc. Ao clicar sobre este botão todas as partes dos elementos na landing page que podem ser modificadas são marcadas com uma linha pontilhada cinza. Logo após, ao clicar sobre a parte do elemento a ser modificada o menu de estilos com as propriedades configuráveis daquele subelemento é exibido. Na sequência de imagens abaixo iremos alterar a cor do texto recém editado:

  • Textos em Negrito, Itálico e line-though (cortado por linha):

Quando se deseja alterar um texto com o botão conteúdo ativo a caixa de edição que é exibida no construtor pode possuir botões de alteração ou modificadores do texto a ser inserido, é possível escrever o novo texto em negritoitálico e line-through além dos botões de desfazer e refazer a última ação.

É importante citar que a depender do texto que se deseja editar esses modificadores podem ou não aparecer, este comportamento é normal visto que alguns subelementos não comportam o código de estilo do texto destes modificadores dentro de si. Com relação ao funcionamentos dos controles os mesmos funcionam em esquema “ativar e desativar”, ou seja, é necessário primeiro marcar o botão para somente depois escrever o texto desejado. Quando se digita o texto e na caixa e seleciona-o para somente depois clicar no modificador desejado o estilo não se aplica.

Para que o texto digitado deixe de ter o modificador basta clicar novamente sobre o botão e o mesmo é desativado. Quando está ativo o botão ficará mais escuro que os demais inativos como mostrado na sequência de imagens abaixo onde inserimos um texto modificado no elemento:

  • O editor de estilos:

O editor de estilos contém, além das propriedades editáveis do subelemento abas que nos permitem alterar não somente cores e espaçamento entre os elementos como ícones, links, animações, etc. Veja que nas imagens abaixo nós conseguimos através deste menu multiplicar a quantidade de ícones no elemento clicando sob ícone desejado e logo em seguida clicando no botão Clone. Com isso é possível customizar bastante o elemento escolhido para que o mesmo fique de acordo com o desejado:

  • Formulários:

Uma landing page pode conter formulários de captura para enviar leads para uma lista. Para isso basta arrastar um formulário dentre os muitos disponíveis no construtor. Existem dois tipos de formulários de captura: com e sem pupups. Formulários com pupups exibem o respectivo popup após a inscrição do lead através do formulário.

Para saber quais formulários possuem popups basta arrastar um formulário para dentro do pagebuilder com o botão Elementos selecionado e percorrer o mouse sobre o elemento para visualizar o botão “Mostrar popup” na tela.

Com a ajuda dos botões Conteúdo e Detalhes é possível editar o popup para mostrar uma mensagem de agradecimento ao novo lead adquirido como na imagem abaixo:

  • Adicionando campos ao formulário:

Todo formulário vem com campos pré-definidos mas nada nos impede de customizar os formulários para que eles possuam exatamente a quantidade de campos desejada. Para editar um formulário é necessário clicar em Detalhes e logo em seguida clicar em EDIT FORM. Após, um menu lateral com as propriedades do formulário aparecerá e navegando até a aba de nome Editor Form é possível, com apenas um clique inserir um novo campo no formulário.

 

 

Atenção: É importante ressaltar que o nome do campo no formulário deve ser o exato campo gerenciado em sua lista de armazenamento de leads da sua landing page. Para saber mais sobre campos de lista leia este tutorial aqui. Veja na imagem abaixo a atribuição do campo como e-mail:

  • Campo especial: Seleção

Para utilizar o elemento do tipo seleção (dropdown com múltiplas opções de escolha) é necessário primeiramente cadastrar um campo personalizado do tipo dropdown em sua conta ville Target que conterá as opções desejadas e os valores de cada opção. Para saber mais sobre campos personalizados clique aqui. Veja abaixo uma imagem abaixo o campo que criamos:

Após, com o campo inserido no formulário basta clicar em cima do campo e na opção nome escolher o nome do dropdown cadastrado nos campos personalizados.

Após isso podemos ver, no modo de visualização da página, que as opções cadastradas foram inseridas com sucesso.

  • Nomenclaturas especiais:

Alguns nomes são utilizados no construtor devido ou a sua característica puramente técnica como a inexistência de traduções para o português. Segue abaixo os nomes mais críticos:

  • Placeholder: É o nome que se da ao texto fantasma que popula o campo de um formulário até o mesmo ser preenchido com um texto real; por exemplo, caso um campo seja do tipo e-mail o placeholder do campo pode ser: “Digite aqui o seu e-mail”. O texto do placeholder desaparece logo após o lead começar a digitar algo no campo e aparece novamente caso o campo esteja vazio.
  • Popup: É o elemento que aparece na landing page sobre outros elementos e contém informações que podem ser ignoradas ou fechadas pois não pertencem ao fluxo natural de leitura da página e não interfere neste. No ville Target usamos popups em alguns formulários de captura.
  • Fonte: Fonte é a abreviação de código fonte, ele é todo o código gerado pelo construtor para que a landing page seja lida pelo navegador e exibida.

 

Abraço da equipe ville Target

Esse artigo foi útil?