Tutoriales, herramientas y utilidades para tu Blog (Blogger)

Featured Posts

Video of the Day

Caja de suscripción para blogger

Hola amigos!, en este post les escribo como poner una caja de suscripción para tu Blog de Blogger.
El tener una Caja o Widget de suscripción por correo electrónico es importante, permite a tus lectores mantenerse en contacto con el blog ,  al recibir periódicamente en su buzon de correo electrónico las entradas de tus últimas actualizaciones.Ademas elevara tu trafico web, cuando tus lectores compartan tus contenidos en las redes sociales.

El implementarlo es muy sencillo, recomiendo FeedBurner, sin embargo la caja de suscripción es algo sencilla , por ello le hemos añadido algunas mejoras para darle algo de estética, sin perder lo simple y practico que es:



El código que a continuación te detallo lo deberás insertar en un widget nuevo:

<style>  #R91481-WG {  width:300px;  border:1px solid #aaa;  border-radius:3px;  padding:3px 0;  }   .R91481-WG-wrapper {  background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiX9OGmL70a_BNHotAjRDcmshhjoodV4VIx7vJOwNvl4WBlrLZFQYefwjB9w1D1NGFmVgVJtJJa8P6dby8WVdvQ_Uhi562lejDYWCbRhz9ljTf47VMijt4NFSyXkOG6EShc0UuVdqIJjv0/s1600/background.png) repeat scroll 0 0 #f7f7f7;  color:#111;  font-size:14px;  line-height:20px;  text-align:center;  text-transform:uppercase; padding:1px 20px 10px;  }    .R91481-WG-form {  clear:both;  display:block;  margin:10px 0;  }   form.R91481-WG-form {  clear:both;  display:block;  width:auto;  margin:10px 0 0;  }    .R91481-WG-email-field {  -moz-border-radius:4px;  -webkit-border-radius:4px;  background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZB1MzTAwELvFfAM73BYvlD9jhS0vxGV9A8xZK_if45rJ9SzjzWz9qneLQcNppysiTWCqo1wzHt_zgV-MCbYLtoKi1pF1xWhyphenhyphenuA7pNQIOeP2YnQ-qX3PltW7M8LK62OuZe-bmZ4irybFo/s1600/icons.png) no-repeat 0 -27px; border:1px solid #ccc;  border-radius:4px;  color:#444;  width:68%;  margin:0 0 15px;  padding:10px 40px; }    .R91481-WG-email-button {  background:#09f;  border:1px solid #007fff;  box-shadow:0 1px 0 rgba(255,255,255,0.3) inset, 0 1px 0 transparent;  color:#fff;  cursor:pointer;  font-family:verdana;  font-weight:700;  text-shadow:1px 1px 0 rgba(0,0,0,.4);  text-transform:uppercase;  width:100%;  padding:10px; }    .R91481-WG-email-button:hover,.R91481-WG-email-button:focus {  background:#1ca4ff;  }   .R91481-WG-email-button:active {  -moz-box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;  -webkit-box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;  box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;  outline:0;  }   iframe,object,embed,.yt-border iframe,.yt-border object,.yt-border embed,table {  width:100%;  }    embed { border-radius:3px;  -moz-box-shadow:0 2px 4px rgba(0,0,0,0.2);  -webkit-box-shadow:0 2px 4px rgba(0,0,0,0.2);  background:#FFF;  border:1px solid #ddd;  box-shadow:0 2px 4px rgba(0,0,0,0.2); margin:0;  padding:4px;  }    #footer-section {  border-top:1px solid #aaa;  box-shadow:inset 0 4px 6px -3px #aaa;  font-family:cambria;  font-size:14px;  height:100px;  text-align:center;  width:100%;  margin:10px -30px 5px;  padding:0 30px;  }    a.social-icons {  margin-right:5px;  height:45px;  width:45px;  }    a.social-icons:hover {  opacity:.7;  filter:alpha(opacity=70);  }  </style>    <div id="R91481-WG">  <div class="R91481-WG-wrapper">  <br/><a href='http://www.ayudadeblogger.com/'></a>  <a class="social-icons" href="http://www.facebook.com/Tu-Pagina"target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhG8nnrFpLhyphenhyphenNOT3mNvTIwK8p4TlrcksLe7Oyt_e5-sG7K5vLfbFQnVu176T88kTL8ZJhokY3V7PypdppX8ZCAos06B6w1_eOh9jCNM9JIXIx9OfHJHjKhTejqdR9DC8gbUhc6-juFDehg/s1600/ayudadeblogger+facebook.PNG" /></a>  <a class="social-icons" href="https://www.twitter.com/tu-id-de-twitter"target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUQ-1U-uqdD5zYTmD5B4FYycMR1fRBp2MGoTcAiFOYQnnMtHkwIlJg-F6GGT2Upw_4v6d8ykIazolVDDSb2U52tcLl6rCHckz8Da8ZxAkLmZRLmHVpK-GLfBOv9JTv77brBb7HGpSgYf8/s1600/ayudadeblogger+twitter.PNG" /></a>  <a class="social-icons" href="https://plus.google.com/114283163993086871162"target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYStBqh27friu0ZP39Gdlj85bHPVBchTZrTf0LwivLqg4gXhxopHX0YssdeOCStNTpaoIWFHUEYpP4YHgl7wch_JK650A2tRYvqIdS091JHsXcZanIn8CBsSNQ2fTplngBj1oYvKmnzFw/s1600/ayudadeblogger+google.PNG" /></a>  <a class="social-icons" href="http://feeds.feedburner.com/terreno_blogger"target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhN9O8OyIFx-rHv7kNQYhmPOda-mC1jkhIi_xaIFguoRNqsFGq1w3QxkLTJqGJO6dT3CSVXD9g12NAGEpVYzJIK8S7YiPWyIk7gT_DQN_mNVgw_8-WQCvdAFbbVRipALMY1zRu_aEhQ5i0/s1600/ayudadeblogger+rss.PNG" /></a>  <font face="verdana"><p><b>Recibe mis actualizaciones en tu correo</b> </p></font>  <div class="R91481-WG-form"><form action="http://feedburner.google.com/fb/a/mailverify?uri=terreno_blogger" class="R91481-WG-form" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=terreno_blogger, 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"><input name="uri" type="hidden" value="terreno_blogger" />  <input name="loc" type="hidden" value="es_ES" /><input class="R91481-WG-email-field" name="email" autocomplete="off" placeholder=" Ingrese su E-Mail "/>  <input class="R91481-WG-email-button" title="" type="submit" value="Suscribete ahora" /></form>  </div><a href='http://www.ayudadeblogger.com/'></a></div></div>

Ahora solo cambia los datos en rojo y azul por los tuyos y a disfrutar de esta Caja de Suscipción para tu Blog.

Share :

Facebook Twitter Google+
0 Komentar untuk "Caja de suscripción para blogger"

Back To Top