Seguimos aligerando la sidebar

El otro día explicábamos un truquillo para que nuestra barra lateral no pareciera infinitamente larga y más tarde descubrí gracias a Vagabundia, un SCRIPT que permitía desplazar contenidos con un efecto scroll.

Al ver esto último, se me ocurrió que también podríamos reducir el tamaño de algunos artilugios de esta otra manera. Dicen que en la variedad está el (buen) gusto.

Creo que este formato puede ser especialmente adecuado para mostrar el contenido de posts recientes. Un buen sitio sería a modo de ticker bursátil sin aplicar fondo (background), justo encima de Entradas del Blog. Pero claro, dependerá de cada diseño.

ENTRADAS RECIENTES

Este de aquí arriba sería el resultado final para mostrar las entradas y para lograrlo, primero tenemos que instalar los SCRIPT aScroller y el de showrecentposts si es que no los tenemos todavía.

Ya se explicó cómo instalar un SCRIPT y la conveniencia de alojarlo en nuestro propio servidor. Así que lo que hay que hacer es descargarlo, alojarlo e instalarlo en nuestra plantilla. En estos enlaces podeis descargar el del efecto scroll y el de los posts recientes. Una vez puestos a buen recaudo, antes del </head> se instalarán los scripts necesarios según los que nos falten a cada uno en nuestra plantilla

<script src='URL_aScroller-1.0,js' type='text/javascript'/>
...
<script src='URL_showrecentposts2.js' type='text/javascript'/>

Ahora, en el lugar dónde queremos colocar el artilugio, la estructura del código debe tener esta forma:

<div id="idUnica" style="height:22px; width:400px;font-size:18px;">
<div>AQUI IRA EL CONTENIDO QUE QUEREMOS MOSTRAR CON SCROLL</div></div><script type="text/javascript">divScroller("idUnica", "v", 20, 2500);</script>

Si por ejemplo queremos colocar varias imágenes o varios párrafos diferenciados, cada uno de ellos deberá estar encerrado entre dos <DIV>...</DIV>

Actualización: Muy importante escribir todo el código seguido. Hay que redactarlo todo en una misma línea, porque de lo contrario puede dar lugar a un mal funcionamiento. Nada grave pero si molesto.

La etiqueta STYLE sirve para la configuración del ancho y alto del bloque DIV que contendrá el artilugio, así como el aspecto del texto. Configuradlo según vuestro estilo, teniendo en cuenta que la altura del DIV estará en función del tipo de letra utilizado, que si no se define, será el genérico de la plantilla. El 20 y el 2500 son respectivamente, la velocidad de desplazamiento y tiempo de pausa entre líneas (en microsegundos). También los podeis cambiar por los que os gusten. Más información sobre el funcionamiento y configuración de este SCRIPT en Vagabundia.

El contenido para mostrar los últimos posts sería:

<script style="text/javascript">
var numposts = 20;
var showpostdate = true;
var showpostsummary = false;
var numchars = 0;
var standardstyling = false;
</script><script src="http://Nombre_Tu_Blog.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts"></script>

• numpost: un número que define la cantidad de posts a mostrar
• showpostdate: true/false para que se muestre o no la fecha del post
• showpostsummary: true/false para que se vea o no un pequeño resumen del post
• numchars: un número para indicar la cantidad de caracteres a mostrar
• standarstyling: true/false para un diseño propio o el standar (recomendado)

Y ya que parece que funciona con esto, ¿por qué no utilizarlo con otros elementos que nos ocupen mucho sitio?

¿Vemos otro post al azar por si le encuentras utilidad o quizás prefieres ser más metódico y suscribirte a nuestras entradas por correo? También puedes imprimir este artículo y por supuesto compartirlo en redes sociales si fue de tu agrado.

Compartir

Twitter

Pinterest

Facebook

Linkedin

Copy URL

Compartir

Twitter

Pinterest

Facebook

Linkedin

Y muchos más artículos interesantes si nos sigues en...

• Google
• Facebook
• Twitter