CUADRO DE SUSCRIPCIÓN PARA BLOGGER Y WORDPRESS

CUADRO DE SUSCRIPCIÓN PARA BLOGGER Y WORDPRESS

Todos sabemos lo importante que tener un cuadro de suscripción en nuestro blog, ya que esto posibilita tener un grupo de personas interesadas en tu blog o en lo que propones. 

Feedburner es muy apropiado para que las personas sigan el feed de tu blog. Al momento que un usuario se suscriba automáticamente recibirá los post de actualización que vayas incorporando a tu sitio.  

Este gadget de suscripción es sencillo y puede servir para sitios elegantes y tranquilos. 

Para agregar este cuadro de suscripción necesitamos agregar un gadget en el sector que nos gustaría que aparezca. Trata de que este ubicado es un espacio que pueda ser visualizado en primera instancia por las personas. Además puedes repetir el cuadro, uno puede estar ubicado en una parte suprior y otro en la parte inferior del sitio. 

Una vez añadido el gadget copiamos el siguiente código: 

<style type='text/css'>
/* CSS Subscribe Box */
#subscribe-box {width:auto;max-width:300px;height:auto;background-color:#222;}
#subscribe-box p {font-family:&#39;Droid Sans&#39;;font-size:13px;color:#ccc;line-height:20px;padding:10px 20px 0 20px;margin:0;}
#subscribe-box .emailfield {padding:0px 20px 10px;}
#subscribe-box .emailfield input {background:#fafafa;color:#999;padding:10px;margin-top:10px;font-size:13px;font-family:&#39;Droid Sans&#39;;width:91%;border:0;border:none;transition:all 0.4s ease-in-out;}
#subscribe-box .emailfield input:focus {background:lightyellow;outline:none;border:none;color:#444;}
#subscribe-box .emailfield .submitbutton {background:#f56954;color:#fff!important;text-transform:uppercase;font-weight:bold;border:none;outline:none;width:99%;cursor:pointer;transition:all 0.4s ease-out;}
#subscribe-box .emailfield .submitbutton:active {outline:none;border:none;background:#444;color:#fff;}
#subscribe-box .emailfield .submitbutton:hover{background:#dc5e4b;color:#fff;}
#HTML98 h2 {border-bottom:4px solid #eee;}
#HTML98 h2 span {border-bottom:none;margin-bottom:0;}
</style>
<div id='subscribe-box'>
                <p>SUSCRIPCIÓN POR CORREO</p>
            <div class='emailfield'>
             <form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=AFusion&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>
              <input type='text' name='name' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Introduce tu nombre&quot;;}' onfocus='if (this.value == &quot;Introduce tu nombre&quot;) {this.value = &quot;&quot;;}' value='Introduce tu nombre'/>
              <input type='text' name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Introduce tu  correo&quot;;}' onfocus='if (this.value == &quot;
Introduce tu  correo&quot;) {this.value = &quot;&quot;;}' value='Introduce tu correo'/><input name='uri' type='hidden' value='Copia el feed de tu feedburner'/><input name='loc' type='hidden' value='es_ES'/>              
<input class='submitbutton' type='submit' value='Subscribete  Ahora!'/>
                </form>
                 </div>                
 </div>

Lo que deben de cambiar es donde dice 'copiar el feed de tu feedburner'. Para ello debes ir a tu cuenta de feedburner y copiar tal cual aparece entre comas el nombre de tu feed, trata de respetar este paso porque de lo contrario puede que te falle el proceso de suscripción.

Una cosa importante: Este cuadro de suscripción esta en español, por lo que todos los pasos que siga el usuario lo vera en español.

Espero que te sea útil y que lo aproveches.