20/02/2016

| |

Caixinha Newsletter personalizada.

Tenha no seu blog uma Caixinha Newsletter Personalizada e deixe que o seu leitor acompanhe o seu blog com mensagens pelo email.

Olá,queridos amigos(as)!!

Passando para dar uma dica muito importante: Como colocar uma Caixinha Newsletter Personalizada no blog.

Você sabe que é muito importante ter esse recurso no blog,pois isso aproxima o seu leitor e deixe-o integrado com o que acontece no seu blog.Ele receberá mensagens por email, assim que você fizer uma nova postagem no seu blog.


Esse tutorial eu vi no blog Follow Your Dreams e achei muito importante compartilhar com vocês.

Eu escolhi 2 modelos para vocês e caso vocês queiram mais, clica no nome do blog Follow Your Dreams acima. Vamos lá???


1º modelo:




<style type="text/css">
#LS-Newsletter4-Box {
background: url(https://lh3.googleusercontent.com/-VrmTAll-DTI/Vk4YtnIwPMI/AAAAAAAAD_k/jfxkZQAMOCI/s300-Ic42/Newsletter1.png) no-repeat scroll center center transparent;
height: 300px;
width: 300px;
}
form#LS-Newsletter4-Form {
display: block;
margin: 0;
padding-left: 50px;
padding-top: 80px;
}
form#LS-Newsletter4-Form #s {
background: transparent;
border: none;
color: #444242;
font-family: Arial;
font-size: 14px;
font-style: italic;
height: 28px;
margin-top: 37px;
vertical-align: top;
width: 240px;
outline:0px;
position: relative;
left: -25px;
}
form#LS-Newsletter4-Form #d {
background: transparent;
border: none;
color: #444242;
font-family: Arial;
font-size: 14px;
font-style: italic;
height: 28px;
margin-top: 38px;
vertical-align: top;
width: 240px;
outline:0px;
position: relative;
left: -25px;
}
form#LS-Newsletter4-Form #sbutton {
background: transparent;
border: none;
cursor: pointer;
height: 43px;
position: relative;
left: 32px;
top: 25px;
width: 140px;
border-radius: 5px;
}
</style>
<div id="LS-Newsletter4-Box">
<form id="LS-Newsletter4-Form" action="https://feedburner.google.com/fb/a/mailverify?uri=blogspot/FEED-ID" method="post">
<input id="d" name="name" value="Seu nome"
onfocus='if (this.value == "Seu nome") {this.value = ""}'
onblur='if (this.value == "") {this.value = "Seu nome";}'/>
<input type="email" id="s" name="email" value="Seu e-mail"
onfocus='if (this.value == "Seu e-mail") {this.value = ""}'
onblur='if (this.value == "") {this.value = "Seu e-mail";}'/>
<input type="image" src="http://3.bp.blogspot.com/-D4DL8TMRtd0/UCuQt-AVn3I/AAAAAAAAJz8/K1sjzXIxyQk/s1600/blank.gif" id="sbutton"/>
</form>
</div>

Copie o código e vá para layout+adicionar um gadget+Html/Javascript e cole.Na parte vermelha, você irá substituir pelo ID DO SEU FEED. Saiba como saber o seu ID depois do segundo modelo.

2º modelo:


 Essa caixinha está na barra lateral da Agenda dos Blogs.
<style type="text/css">
#LS-Newsletter4-Box {
background: url(https://lh3.googleusercontent.com/-5lpOyjR-4DQ/Vk4bPvtKkuI/AAAAAAAAEAM/IE6VsXu66y0/s300-Ic42/Newsletter6.png) no-repeat scroll center center transparent;
height: 300px;
width: 300px;
}
form#LS-Newsletter4-Form {
display: block;
margin: 0;
padding-left: 50px;
padding-top: 80px;
}
form#LS-Newsletter4-Form #s {
background: transparent;
border: none;
color: #444242;
font-family: Arial;
font-size: 14px;
font-style: italic;
height: 28px;
margin-top: 37px;
vertical-align: top;
width: 240px;
outline:0px;
position: relative;
left: -25px;
}
form#LS-Newsletter4-Form #d {
background: transparent;
border: none;
color: #444242;
font-family: Arial;
font-size: 14px;
font-style: italic;
height: 28px;
margin-top: 38px;
vertical-align: top;
width: 240px;
outline:0px;
position: relative;
left: -25px;
}
form#LS-Newsletter4-Form #sbutton {
background: transparent;
border: none;
cursor: pointer;
height: 43px;
position: relative;
left: 32px;
top: 25px;
width: 140px;
border-radius: 5px;
}
</style>
<div id="LS-Newsletter4-Box">
<form id="LS-Newsletter4-Form" action="https://feedburner.google.com/fb/a/mailverify?uri=blogspot/FEED-ID" method="post">
<input id="d" name="name" value="Seu nome"
onfocus='if (this.value == "Seu nome") {this.value = ""}'
onblur='if (this.value == "") {this.value = "Seu nome";}'/>
<input type="email" id="s" name="email" value="Seu e-mail"
onfocus='if (this.value == "Seu e-mail") {this.value = ""}'
onblur='if (this.value == "") {this.value = "Seu e-mail";}'/>
<input type="image" src="http://3.bp.blogspot.com/-D4DL8TMRtd0/UCuQt-AVn3I/AAAAAAAAJz8/K1sjzXIxyQk/s1600/blank.gif" id="sbutton"/>
</form>
</div>



OBSERVAÇÃO:  O único trecho que você irá alterar é o que estiver em vermelho, que você colocará o ID do seu FEED.

 <form id="LS-Newsletter4-Form" action="https://feedburner.google.com/fb/a/mailverify?uri=blogspot/FEED-ID" method="post">


Como encontrar o seu ID do FEED:

 

 Clique em LAYOUT+ADICIONAR UM GADGET+SEGUIR POR EMAIL

Copie apenas o nome após a barra, esse é o seu ID DO FEED.

Depois que você alterar no código o ID DO FEED, você salvará e terá uma caixinha personalizada no seu blog.

Se você tiver outra caixinha, pode excluí-la, pois a nova estará funcionando normalmente.


E ai queridas?? Gostaram??
Deixem seus comentários que são importantes para o blog.Bjss!!


 

Sobre o Autor:
Magda moreira Meu nome é Magda Moreira, sou professora e atualmente estou fazendo o curso de Pedagogia.Sou blogueira de coração e uma curiosa da internet.Meu blog Agenda dos Blogs tem como objetivos:Divulgação de blogs gratuitamente e elaboração de projetos e tutoriais voltados aos blogueiros.

6 comentários:

  1. Boa Noite Magda!Gostei muito da Caixinha Newsletter Personalizada,vou colocar no meu blog,a cada dia meu blog vai evoluindo graças a você,tenho muito a aprender e muito a te agradecer.Bjs no♥ http://wwwmazeblogspotcom.blogspot.com.br/

    ResponderExcluir
  2. Ótima dica, obrigada. Tem também pronto já nas gadgets no layout do blogger, eu pus ele já que não entendo tanto de html rs
    Beijos.

    ResponderExcluir
  3. MUITO OBRIGADA MAGDA POR COMPARTILHAR MAIS ESTA DICA 1 JÁ COLOQUEI NO MEU BLOG KKKKKKKKKKK BJS

    ResponderExcluir
  4. Bom dia
    Compartilhando ja tenho no meu blog.
    Beijocas
    Deus aben;óe

    ResponderExcluir

Deixe um comentário, que ficarei muito feliz!!!!!
Abraços á todos!!!!