MundoBlogger: Suscripción por email nativo en Blogger

Pages

Suscripción por email nativo en Blogger

Suscripción por email nativo en Blogger miércoles, 7 de diciembre de 2011

Blogger empieza con las novedades de este año, esta vez, presentando un nuevo gadget desuscripción por email o Seguir por correo electrónico como lo han llamado.

Funcionamiento

Al agregarlo, automáticamente agrega el blog a Feedburner, crea la URL del feed y la usa para la suscripción de correo.

El gadget se muestra con un sencillo formulario donde el lector puede escribir su dicción de email y confirmar su suscripción. Al parecer, el botón se adapta automáticamente a la paleta de colores del blog.

Configuración

Para configurar las opciones de la suscripción por email les recomiendo revisar nuestra Guía para ofrecer suscripción por email paso a paso.

Código

Como todos los widget de Blogger, se puede modificar el código del formulario buscando por el título o, en este caso, FollowByEmail. El código generado por el gadget es como el siguiente:

<b:widget id='FollowByEmail1' locked='false' title='Follow by Email' type='FollowByEmail'>
<b:includable id='main'>
  <b:if cond='data:title != &quot;&quot;'><h2 class='title'><data:title/></h2></b:if>
  <div class='widget-content'>
    <div class='follow-by-email-inner'>
      <form action='http://feedburner.google.com/fb/a/mailverify' expr:onsubmit='&quot;window.open(&quot;http://feedburner.google.com/fb/a/mailverify?uri=&quot; + data:feedPath + &quot;&quot;, &quot;popupwindow&quot;, &quot;scrollbars=yes,width=550,height=520&quot;); return true&quot;' method='post' target='popupwindow'>
        <span>
          <input class='follow-by-email-address' name='email' placeholder='Email address...' type='text'/>
        </span>
        <input class='follow-by-email-submit' type='submit' value='Submit'/>
        <input expr:value='data:feedPath' name='uri' type='hidden'/>
        <input name='loc' type='hidden' value='en_US'/>
      </form>
    </div>
  </div>
  <span class='item-control blog-admin'>
    <b:include name='quickedit'/>
  </span>
</b:includable>
</b:widget>

En él, yo recomiendo cambiar:

<input name='loc' type='hidden' value='en_US'/>

Por:

<input name='loc' type='hidden' value='es_ES'/>

Para que el mensaje de confirmación se muestre en español.

Estilos

Blogger agrega por defecto los siguientes estilos:

/*Contenedor general*/
.FollowByEmail .follow-by-email-inner {
    position: relative;
}
/*Campo de email*/
.FollowByEmail .follow-by-email-inner .follow-by-email-address {
    border: 1px inset;
    font-size: 13px;
    height: 22px;
    line-height: 22px;
    margin: 0;
    padding: 0 2px;
    width: 100%;
}
/* Botón de submit */
.FollowByEmail .follow-by-email-inner .follow-by-email-submit {
    -moz-border-radius: 2px 2px 2px 2px;
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.6);
    border: 0 none;
    color: #FFFFFF;
    font-size: 13px;
    height: 24px;
    margin: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 60px;
    z-index: 0;
}
.FollowByEmail .follow-by-email-inner input {
    font-family: arial,sans-serif;
}

Sobra decir que estos se pueden sobre escribir desde el código de la plantilla si se desea personalizar.

Un nuevo gadget que facilita la vida, pero que no hace algo realmente haga falta para el usuario Blogger, como más condicionales en la plantilla o un alojamiento de archivos.