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.
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”
3 Abre un gadget “Añadir un gadget”
4 Busca el widget que dice “HTML/Javascript”
ábrelo
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
Recuerda suscribirte:
Obtenga nuestro boletín de noticias diario | Suscríbete gratuitamente SUSCRIBIRSE
8 comentarios: