Se você encontrou esse artigo, é sinal que você ainda usa o antigo editor de páginas do Hotmart Pages... 🕸️🕷️
Nesse caso, eu preciso te dar um recado muito importantes:
- A Hotmart já lançou uma versão atualizada e mais robusta do editor de páginas.
Nessa nova versão, o Hotmart Pages conta com mais de 80 modelos de páginas prontos para você editar e publicar, alguns deles assinados por grandes nomes do mercado digital. Além de contar com o apoio de uma Inteligência Artificial (AI) que te ajuda a criar páginas em poucos instantes. Clique aqui e comece a utilizar agora mesmo.
A página captura tem o intuito de capturar dados de contato de um lead.
Pode ser e-mail, nome e telefone, permitindo a criação de uma lista de leads.
Neste vídeo você aprenderá como construir uma página de Inscrição:
Índice:
- Funcionalidade - Plano de Fundo
- Funcionalidade - Cor da Caixa
- Funcionalidade - Logo
- Funcionalidade - Título
- Funcionalidade - Campo de Texto
- Funcionalidade - Botão CTA
- Funcionalidade - Box Social
Você é aquela pessoa que prefere ler o passo a passo? Nós te entendemos, segue a nossa versão em texto =)
Ao fazer o login no Hotmart Pages, a primeira tela que você irá visualizar será a Home do Hotmart Pages. Clique em "Criar Página” em "Crie Páginas que Convertam".
Ou, se desejar, clique em "Minhas Páginas" e em “+ Páginas” e assim você terá diversas opções.
Desde criar uma “Nova Página em Branco”, que é um modo onde você será direcionado para a edição da página sem nenhum template para você trabalhar do zero.
Ou personalizar qualquer template disponível, escolhendo diversas seções diferentes para criar a página de inscrição com sua cara.
Para exemplo desse guia, vamos utilizar um template específico de inscrição.
Para isso, será selecionado a tag “Inscrição”, onde serão mostrados os templates específicos para capturar seus leads.
Iremos escolher a “Klickpages – Inscrição Clássica” e começar a fazer a edição da página.
Funcionalidade - Plano de Fundo
Vamos começar pelo “Plano de Fundo” da página.
Você pode clicar no próprio template ou no próprio plano de fundo para visualizar todas as opções de edição.
Clique na engrenagem do “Plano de Fundo” para começar.
Na opção “Exibir Imagem”, desativa-se a visualização no ícone do olhinho, assim, a imagem é retirada ficando uma cor sólida.
A configuração “Fixar Imagem” é uma alternativa para deixar uma imagem fixada no fundo.
Porém, é importante ressaltar que em sistemas operacionais iOS, que são os iPhones e iPads, essa opção não funciona, pois a tecnologia que o Hotmart Pages usa não tem suporte no iOS, portanto, sugerimos que deixe esse item desativado se você utilizar aparelhos com esse sistema operacional.
Depois, são opções em relação a como você quer deixar sua imagem como plano de fundo. Você pode colocar uma cor de máscara em cima da imagem ou desativar essa máscara.
Vamos trocar a imagem de fundo por outra.
Então, clica em “Imagem” e selecionar na minha Central de Mídias uma na qual já foi realizado o upload. Se ainda não fez o upload, basta clicar em "Fazer Upload” e escolher uma imagem que está em seu computador.
Depois de selecionar a imagem, é possível mudar a cor da máscara para a que eu quiser e mexer na opacidade. Depois de escolhida, só aceitar na setinha para confirmar.
Já na opção de “Habilitar Delay”, sua seção irá aparecer de acordo com o tempo configurado, assim, quando o visitante entrar na página esse tempo começa a contar para que a seção apareça.
Funcionalidade - Cor da Caixa
Agora, voltando para as opções de edição da página, tem “Cor da Caixa” onde é possível colocar a cor que deseja no fundo da inscrição.
Funcionalidade - Logo
Em “Logo”, é importante respeitar o tamanho que a seção está informando, no caso, o tamanho ideal da Logo nessa seção é de 201 px x 29 px. Lembrando que a imagem tem que ter no máximo 1 mb.
A imagem da sua logo pode ser escolhida tanto direto do seu computador ou a partir de um link de imagem externa. Vou escolher uma imagem que já tenho na Central de Mídias.
Depois de escolhida a imagem, podem ser editadas a opacidade, tamanho e arredondamento. Como a logo é branca, vamos alterar a cor de fundo selecionando uma nova.
Basta clicar com o mouse no fundo da inscrição que já mostra a edição. Depois de escolhida a cor, só confirmar.
Funcionalidade - Título
Vamos modificar o título da página de inscrição através da edição inline, ou seja, selecionando o texto diretamente.
Pode fazer a mesma edição no texto a seguir ou se desejar, ocultar o texto. Mas aqui iremos mantê-lo trocando apenas a informação. Selecione todo o conteúdo para alterar.
É possível trocar as cores dos textos selecionando um por vez e escolhendo a cor que desejar.
Feito isso, é possível modificar as fontes do seu texto. O Hotmart Pages oferece diversas opções de fonte para customizar a página de acordo com seu gosto. Basta selecionar todo o texto e escolher a fonte que desejar.
Funcionalidade - Campo de Texto
Em “Digite seu e-mail”, você pode personalizar esse campo, trocando o texto do “Placeholder”, além de deixar como obrigatório ou não esse campo.
Lembrando que essas mudanças nos campos são possíveis de serem realizadas diretamente na edição da página.
Se for integrar a página com o formulário do Send para capturar seus leads, não é possível modificar o texto dos campos dos formulários na configuração do mesmo.
Se você integra a página com outra ferramenta de e-mail marketing, é necessário verificar se essa ferramenta possui esse tipo de customização.
Funcionalidade - Botão CTA
No botão CTA, vou modificar a cor acessando “Cor de Fundo” e vou salvar na setinha.
Posso também modificar o texto do CTA, selecionando o texto para edição como foi realizado nos textos anteriores.
Abaixo do botão CTA, é possível também trocar as informações do texto, ocultar, mudar a cor e fonte.
Funcionalidades - Box Social
Na segunda parte, onde contém o “Box Social”, também é possível modificar a “Cor de Fundo” e salvar.
Nas configurações abaixo, pode ser configurado suas redes sociais, como Youtube e Facebook ou, se desejar, pode ocultar cada uma.
Clicando na engrenagem do Youtube, basta inserir a ID do seu canal. Depois a configuração vai de acordo com seu gosto.
Voltando, é possível também configurar o Facebook inserindo a URL da sua página.
Nos links “Termo de Uso”, “Política de Privacidade” e “Seja Nosso Afiliado”, o link “Seja Nosso Afiliado” será ocultado nesse exemplo e vamos mexer no “Termos de Uso” e “Política de Privacidade”.
Em “Termos de Uso”, se você já tiver uma página criada basta colar a URL apagando o “jogo da velha” (#) e inserindo o link.
Se preferir, pode até mudar para opção de “Dois Passos (Pop Up)” ou a opção de escolher uma seção específica da minha página se caso ela tivesse mais opções.
Agora vamos alterar a cor do “Termos de Uso” selecionando todo o texto.
Além da cor, pode alterar o tamanho do texto, o espaçamento e modificar a formatação, como deixar em negrito, itálico ou sublinhado.
É possível formatar o alinhamento e também escolher uma fonte específica para o texto “Termos de Uso”.
As configurações para o texto de “Política de Privacidade” são exatamente iguais.
Se caso você ainda não possui as páginas citadas, clique aqui para seguir o passo a passo.
Por fim, esse último texto na seção também pode ser modificado conforme foi realizado nos anteriores.
Para finalizar, vou configurar o botão CTA integrando com um formulário.
Dentro da edição do botão, tenho a opção de “Habilitar Delay”, que é um tempo de espera entre o visitante entrar na página e o botão aparecer.
Logo abaixo tem a opção de selecionar o item de “Formulário Simples”, onde é configurado um serviço de e-mail que pode ser por conta integrada ou código HTML.
Tem o modo “Dois Passos (Pop Up)” quando a pessoa clica no botão, abre um pop-up onde a pessoa vai inserir seus dados.
Se a sua integração de ferramenta de e-mail marketing é o Send, além da possibilidade de selecionar “Formulário Simples”, também é possível escolher a opção “Klicksend” e selecionar o formulário que desejar.
Nesse tutorial será escolhida a opção “Formulário Simples” e escolher o “Serviço de E-mail”.
Foi escolhido o modo de importação de formulário do próprio Send, aqui foram escolhidos os campos “Primeiro Nome” e “Email”.
É importante que já tenha registrado seu serviço de e-mail para sua página funcionar. Se ainda não registrou, temos tutoriais específicos linkados abaixo.
Como integrar o Send com o Hotmart Pages
Integração com o Klicksend por formulário
Assim que você fizer suas escolhas, basta clicar em “Salvar” e “Publicar” para que sua página entre no ar.
Agora, só clicar em “Preview” para ver como sua página ficou.
Pronto! A sua página de inscrição está configurada.
Se tiver dúvidas, entre em contato com o nosso Suporte.