La suscripción por email es uno de los asuntos que mas nos interesa a los bloggeros ya que por medio de esta función ofrecemos una manera muy facil a nuestros lectores de recibir nuestro nuevo contenido,pues atendiendo a esta situación hoy les presento un truco en el cual un pequeña caja de suscripción por correo que al hacer click sobre ella se despega una ventana modal muy elegante.

 

Subscribe

emailSuscribete y recibe las ultimas actualizaciones de este blog en tu correo electronico.

 

Un widget de REDEANDO


Para añadir este truco solo debes pegar el siguiente codigo como un gadget (en HTML/JavaScript):

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<style type="text/css">.subscribe:hover{opacity:0.8} #subscribe-button{background:url(https://lh6.googleusercontent.com/-QyMynCqQVHk/UBbF11mYi9I/AAAAAAAAFEk/20wSyGCxLEM/s150/rss-email.png)top left;padding-top:15px;width:150px;height:150pxfloat: center;position:relative;z-index: 999;}#subscribe-widget{display:none;}#subscribe-widget{display:none;}/* Overlay */    #hb-overlay{background-color:#000;}/* Container */    #hb-container{min-height:350px;min-width:500px;color:#222;background-color:#fff;border:4px solid #ddd;}#hb-container .hb-data{padding:8px;}#hb-container a.hbCloseImg{background:url(http://3.bp.blogspot.com/-XLFE72b5Ox4/T6z5k5ntCjI/AAAAAAAABuU/4U_YU_rNXOQ/s1600/hb-close-button.png) no-repeat;width:25px;height:29px;display:inline;z-index:3200;position:absolute;top:-15px;right:-16px;cursor:pointer;}#description{color: #000000;font-family: century gothic;font-size: 18px;font-weight: bold;}#description img{float: left;height: 80px;padding: 0 25px 0 10px;width: 80px;}#hbfollowForm{padding: 15px;}#hbfollowForm p{margin: 0 0 10px;}#hbfollowForm input:not([type="checkbox"]){width: 93%;margin-top: 4px;margin-bottom: 20px;padding: 10px 5px 10px 25px;border: 1px solid rgb(178, 178, 178);-webkit-appearance: textfield;-webkit-box-sizing: content-box;-moz-box-sizing : content-box;box-sizing : content-box;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;-webkit-box-shadow: 0px 1px 4px 0px rgba(168, 168, 168, 0.6) inset;-moz-box-shadow: 0px 1px 4px 0px rgba(168, 168, 168, 0.6) inset;box-shadow: 0px 1px 4px 0px rgba(168, 168, 168, 0.6) inset;-webkit-transition: all 0.2s linear;-moz-transition: all 0.2s linear;-o-transition: all 0.2s linear;transition: all 0.2s linear;}#hbfollowForm input:not([type="checkbox"]):active, #hbfollowForm input:not([type="checkbox"]):focus{border: 1px solid rgba(91, 90, 90, 0.7);background: rgba(238, 236, 240, 0.2);-webkit-box-shadow: 0px 1px 4px 0px rgba(168, 168, 168, 0.9) inset;-moz-box-shadow: 0px 1px 4px 0px rgba(168, 168, 168, 0.9) inset;box-shadow: 0px 1px 4px 0px rgba(168, 168, 168, 0.9) inset;}#hbfollowForm .button input{background: none repeat scroll 0 0 #3D9DB3;border: 1px solid #1C6C7A;border-radius: 3px 3px 3px 3px;box-shadow: 0 1px 6px 4px rgba(0, 0, 0, 0.07) inset, 0 0 0 3px #FEFEFE, 0 5px 3px 3px #D2D2D2;color: #FFFFFF;cursor: pointer;font-family:'Arial Narrow', Arial, sans-serif;font-size: 24px;margin-bottom: 10px;padding: 8px 5px;text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);width: 30%;float: right;}#hbfollowForm .button input:hover{background: #4ab3c6;text-decoration: none;}#hbfollowForm .button input:active, #hbfollowForm .button input:focus{background: rgb(40, 137, 154);position: relative;top: 1px;border: 1px solid rgb(12, 76, 87);-webkit-box-shadow: 0px 1px 6px 4px rgba(0, 0, 0, 0.2) inset;-moz-box-shadow: 0px 1px 6px 4px rgba(0, 0, 0, 0.2) inset;box-shadow: 0px 1px 6px 4px rgba(0, 0, 0, 0.2) inset;}.hbFollowFooter{text-align: center;font: 10px Tahoma, Helvetica, Arial, Sans-Serif;padding: 7px 0;margin-top: 80px;text-shadow: 0px 2px 3px #555;position: absolute;width: 500px;}.hbFollowFooter a{color: #222;text-decoration: none;}.hbFollowFooter a:hover{color: #fff;}<!--[if lt IE 7]> #hb-container a.hbCloseImg{background:none;right:-14px;width:22px;height:26px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://3.bp.blogspot.com/-XLFE72b5Ox4/T6z5k5ntCjI/AAAAAAAABuU/4U_YU_rNXOQ/s1600/hb-close-button.png', sizingMethod='scale');}#hbfollowForm input{padding: 10px 5px 10px 32px;width: 93%;}#hbfollowForm input[type=checkbox]{width: 10px;padding: 0;}<![endif]--></style><center><div id="subscribe-button"><center><img class="sinborde" src="http://www.miltrucosblogger.com/wp-content/uploads/2012/08/rw2lNY1343666496.png"></center><a class="subscribe" href="#"><img class="sinborde" src="http://www.miltrucosblogger.com/wp-content/uploads/2012/08/botazul1.png" height="105" width="105"></a></div></center><div id="subscribe-widget"><div id="hbfollowForm"><img alt="Subscribe" border="0" float="center" src="http://www.miltrucosblogger.com/wp-content/uploads/2012/08/suscribete-2520-2520REDEANDO-300x61.png" /><div id='description'><img alt="email" border="0" src="http://www.miltrucosblogger.com/wp-content/uploads/2012/08/iconoemail-2520-2520REDEANDO.png" />Suscribete y recibe las ultimas actualizaciones de este blog en tu correo electronico.</div><form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=Redeando', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"><input name="email" placeholder="Escribe tu Email..." required="required" type="text" /><input name="uri" type="hidden" value="NOMBRE" /><input name="loc" type="hidden" value="es_ES" /><div class="button"><input type="submit" value="Enviar" /></div></form></div><div class="hbFollowFooter">Un widget de  <a href="http://redeando.blogspot.com" target="_blank">REDEANDO</a></div></div><script src="http://hostredeando.ucoz.es/js/jquery-popup.js"type="text/javascript"></script><script type="text/javascript">jQuery(function(a){a("#subscribe-button .subscribe").click(function(b){a("#subscribe-widget").modal();return false})})</script>

Ahora cambia lo que esta en rojo por el nombre de tu blog y listo.

Via/Redeando


12 comentarios

AlviiN Cortez · agosto 15, 2012 a las 10:21 pm

Exelente 😀 esta bonito gracias, y oye tengo una consulta, tu publicaste un gadget con unos circulos que decian «Anunciate aqui» para que los visitantes pudiesen anunciarse en mi blog pero te pregunto ¿como hago para que los visitantes se anuncien? si me podrias ayudar te lo agradeceria mucho, gracias 🙂

    Juvinao · agosto 16, 2012 a las 11:42 pm

    Alviin tu debes cambiar donde dice «URL BLOG» por la URL del blog que quieras y listo.. así de fácil

    Saludos AlviiN :]

AlviiN Cortez · agosto 17, 2012 a las 1:52 pm

Ah D: Gracias Juvinao 😀

Diamante Loco · agosto 18, 2012 a las 4:57 am

hola como va! el otro dia quise poner la flecha de al estilo taringa que pusiste hice el cambio y como tonto guarde,…
y tube un problema no pude recuperar el display en la pagina que subi que cambie de imagen.. mi blog es http://diamantelocorock.blogspot.com.ar/

Diamante Loco · agosto 18, 2012 a las 4:57 am

hola como va! el otro dia quise poner la flecha de al estilo taringa que pusiste hice el cambio y como tonto guarde,…
y tube un problema no pude recuperar el display en la pagina que subi que cambie de imagen.. mi blog es http://diamantelocorock.blogspot.com.ar/

Diamante Loco · agosto 18, 2012 a las 5:01 am

hola el otro dia hice un cambio quise poner la flecha al estilo taringa que pusiste en un de las entradas lo hice lo guarde y lo borre despues porque no me anduvo , pero el problema no fue esem sino que el el discplay de o la secuencia de fotos que tenia en mi plantilla no anduvo, podrias saber porque?? igual ahora lo cambie pero nose como volver a poner la secuencia de fotos que tenia

    Juvinao · agosto 21, 2012 a las 3:35 pm

    Si tienes un ejemplo de la secuencia de fotos me seria de mucha ayuda para asi saber cual es el codigo y por consiguiente determinar el problema.

Anonymous · septiembre 6, 2012 a las 11:22 am

Hola Buenos Dias… Quiero Saber En Que Parte Pongo Mi Link Para Que Los Suscriptores Les llegue mis nuevos pots y quiero saber como hago para saber si estuvo bien

Anonymous · febrero 8, 2013 a las 4:52 pm

hola gracias,muy bueno ese boton,lo tratare de implementar en mi web,visitenme un saludo a todos

http://disfruta-ayuda-comparte.jimdo.com

PTC.Proyecto$ Marbetvil · marzo 27, 2013 a las 11:22 pm

Hola!
Hoy he encontrado tu blog y me ha apasionado, llevo 2 horas leyendolo y me parece fascinante para una novata como yo.He puesto este botón en mi blog pero al hacerle click para ver si funcionaba he visto que no.No se abre ninguna opción.Podrias decirme que ha podido pasarme? Lo que estaba en rojo he puesto la dirección de mi blog tal y como tu has indicado.
Esperando tu respuesta, gracias de antemano y ya tienes una nueva seguidora.

    Hayder Juvinao · marzo 31, 2013 a las 4:14 pm

    Al parecer el código esta sufriendo algún problema de incompatibilidad, déjame lo arreglo 😕

    Saludos

Responder a Anonymous Cancelar la respuesta

Marcador de posición del avatar

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *