Como insertar un slideshow en el sidebar de Blogger


El objetivo de los bloggers es mostrar los mejores temas de interés y así llegar a tener éxito con su blog, para tener más tráfico web hacia su blog, tienen que tener algunos trucos bajo la manga, uno de ellos es tener los mejores trucos de Widgets para Blogger, de entre ellos voy a explicar cómo insertar un slideshow en el sidebar de su blog de Blogger con un solo código y en un solo widget. La inserción del código es muy fácil de realizarlo, tendrán que copiar un código y ponerlo en un widget y luego ubicarlo en su sidebar de Blogger, no le causara ningún error en la estructura de su blog, tiene una carga ligera al momento de cargarse. Este nuevo slideshow para Blogger funciona perfectamente en todos los navegadores web.

Como insertar un slideshow en el sidebar de Blogger

Además, si necesitan ver algunos diseños de Slideshow, les dejo algunos post que publique


A continuación mire su demostración en mi blog de demos, el slideshow está ubicado al final del sidebar


Les gusto verdad!

Vamos a trabajar

1 Ira Blogger

2 Un clic en “Diseño

Como insertar un slideshow en el sidebar de Blogger

3 Abre un gadget “Añadir un gadget

Como insertar un slideshow en el sidebar de Blogger

4 Busca el widget que dice “HTML/Javascript” ábrelo

Como insertar un slideshow en el sidebar de Blogger

5 Inserta las siguientes líneas de código en su interior

<style scoped="" type="text/css">
#coinautoslide{margin:0 auto;border:4px solid white;border-radius:2px;font:normal normal 11px Verdana,Geneva,sans-serif;line-height:1.6em}
.coin-slider{overflow:hidden;zoom:1;position:relative}
.coin-slider a{text-decoration:none;outline:none;border:none}
.cs-buttons{font-size:0;padding:10px;float:left}
.cs-buttons a{margin-left:5px;height:10px;width:10px;float:left;border:1px solid #B8C4CF;color:#B8C4CF;text-indent:-1000px}
.cs-active{background-color:#B8C4CF;color:#FFFFFF}
.cs-buttons a{border-radius:50%;background:#CCC;background:-webkit-linear-gradient(top,#CCCCCC,#F3F3F3);background:-moz-linear-gradient(top,#CCCCCC,#F3F3F3);background:-o-linear-gradient(top,#CCCCCC,#F3F3F3);background:-ms-linear-gradient(top,#CCCCCC,#F3F3F3);background:linear-gradient(top,#CCCCCC,#F3F3F3)}
a.cs-active{background:#599BDC;background:-webkit-linear-gradient(top,#599BDC,#3072B3);background:-moz-linear-gradient(top,#599BDC,#3072B3);background:-o-linear-gradient(top,#599BDC,#3072B3);background:-ms-linear-gradient(top,#599BDC,#3072B3);background:linear-gradient(top,#599BDC,#3072B3);border-radius:50%;box-shadow:0 0 3px #518CC6;border:1px solid #3072B3!important}
.cs-title{width:100%;padding:5px 0;background-color:#000000;color:#FFFFFF}
.cs-title strong{display:block;font-size:120%}
.cs-title p{margin:0}
.cs-title cite{font-size:90%}
.cs-title strong,.cs-title cite,.cs-title p{padding:0 10px}
.cs-prev,.cs-next{background-color:#000000;color:#FFFFFF;padding:0 10px}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script type='text/javascript'>
var AutoCoinConfig = {
 url_blog: "http://plantilla-escritorio.blogspot.com/",
 MaxPost: 10,
 cmtext: "Comentarios",
 MonthNames :
["Ene","Feb","Mar","Abr","May","Jun","Jul","Ago","Sep","Oct","Nov","Dic"],
 pBlank : "http://1.bp.blogspot.com/-htG7vy9vIAA/Tp0KrMUdoWI/AAAAAAAABAU/e7XkFtErqsU/s1600/grey.gif",
 NoCmtext : "comentarios",
 imageSize :300,
 SumChars : 0,
 tagName:false,
 width: 300,
 height: 170,
 spw: 5,
 sph: 5,
 delay: 3000,
 sDelay: 30,
 opacity: 0.7,
 titleSpeed: 300,
 effect: '',
 navigation: true,
 links : true,
 hoverPause: true,
 prevText: 'Anterior',
 nextText: 'Siguiente'
};
</script>
<script src="https://dl.dropboxusercontent.com/s/nx3y46w3wr3oovl/autocoin.js" type="text/javascript"></script>

Nota: si ya utilizas un script en tu blog, borra esta línea de código http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js, y si no utilizas ningún script inserta todo el código tal como está.

Realiza este cambio:

He marcado de color azul la URL en la cual ustedes tendrán que borrarlo http://plantilla-escritorio.blogspot.com/ y cambiarlo por la dirección URL de su blog de Blogger o página web.

Eso es todo, ahora dale un clic en “Guardar” y ubica tu nuevo Slideshow en el sidebar de tu blog de Blogger, en el cual les mostrara sus 10 últimas publicaciones.

Fácil verdad!

Recuerda suscribirte y así recibirás mis nuevas actualizaciones diarias directamente en tu correo electrónico

¿Necesitas ayuda?

Cualquier pregunta no duden en hacérmelo saber y de inmediato les responderé

Saludos




Share:

Related post

Disqus

Disqus comments:


Google+

Google+ comments:

Facebook

Facebook comments: