A importância de ter uma newsletter no seu website é inquestionável nos dias de hoje, mas também é importante saber como criar uma newsletter e uma mailing list de qualidade e saber como a segmentar. A segmentação da mailing list tem sido alvo de alguma discussão, pelo que deixamos a decisão para si. Neste artigo vamos-lhe mostrar como criar uma newsletter diária e semanal utilizando WordPress e o serviço Mailchimp que tem um plano gratuito. Ao fazer a segmentação dos seus subscritores você estará a certificar-se que enviará informações com uma base diária a quem pretende realmente estar atualizado dia a dia com os novos conteúdos e enviará semanalmente as novidades a quem pretende apenas receber uma compilação de uma semana de conteúdos. Fornecer a opção de newsletter semanal é uma alternativa para que os usuários que se sintam incomodados com emails diários não saiam da sua newsletter! Recomendamos também a leitura do seguinte artigo: Plugins de Newsletter para WordPress.
1. CRIAR CONTA
O primeiro passo é criar uma conta no serviço Mailchimp. Depois de criada a conta, faça login e na navegação presente no topo da página clique em “Lists”. Aí será apresentada uma tela onde é sugerido que veja um vídeo de ajuda ou para criar uma nova lista.
Clique em Create Your First List e preencha as informações necessárias:
Por fim clique em Save e a sua lista será criada.:
2. CRIAR GRUPOS
Este passo consiste na criação de um novo grupo para utilizar na nossa mailing list, e para criar um novo grupo clique no botão de ferramentas da lista criada e de sguida clique em Create Group:
Agora preencha os campos com os dados necessários:
Clique em save e o seu grupo foi criado:
3. CRIAR FORMULÁRIO
Para que sejam introduzidos os emails na nossa lista é necessária a utilização de um formulário para o efeito. Felizmente Mailchimp fornece um código que pode ser utilizado diretamente sem necessidade de termos de criar código de raiz para o efeito. Assim, para obter o código, no menu clique em Create Forms:
Como aquilo que pretendemos é inserir um formulário em um website, podemos utilizar o formulário específico para isso, clicando em For Your Website -> Signup Form Embed Code. Na nova tela, do lado esquerdo irá encontrar três opções para o formulário: Super Slim Form, Classic Form e Naked Form. Uma vez que pretendemos alterar a estilização do formulário, vamos optar por escolher a Naked Form, que vem já sem qualquer CSS ou Javascript.
Assim, depois de selecionar Naked Form, selecione as opções de acordo com a imagem.
Por fim clique em Create Embed Code para atualizar o código e copie o código presente no fundo da página dentro do campo de texto:
4. INSERIR O CÓDIGO
Agora vamos entrar na parte da personalização da instalação WordPress, onde vamos introduzir o código criado anteriormente no serviço Mailchimp. Assim, vamos introduzir o nosso formulário na sidebar do tema, pelo que para fazer esta alteração terá de localizar o ficheiro sidebar.php presente dentro do diretório do seu theme WordPress:
Edite-o e insira o código obtido no Mailchimp no local onde pretender que o mesmo apareça:
<form action="http://escolacriatividade.us2.list-manage.com/subscribe/post?u=1c1709ec6634c58720a7807e3&id=897894b3cc" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank">
<input type="text" value="Insira o seu email" onblur="if (this.value == '') {this.value = 'Insira o seu email';}" onfocus="if (this.value == 'Insira o seu email') {this.value = '';}" name="EMAIL" class="required email emailupdatesinput" id="mce-EMAIL" />
<input type="submit" value="Subscrever" name="subscribe" id="mc-embedded-subscribe" class="button subscribesubmitbutton" />
<input type="checkbox" checked="checked" value="1" name="group[12257][1]" id="mce-group[12257]-12257-0">
<label for="mce-group[12257]-12257-0">Diario</label>
<input type="checkbox" checked="checked"value="2" name="group[12257][2]" id="mce-group[12257]-12257-1">
<label for="mce-group[12257]-12257-1">Semanal</label>
</form>
Se reparar fizemos algumas alterações que vão possibilitar tornar o nosso formulário de subscrição mais atrativo para os visitantes, tendo removido as divs e a label para o campo do email. Desta forma o campo de e-mail irá ser mostrado vazio sem nenhuma informação. então para melhorar um pouco mais vamos substituir e inserir um novo código para o campo de e-mail:
<input type="text" value="Insira o seu email" onblur="if (this.value == '') {this.value = 'Insira o seu email';}" onfocus="if (this.value == 'Insira o seu email') {this.value = '';}" name="EMAIL" class="required email emailupdatesinput" id="mce-EMAIL" />
Desta forma será mostrado um texto dentro do campo de mail que será removido quando o visitante clicar no mesmo, o que de certa forma se torna necessário para dar uma indicação uma vez que removemos a label do campo de email.
E neste momento temos o código inserido e a funcionar!
5. ESTILIZAÇÃO
Esta é a altura de introduzirmos a nossa própria estilização, e para isso é necessário introduzir algumas alterações no código de modo a inserir os id’s da estilização. Então, vamos criar uma div para o botão de subscrição e para as checkboxes, não só para tornarmos o formulário mais bonito como também adequá-lo ao layout da nossa página:
<div id="secondary" class="widget-area">
<form action="http://escolacriatividade.us2.list-manage.com/subscribe/post?u=1c1709ec6634c58720a7807e3&id=897894b3cc" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank">
<div class="subscribe">
<input type="text" value="Insira o seu email" onblur="if (this.value == '') {this.value = 'Insira o seu email';}" onfocus="if (this.value == 'Insira o seu email') {this.value = '';}" name="EMAIL" class="required email emailupdatesinput" id="mce-EMAIL" />
<input type="submit" value="Subscrever" name="subscribe" id="mc-embedded-subscribe" class="button subscribesubmitbutton" />
<div class="clear"></div>
<br /> <br />
<div class="subscribecheckboxes">
<input type="checkbox" checked="checked" value="1" name="group[12257][1]" id="mce-group[12257]-12257-0">
<label for="mce-group[12257]-12257-0">Diario</label>
<input type="checkbox" checked="checked"value="2" name="group[12257][2]" id="mce-group[12257]-12257-1">
<label for="mce-group[12257]-12257-1">Semanal</label>
</div>
</div>
</form>
</div>
Se verificar, sem a estilização o formulário fica com o seguinte aspeto:
Agora localize o ficheiro style.css presente dentro do diretório do seu theme WordPress:
Edite-o e insira o seguinte código:
.subscribe { width: 280px; height: 80px; border: none; margin: 0 0 60px 0;}
.subscribecheckboxes {margin: 20px 0 0 0; font-family: 'ProximaNovaRegular', sans-serif; font-size: 14px; color: #626262;}
.secondcheckbox {margin: 0 0 0 28px;}
.emailupdatesinput { width: 150px; height: 32px; border: none; font-family: Georgia, serif; font-size: 14px; font-style: italic; color: #949494; padding: 0 10px 0 10px; float: left;}
.subscribesubmitbutton { background: #D6433B; height: 40px; border: none; width: 100px; margin: -1px -60px 0 0; float: left; font-family: 'ProximaNovaRegular', sans-serif; font-size: 12px; color: #ffffff; text-transform: uppercase; padding: 0 1px 0 0; cursor: pointer;}
Neste momento com a estilização inserida, o formulário tem o seguinte aspeto:
6. CRIAR CAMPANHAS
Uma vez que já criamos a lista, os grupos e inserimos o formulário no nosso website, é altura de criar uma campanha para o envio dos emails. Para isso, dirija-se a Campaigns no menu principal e de seguida clique em Create Campaign -> RSS-Driven Campaign. Será então levado para uma tela onde terá de inserir o URL do feed RSS do seu website e escolher a periodicidade do envio. Primeiro escolhemos o envio diário:
No passo seguinte teremos de escolher o segmento para o qual queremos enviar:
E o processo é repetido de forma igual para o segmento semanal!
Abraço!
