De nuevo vengo con otro
slide pero ha diferencia del anterior que era manual
Slide manual este es automático.
En este Blog observaréis como queda
VER DEMO es
totalmente modificable y adaptable a cualquier parte del blog, introduciendo el código en un gadget.
El código lleva todas las explicaciones posibles para su modificación, tanto en tamaño de fuente como colores, a mayor tamaño de imágen mayor altura del Slide, colocándose automáticamente el ancho en cualquier parte del blog tanto encima de las entradas como en la sidebar.
Para cambiar los colores podéis usar la
Tabla de colores de
este blog.
Antes que nada, cambiar en el código el nombre de mi blog "amorsevillista" por el vuestro, lo encontraréis a continuación de
home_page
<style type="text/css">
/* PERSONALIZAMOS EL ESTILO -----------
-------- SLIDESHOW DE ENTRADAS */
/* FONDO */
#menucontent {
background:#575656; /* COLOR DEL FONDO */
padding:8px;
width:98%;
margin:0
}
/* LiNEA DE ABAJO (NuMEROS, PLAY, STOP, INFO) */
#menucontent .menuvku {
margin-top:5px;
border:0
}
#menucontent .menuvku-rig a{
text-decoration:none;
}
#menucontent .menuvku ul {
margin:0px;
padding:0px;
list-style:none;
background:transparent;
border:0
}
#menucontent .menuvku li {
display:inline;
line-height:25px;
border:0;
margin:0px;
padding:0px;
}
/* NuMEROS */
#menucontent .menuvku li a {
background:transparent; /* COLOR DEL FONDO DE LOS NuMEROS */
color:#ececec; /* COLOR DE LOS NuMEROS */
font-family:Arial, Helvetica, sans-serif;
font-size:14px; /* TAMAnO DE LOS NuMEROS */
text-decoration:none;
padding:2px 7px ;
border:1px solid #ececec; /* COLOR DEL BORDE DE LOS NuMEROS */
margin:0px;
margin-right:2px;
}
/* NuMERO ACTIVO */
#menucontent .menuvku li a.tabactive{
background:#ececec; /* COLOR DEL FONDO DEL NuMERO ACTIVO */
font-weight:bold;
position:relative;
color:#000; /* COLOR DEL NuMERO ACTIVO */
border:1px solid #ececec; /* COLOR DEL BORDE DEL NuMERO ACTIVO */
}
/* IMAGEN */
#menucontent .menuvku-rig img{
float:right;
padding:4px 5px 5px 0;
border:0
}
/* CONTENIDO */
#menucontent .menucontent1 {
background:#ffffff; /* COLOR DEL FONDO DEL CONTENIDO */
border:1px solid #BF0505; /* COLOR DEL BORDE QUE RODEA EL CONTENIDO */
padding:4px 3px;
margin:0px;
}
</style>
<script language="JavaScript">
imgr = new Array(); // <-- NO TOCAR
// IMAGEN QUE MUESTRA AL NO TENER UNA PROPIA LA ENTRADA
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAb5bRUSnk1BNOGn-NLH5Pr2h8q23fFrYWvV4IbmjuBFSj5Oa2DKWS9O2WajByuMCr9k_KrDbvY7geHHlR-NcLMzmISh__vFxyahyphenhyphen_mf1_MkFd5k5BbSrg8-Edvu4AxXOsLgnkVg5M8rXQ/s1600/sin-imagen.png";
// IMAGEN BOToN PLAY 16x16 pÃxels
img_play = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBfUPvyWLRwVE-4SATVrISmt0rS-V0vp0wK11sqodsiDrNkbNSL8bHouyOwCCQ8aDRw5AN8y8W7ugojh17FYTSPVhRQ4UE7sGmwFW0341fWTnMqBsAFoHWlY8xODyI-xAySOxHI9tepbxI/s1600/play.gif";
// IMAGEN BOToN STOP 16x16 pÃxels
img_stop = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiVmcT6WwQ3rG8f9wvliiiDVeoRoKLuud7yrfV1BmAme2_y7G9RuUxWHTrC-kdTdGZ1YQaKkX5FHPGd7EcYe3BUhnpnbuE4pyPNS_ucmL7LpT5oWmK0A3nXtr8uRx-9p00wXkAd4toPh1-/s1600/stop.gif";
// TAMAnO DE LAS IMaGENES
imgwidth = 170; // ANCHO
imgheight = 170; // ALTO
// TiTULOS DE LAS ENTRADAS
fntsize = 14; // TAMAnO FUENTE
acolor = "#000000"; // COLOR FUENTE
// DESCRIPCIoN DE LAS ENTRADAS
entradasPost = 400; // CANTIDAD DE TEXTO
entradasFontsize = 12; // TAMAnO FUENTE
entradasColor = "#000000"; // COLOR FUENTE
// COMENTARIOS
showPostComent = true; // true para mostrar, false para ocultar
text = "comentarios"; // TEXTO
cfntsize = 12; // nFUENTE
ccolor = "#9E0707"; // COLOR FUENTE
// FECHA DE LAS ENTRADAS
showPostDate = true; // true para mostrar, false para ocultar
bfntsize = 10; // TAMAnO FUENTE
bcolor = "#776E6E"; // COLOR FUENTE
// CONTINUAR LEYENDO
showPostContinuar = true; // true para mostrar, false para ocultar
clltext = "Continuar leyendo »"; // TEXTO
clfntsize = 14; // TAMAnO FUENTE
clcolor = "#C00D0D"; // COLOR FUENTE
var tabcount = new Array("7") // NuMERO TOTAL DE ENTRADAS, DE LA 1 A LA 10
var changespeed = 4; // DEMORA EN SEGUNDOS
home_page = "http://amorsevillista.blogspot.com"; // LINK DEL BLOG SIN / AL FINAL
</script>
<script src='https://googledrive.com/host/0BwZ7Sm1QQc1lTnlVZG1DS3V0N3c/slider.js' type='text/javascript'></script>
<div id='menucontent'>
<div class='menucontent1' onmouseover ='javascript:stop_autochange(); return false;' onmouseout ='javascript:restart_autochange(); return false;'>
<!-- LINK ENTRADAS -->
<div id="tabcontent1"><script>
document.write('<script src="'+home_page+''+rss_page+'1'+rssb_page+'"></scr' + 'ipt>');</script></div>
<div id="tabcontent2"><script>
document.write('<script src="'+home_page+''+rss_page+'2'+rssb_page+'"></scr' + 'ipt>');</script></div>
<div id="tabcontent3"><script>
document.write('<script src="'+home_page+''+rss_page+'3'+rssb_page+'"></scr' + 'ipt>');</script></div>
<div id="tabcontent4"><script>
document.write('<script src="'+home_page+''+rss_page+'4'+rssb_page+'"></scr' + 'ipt>');</script></div>
<div id="tabcontent5"><script>
document.write('<script src="'+home_page+''+rss_page+'5'+rssb_page+'"></scr' + 'ipt>');</script></div>
<div id="tabcontent6"><script>
document.write('<script src="'+home_page+''+rss_page+'6'+rssb_page+'"></scr' + 'ipt>');</script></div>
<div id="tabcontent7"><script>
document.write('<script src="'+home_page+''+rss_page+'7'+rssb_page+'"></scr' + 'ipt>');</script></div>
<!-- Agregamos o quitamos las entradas hasta 10, cambiando los número en el ID y en el script. La cantidad tiene que ser igual a la de los números. -->
<!-- FIN LINK ENTRADAS -->
</div>
<script>
document.write(''+div_easytabs1+''); // NO TOCAR
document.write(''+home_info+''); // NO TOCAR
document.write(''+div_easytabs2+''); // NO TOCAR
// LOS NUMEROS DEL 1 AL 10
document.write(''+li_easytabs1+'');
document.write(''+li_easytabs2+'');
document.write(''+li_easytabs3+'');
document.write(''+li_easytabs4+'');
document.write(''+li_easytabs5+'');
document.write(''+li_easytabs6+'');
document.write(''+li_easytabs7+'');
// Agregamos los números, tienen que ser igual cantidad a las entradas.
// FIN NUMEROS
document.write(''+div_easytabs3+''); // NO TOCAR
document.write(''+div_easytabs4+''); // NO TOCAR
</script>
</div>
Si tenéis algún problema con su instalación " yá sabéis, comentario y dudas resueltas"
Publicaciones Relacionadas
trucos blog