Lo Último

Barra de ├║ltimos posts




Una nueva barra en Crosscoll para tus ├║ltimos posts, ├ęstos van pasando y cuando se pone el puntero encima se paran para elegir el post que interesa.

En Blogger In te ense├▒amos a a├▒adir ├ęsta barra de ├║ltimos posts. Para conseguirlo procede de la siguiente forma:

Copia el siguiente c├│digo:

/----------------------------------------------------------------------------------------------------------\
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="//cdn.jsdelivr.net/jquery.marquee/1.3.1/jquery.marquee.min.js" type="text/javascript"></script>
<style>
#headlines {
overflow:hidden;
position:relative;
line-height:25px;
background:#34495e; /* Color de fondo */
height:45px;
padding:0 0 0 135px;
}
#headlines h3 {
color:#fff;
font-family:Oswald, sans-serif; 
font-size:17px;
font-weight:400;
text-transform:uppercase;
margin-left:-115px;
margin-top:10px;
position:absolute;
}
#headlines .right_arrow {
padding:0 38px 0 110px;
display:block;
background:url(//lh6.googleusercontent.com/--o4encAx1Tc/VApRPFfbQFI/AAAAAAAALd4/kf0T7CNSvY0/s41/arrow.png) no-repeat right center;
height:46px;
line-height:46px;
position:absolute;
left:0;
top:0;
}
#ticker_post {
position:relative;
margin:0;
margin-left:20px;
height:50px;
width:auto;
}
.marquee {
width: 980px; /* Ancho del área donde se muestran las entradas */
overflow: hidden;
line-height: 45px;
}
.js-marquee a {
font-family:Oswald, sans-serif;
font-size:15px; /* Tama├▒o de los textos */
color: #FFF; /* Color de los textos */
padding-bottom: 20px;
text-decoration: none;
}
.ticker_separator {
color:#FFF; color: #FFF; /* Color del separador de las entradas */
margin:0 10px;
}
</style>
<div id='headlines'>
<h3>Lo Último</h3>
<div class='right_arrow'></div>
<script>
var blog_url = "http://nombre-de-mi-blog.blogspot.com";
var numero_post = 10; // N├║mero de entradas a mostrar
</script>
<script type="text/javascript" src="http://yourjavascript.com/946415552/ticker.js"></script></div>
<div style='clear:both;'></div>
<script>
$(window).load(function() {
$('.marquee').marquee({
direction: 'left', // Direcci├│n de la marquesina, usar left o right
duration: 25000, // Velocidad
pauseOnHover: true,
duplicated: true
});
});
</script>

\----------------------------------------------------------------------------------------------------------/

Puedes configurar tu gadget como m├ís te convenga, he marcado en rojo algunos de los par├ímetros que puedes cambiar, y si te atreves con los p├şxels ......adelante!
Luego ve a tu "Escritorio Blogger"
Pulsa en tu "Blog"
Pulsa en "Dise├▒o"
Pulsa en "A├▒adir un gadget"
Pulsa en "HTML Javascript"
Pega el c├│digo copiado en la caja de texto del gadget
Configúra los parámetros a tu gusto y pulsa en "Guardar"
Arrastra el gadget a la posici├│n Crosscoll en la parte superior de tu blog
Pulsa en "Guardar disposici├│n"




Y ya puedes ir a tu blog a ver c├│mo queda la nueva barra de ├║ltimos posts, facilito y entretenido verdad?. Pod├ęis ver un ejemplo en ├ęste mismo blog, sube y mira c├│mo queda!!




Para estar actualizado en las novedades de Blogger In puedes seguir el blog, para ello ve al gadget en la columna lateral de este blog y pulsa en "Participar en ├ęste sitio" y sigue el asistente hasta el final y comprueba que apareces en el gadget. Feliz semana amigos!!