Como Añadir Widget de Suscripcion Ultra a Tu Blog De Blogger

En el siguiente tutorial les mostrare como añadir un widget de suscripcion,compartir redes sociales ultra debajo del artuculo de blog de blogger.Este widget es de Wajahat Ahmed de Bluekut Es muy atractivo y profesional por si deseas adaptarlo a tu plantilla de blogger.

Chequea Widget Atractivo de Suscripcion

Solo sigue estos pasos para insertalo en tu blogger.

1.Entra en tu cuenta de Blogger
2.Haga una Copia de Seguridad de tu Plantilla
3.Vaya a Plantilla>>Editar Html

4.Busca la siguiente etiqueta ]]></b:skin> puedes utilizar las teclas CTRL y  F para conseguirla.
5.Copie y pegue el sigiente codigo Antes de la Etiqueta ]]></b:skin>

#Bluekut_Box{  width:585px;  height:126px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVoxBi94oqAUPXENDyAJiX-RdwG7u-d2LpkBqwg1lCs0grC-9fL8IzuGNDIiq7R3pUXY9I2pAkWo4fq1lvhUsQbtacJo7r-CI8a17909pFFA-6cZY7GN-WHocgm04uXcoIaeC3xpmJJbSG/s1600/share-bgnew.png) no-repeat;  margin: 10px 0 0 0;  padding:0; } #share-with-friends{  width:195px;  height:126px;  padding-top:19px;  float:left;  text-align:center; } #respond-to-writer{  width:195px;  height:126px;  padding-top:10px;  float:left;  text-align:center; } #like-us{  width:195px;  height:126px;  padding-top:19px;  float:left;  text-align:center; } .share-icons{  width: 175px;  height:25px;  margin:auto;  margin-top:17px; } .share-icon{  margin-left:3px;  margin-right:3px; } .respond-author{  margin-top:11px; } .more-author{  margin:0;  font-family:Arial;  font-size:12px;  padding-top:10px; } .more-author a{  text-decoration:none;  color:#e1281e; } .more-author a:hover{  text-decoration:underline; } .facebook-like{  position:relative;  left:35px;  top:-15px; } .button {  -moz-box-shadow:inset 0px 1px 0px 0px #f29c93;  -webkit-box-shadow:inset 0px 1px 0px 0px #f29c93;  box-shadow:inset 0px 1px 0px 0px #f29c93;  background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #fc1900), color-stop(1, #302222) );  background:-moz-linear-gradient( center top, #fc1900 5%, #302222 100% );  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fc1900', endColorstr='#302222');  background-color:#fc1900;  -moz-border-radius:6px;  -webkit-border-radius:6px;  border-radius:6px;  display:inline-block;  color:#ffffff;  font-family:Arial Black;  font-size:14px;  font-weight:bold;  padding:5px 19px;  text-decoration:none;  text-shadow:-14px -2px 9px #b23e35; }.button:hover {  background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #302222), color-stop(1, #fc1900) );  background:-moz-linear-gradient( center top, #302222 5%, #fc1900 100% );  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#302222', endColorstr='#fc1900');  background-color:#302222; }.button:active {  position:relative;  top:1px; } #b_link { width:585px; text-decoration:none; color:#FFF; } #b_link a { text-decoration:none; color:#FFF; } //*Ultra post footer widget End*//

6.Guarda la Plantilla
7.Luego busque la etiqueta </head> y pega el siguiente codigo arriba de esta.

<script type='text/javascript'>var switchTo5x=false;</script> <script src='http://w.sharethis.com/button/buttons.js' type='text/javascript'/> <script type='text/javascript'>stLight.options({publisher: &quot;ur-c5221477-ace0-9052-a858-cafca172e7b&quot;});</script>

8.Busca ahora la etiqueta <div class =’post footer’>y pegue el codigo de abajo, replazando el texto rojo con tu informacion:

<div id='Bluekut_Box'><div id='b_link' align="right"><a href="http://www.bluekut.com/2012/10/ultra-blogger-post-footer-widget.html"><small>Get This widget</small></a></div>  <div id='share-with-friends'>  <img alt='Share This Article with Friends' border='0' class='share-header' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxlRfTtIqo-b6Kt9mFczoWCFPW3PTYVywt1sTz8APtyzfUO2AJLSphrNGSTpmRbMFdl-S2DeHWRnO4vyg_OrbzApVwkwUbVJF_plei7QHR9j3eCfgctBnszJ-kVe0I-NYnwzL_KeTW3uoU/s320/share-this-article-with-friends.png'/>  <div class='share-icons'> <span class='st_facebook_large' displayText='Facebook'/> <span class='st_twitter_large' displayText='Tweet'/> <span class='st_email_large' displayText='Email'/> <span class='st_sharethis_large' displayText='ShareThis'/>  </div>  </div>  <div id='respond-to-writer'>  <form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=supertrucosdeblogger&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>  <img alt='Share This Article with Friends' border='0' class='share-header' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh83uYc-KMbmCVvfDpeBrrjuSeMWRzIL_r6xTMSjuD9fVEY4FqDqb8TlZ_1lk3SmQ5PLmVZNHt26AleMx0o1zNWnAcYJZFaIlJkm6I6en6ksnoGWEXRtT7KK_xj7oQSZvjdHz4-0OlRbmbG/s320/subscribe+Now.png'/><p><input name='email' style='width:140px' type='text'/></p><input name='uri' type='hidden' value='supertrucosdeblogger'/><input name='loc' type='hidden' value='en_US'/><input class='button' type='submit' value='Subscribe'/></form>  </div>  <div id='like-us'>  <img alt='Like us on Facebook' border='0' class='share-header' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdLFR7ahxsihpCw3wPI1n457_1EFbNKSHMo-4ArDvHFUhVjvIFc8pZSenhpnY4Q6R3qe1gAHid2a6C0cKCbwcfjTyIkSCwtLX1GP5l1JVl89dL-VOsriHmSmViWiDqG0I7ktOyF2Qqu1Z2/s320/like-us-on-facebook.png'/>  <iframe allowTransparency='true' class='facebook-like' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2Ftrucosdeblogger&amp;send=false&amp;layout=button_count&amp;width=100&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=21&amp;appId=136202409811394' style='border:none; overflow:hidden; width:100px; height:21px;'/>  </div> </div>

9.Guarda la Plantilla y Listo.

Chequea Articulo Widget Atractivo de Suscripcion Medios Sociales

Read More

Widget del Hombre Twitter Animado y Volador en Blogger

Twitter es el único sitio web de redes sociales que está dominando toda la internet a la delantera. Esto no quiere decir que no tenga competencia, porque Facebook, Google Plus y Pinterest son los verdaderos pioneros, pero Twitter tiene su propia clase y  normas.

Por lo tanto, el consejo a los nuevos blogeros deben iniciar la construcción de su audiencia en twitter para que puedan tomar ventaja de esto. El logro de más de dos mil seguidores en Twitter reales es algo que podría dar un enorme impulso a las capacidades de un blogero. Después de crear una cuenta en Twitter, se puede vincular fácilmente en nuestro sitio web, por lo que cualquier persona que se acerque a nuestro sitio web desde el motor de búsqueda o cualquier otra fuente puede convertirse en nuestro seguidor permanente.

Sin embargo, para atraer a tantos seguidores en nuestra cuenta de Twitter que podemos disfrutar de una espléndido widget que atraiga la atencion a tus visitantes y que le encante hacer clic en él una y otra vez. En este artículo, vamos a añadir un Widget  del Hombre Twitter Animado y Volador en Blogger.

Esta animado Hombre Twitter le seguirá en todas y cada rincón y esquina de su sitio. Fundamentalmente, este hombre que vuela intenta seguir el cursor cuando alguien sea desplaza hacia arriba o hacia abajo de la página.Para verlo en accion de clic AQUI.

Instrucciones para instalar este widget en tu blog de blogger.
     1.Ir a tu cuenta de Blogger.com >> Diseño >> Añadir un gadget.
     2.Luego, dentro de la lista de dispositivos, seleccione HTML / JavaScript.
    3. Ahora basta con pegar el siguiente código allí.

<script type="text/javascript" src="https://googledrive.com/host/0B0DJgT4v15seT3Y0Ump5Z0tqeTA"></script><script type="text/javascript">
var twitterAccount = "andante772";
tripleflapInit();
</script>

Reemplace andante772 con su nombre de usuario de twitter y guardar tu widget, pulse el Boton Guardar.

Todo hecho: Ahora seguir adelante y revisar su sitio y usted será testigo de una imagen perfecta de Hombre Twitter que lo siga por todo el blog.

Read More

Widget De Suscripcion A Medios Sociales y Rss Para Blog De Blogger

Hola! Espero esten bien.Bueno en dia de hoy les mostrare el simple truco para anadir un asombroso Widget de subscripcion con Rss y Medios Sociales.Usar este widget puedes enlazar tu profile de redes sociales de Facebook, Twitter y Rss y para subcribirse. Este te ayudara a conseguir updates por email.

Como Anadir Este Widget a tu Blog De Blogger
1.Entra a Blogger>>Diseno>>Anadir un Gadget>>Selecciona Html/Javascript y pega el siguiente codigo dentro espacio en blanco.

<style> .subscribebtrix { border: 2px solid #000000; padding: 8px; width: 310px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .subscribebtrix:hover { -moz-box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1); -webkit-box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1); box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1); } .tbimailbox { border: 1px solid #D3D3D3; -webkit-border-radius: 4px; border-radius: 4px; -moz-box-shadow: 1px 1px 1px 1px rgba(255, 172, 84, 0.4) inset; -webkit-box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset; box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset; color: #666; font: 14px "trebuchet ms", sans-serif; padding: 7px 15px; width: 160px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .tbimailbox:hover { -webkit-box-shadow: none; box-shadow: none; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .btrixsubmit { font: bold 12px Tahoma, Geneva, sans-serif; font-style: normal; color: #ffffff; background: #ff5714; border: 0px solid #ffffff; text-shadow: 0px -1px 1px #222222; box-shadow: 2px 2px 5px #000000; -moz-box-shadow: 2px 2px 5px #000000; -webkit-box-shadow: 2px 2px 5px #000000; border-radius: 10px 10px 10px 10px; -moz-border-radius: 10px 10px 10px 10px; -webkit-border-radius: 10px 10px 10px 10px; padding: 8px 15px; cursor: pointer; margin: 0 auto; } .btrixsubmit:active { cursor: pointer; position: relative; top: 2px; } .btrixsubmit::-moz-focus-inner { border: 0; padding: 0; margin: 0; } </style> <br /> <div class="subscribebtrix"> <div style="color: #666666; font-weight: bold; font: 22px Oswald, cursive; margin: 0px 0px 10px 15px;"> Free Updates to your Inbox</div> <div style="margin: 10px 0 0 6px;"> <form action="http://feedburner.google.com/fb/a/mailverify" class="emailform" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=bloggertrix', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" style="margin: 0pt;" target="popupwindow"> <input name="uri" type="hidden" value="bloggertrix" /> <input name="loc" type="hidden" value="en_US" /> <input class="tbimailbox" name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}" onfocus="if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}" type="text" value="Enter your email..." /> <input alt="" class="btrixsubmit" title="" type="submit" value="Subscribe" /> </form> </div> <div style="border: none; color: #666666; font: 22px Oswald, cursive; margin: 25px 0 0 5px;"> Follow us:</div> <div style="margin: -32px 0 0 120px;"> <a href="http://www.facebook.com/ciudadblogger" target="_blank" title="Join us on Facebook"><img alt="facebook" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgD6FAzY-RZS-hDx8sumW6gwt6gyIthv_Wbll18k4rRrHTECAf-VOixFKZ8GrUrbc4PZhdqYRSxFI34VTC2LhbbhOYsGwQfaWs2qjMXBGFFM8GxBjqJlDnP5AuNGbmKusH9r_RLl2fKbQg/s1600/facebook_btrix.png" /></a> <a href="http://www.twitter.com/ciudadblogger" rel="nofollow" target="_blank" title="Follow us on Twitter"><img alt="twitter" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGZjf2X9Z_cffalZsBHZfwQ87-wszpeh4B9hLl5C4_3uNxD6lyOl5Cdxy14vuFOnREuAGTC7Qis-xN0SkvhjPIsevKu97FTM27aGjHiz2mRDefEC6FqAn4RD7QahsVGgpcP_yBtyVQ_AI/s1600/twitter_btrix.png" /></a> <a href="https://plus.google.com/UserId" rel="nofollow" target="_blank" title="Follow us on Google+"><img alt="gplus" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhFKAQgqIcpgzMkp_vm_L2UMw-uwkBm46W_rMmaRWoSGZPLTblO-wG6vu-va8IVVEjCSX7RR4vhyphenhyphenwwYmtTE9W6iy5OsjMettEBHjdN_3xHyYaBtGFi9xg_V7FIj2Mhbyf7yNxRG02eEkwo/s1600/googleplus_btrix.png" /></a> <a href="http://www.pinterest.com/ciudadblogger" rel="nofollow" target="_blank" title="Follow us on Pinterest"><img alt="pinterest" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWF22fBsR6uOYJhhlzGnqi1pqVIESO16oyNjIc3pHhhFZv5o1MxayZxskKbG-CWkd-xH21_AmZ83lKdeZafxjF90fR4yNoBboABGEw-AC_mrmMB5ZD43-ocX1JvWOerluHXN_H8b3ApGA/s1600/pinterest_btrix.png" /></a> <a href="http://feeds2.feedburner.com/ciudadblogger" rel="nofollow" target="_blank" title="Subscribe to RSS"><img alt="rss" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsZ2QW6HpwEzXLReSsZsVdRpPOgCIHhPPBEITgsCYm7DpxOWxUzee-c3gipwqmgT8HhMp1TfCOPhnjQn8XSBJyGtCU_-1dVOF0TMD7mDKaBiyxy8s5olAbSMI9lZ5p4KtpJJbI58VKznw/s1600/rss_btrix.png" /></a> </div> <div align="center"> <a href="http://feeds.feedburner.com/ciudadblogger"><img alt="" height="26" src="http://feeds.feedburner.com/~fc/ciudadblogger?bg=FF9900&amp;fg=444444&amp;anim=1" style="border: 0;" width="88" /></a></div> </div>

Reemplaceciudadblogger con tu ID de Feedburner
Reemplace ciudadblogger con tu nombre de usuario Facebook
Reemplace ciudadblogger  con tu nombre de usuario  Twitter
Reemplace ciudadblogger con tu nombre de usuario Pinterest
Reemplace UserId con tu nombre de usuario de Twitter

5.Ahora guarda tu  HTML/Javascript'.

Listo...

Read More