Pop-up de Newsletter

Você já conhece o pop-up de newsletter da iSET? Se não, pode estar perdendo ótimas chances de reter clientes!

O pop-up de newsletter é basicamente um pop-up que aparece para o visitante da sua loja virtual ao tentar sair da página pela primeira vez.

O pop-up conta com espaço para um banner, um título, um subtítulo, formulário com Nome e endereço de e-mail e um botão “Cadastrar!”.

Como usar o pop-up de newsletter

Para ter essa implementação no seu e-commerce, basta solicitar ao nosso time de suporte! Isso pode ser feito via ticket de suporte, chat online ou telefone!

Para abrir um ticket de suporte, acesse seu iCA (Área do Cliente), clique em “Chamados de Suporte >> Abrir um chamado”. Escolha a opção “Suporte” e formalize seu pedido!

Para entrar em contato com o nosso suporte via chat online, acesse esse link! O chat estará no canto inferior direito.

Deseja contatar o suporte pelo telefone? Nosso número de contato é: 4063-6001 (para as capitais 11, 21, 31, 41, 51 e 61).

Personalização do pop-up de newsletter

Depois disso, realize a personalização do seu pop-up de newsletter para que ele fique com a identidade visual da sua marca!

Para isso, acesse o painel administrativo da sua loja virtual, clique em “Ferramentas >> Banners >> Publicidade” e então clique no ícone de lápis do “Banner Newsletter” para começar a editá-lo!

Antes de começarmos é importante lembrar que toda a edição do pop-up é via código HTML. Você não deverá ter dificuldade em realizar as edições se seguir todos os passos deste tutorial. Entretanto, caso haja dúvidas, não hesite em entrar em contato com nosso setor de suporte.

Imagem do Pop-up

Vamos começar pela edição da imagem do pop-up? Bom, o tamanho ideal da imagem é 1000 x 250px. Tenha certeza que a imagem que você deseja subir esteja nestas dimensões.

Depois disso, vá em  “Ferramentas >> Gerenciador de arquivos” para que possamos subir a imagem desejada no sistema de sua loja virtual.

Uma nova página irá abrir, clique no primeiro ícone na barra superior para fazer o upload da sua imagem.

Após isso, volte para o Gerenciador de Arquivos, clique com o botão direito do mouse sobre a imagem, clique em “Mostrar URL” e então copie esta URL.

Agora, voltando em “Ferramentas >> Banners >> Publicidade”. Nas configurações do  “Banner Newsletter”, clique em “HTML >> Código-Fonte”.

É nessa parte em que você poderá fazer as edições e personalizações do seu pop-up de newsletter.

Atenção!

Cuidado ao fazer a edição do Código-Fonte! Caso tenha qualquer dúvida, não hesite em entrar em contato com o nosso time de suporte.

Imagem

Para realizar a edição da sua imagem, vá até a linha 10 do código. 

Linha 10:

<div class=”image_newsletter”><img alt=”banner newsletter” src=”https://cdn.iset.io/assets/54235/arquivos/imagens/newsletter.jpg” /></div>

Cole a URL da sua imagem, que pagamos no passo anterior, entre “src=” e “/></div>” no lugar da URL padrão: https://cdn.iset.io/assets/54235/arquivos/imagens/newsletter.jpg

Título do Pop-up

Agora, para mudar o título do pop-up, vá até a linha 13.

Linha 13:

<h3>Que tal R$20 reais de desconto para sua primeira compra?</h3>

Mude o texto o texto para o que desejar entre “<h3>” e “</h3>” no lugar do texto “Que tal R$20 reais de desconto para sua primeira compra?”.

Subtítulo do Pop-up

Para o mudar o subtítulo do pop-up, vá até a linha 15.

Linha 15:

<p>Cadastre-se na nossa lista e receba seu cupom de R$ 20 para usar em nossa loja.</p>

Mude o texto para o que desejar entre “<p>” e “<p>” no lugar do texto “Cadastre-se na nossa lista e receba seu cupom de R$ 20 para usar em nossa loja.”.

Texto do botão

Para o mudar o texto do botão, vá até a linha 33.

Linha 33:

<button class=”btn btn-success” type=”submit”>Cadastrar!</button><span></span></form>

Mude o texto para o que desejar, no lugar de “Cadastrar!”.

Cor do botão

Para o mudar a cor do botão, vá até a linha 129.

Linha 129:

background: var(–custom-button-primary-color);

No lugar de “var(–custom-button-primary-color)”, cole o Código hexadecimal da cor que deseja que seja a cor do botão.

Texto de confirmação

O visitante, ao clicar no botão de “Cadastrar!”, visualiza a mensagem de confirmação “Sucesso!”, caso o e-mail informado não tenha cadastro e “E-mail já cadastrado”,  caso o e-mail informado já tenha cadastro. Se quiser, você pode trocar essa mensagem também.

Mensagem de “e-mail já cadastrado”

Para mudar a mensagem de “E-mail já cadastrado”, vá até a linha 56.

Linha 56:

$(‘.conteudo_news’).append(‘<div class=”message news-erro”><span>e-mail já cadastrado</span></div>’);

Mude o texto para o que desejar, no lugar de “e-mail já cadastrado”.

Mensagem de “sucesso”

Para mudar a mensagem de “sucesso”, vá até a linha 59.

Linha 59:

$(‘.conteudo_news #newsletter_modal’).prepend(‘<div class=”message news-sucesso”><span>SUCESSO!</span></div>’);

Mude o texto para o que desejar entre, no lugar de “SUCESSO!”.

Relembrando que, caso precise de ajuda, entre em contato com o nosso suporte!

Para conferir dicas e vantagens de como utilizar o pop-up de newsletter em sua loja virtual, acesse o tutorial completo em nosso treinamento por este link!

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *