Formulario de Suscripción por email para blogger

Para incentivar a suscribirse por email a los visitantes de nuestro blog, podemos agregar un formulario de suscripción por email para blogger. El widget que les traigo hoy día es muy bonito, y eso llamará la atención de tus visitantes, asiendo que haiga más posibilidad de que se suscriban a través de correo electrónico.

El formulario lo puedes ver funcionando en este mismo blog, fíjate en la sidebar.

Agregar formulario de suscripción por email en blogger

Ve a Diseño > Añadir un widget > elije > HTML/Javascript, y pega el siguiente código:

<style>
.mbt-email{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiX9pHRIBmWIk4i3I0sg1yxpALqGBy4lVsrtzk4EIaOJnxArf45tKFDNigVIc6mXzLdZvjiiA4t3O21lj4twLqjO1RzIYgNh5Aid514FvtJQWArIW1IK_cCUgQHZrFXEtn1QCEJ5Ks3Iz-1/s1600/email.png) no-repeat 0px 12px ;
width:300px;
padding:10px 0 0 55px;
float:left;
font-size:1.4em;
font-weight:bold;
margin:0 0 10px 0;
color:#686B6C;
}
.mbt-emailsubmit{
background:#9B9895;
cursor:pointer;
color:#fff;
border:none;
padding:3px;
text-shadow:0 -1px 1px rgba(0,0,0,0.25);
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
font:12px sans-serif;
}
.mbt-emailsubmit:hover{
background:#E98313;
}
.textarea{
padding:2px;
margin:6px 2px 6px 2px;
background:#f9f9f9;
border:1px solid #ccc;
resize:none;
box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1);
-moz-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1);
-webkit-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1); font-size:13px;
width:170px;
color:#666;}
</style>


<div class="mbt-email">
Suscríbete vía Email
<form action="http://feedburner.google.com/fb/a/mailverify" id="feedform" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=Pazosblogger-AyudaParaBlogs&amp;loc=es_es', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input gtbfieldid="3" class="textarea" name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Introduce tu correo aquí&quot;;}" onfocus="if (this.value == &quot;Introduce tu correo aquí&quot;) {this.value = &quot;&quot;;}" value="Introduce tu correo aquí" type="text" />
<input type="hidden" value="Pazosblogger-AyudaParaBlogs" name="uri"/><input type="hidden" name="loc" value="es_es"/>
<input class="mbt-emailsubmit" value="Enviar" type="submit" />
</form>
</div>

• Ahora, si tu quieres cambiar la imagen que lleva por defecto, cambia lo que esta en  color rojo, por la URL de tu propia imagen. 
• Donde dice Pazoblogger-Ayudaparablogs, que esta en color azul, cámbialo por el nombre de tu Feed. 

Una vez, haz realizado los pasos anteriores, ya tendrías que tener el widget funcionando. Si tienes algún problema con el widget deja un comentario para que te pueda ayudar.

Vía |  Mybloggertricks