Ultimos posts de Beautiful Beta modificado por Todo-links

Hace algún tiempo Wells de Todo-links tubo la amabilidad de informarme de una modificación que había hecho en el script que Beautiful Beta proporciona para mostrar las últimas entradas en la sidebar.
Wells no solo fue tan atento que me hizo saber de su trabajo con el script, sino que incluso me hizo llegar las instrucciones completas para instalarlo.
Wells ha respetado al autor original y yo he decidido hacerlo también no eliminándolo en el código.

Ejemplo Todo Links

Para empezar a usarlo tan solo hemos de copiar y pegar este código en un nuevo elemento HTML-Javascript y colocarlo en el lugar escogido de nuestra sidebar, cambiando donde dice "dirección de tu blog" por la del nuestro:

<script src="http://weells.todolinks.googlepages.com/todoultipost.js"></script>
<script language="javascript">
var numposts = 25;
var showpostdate = true;
var showpostsummary = true;
var numchars = 120;
var autoestilo = false;
var todoespacio = true;
var todolist = true;
var tododesplaza = true;
var todovelocidad = 2;
var todoaltura = 200;
</script>
<script src="http://direcciondetublog.blogspot.com/feeds/posts/default?
orderby=published&alt=json-in-script&callback=showrecentposts"></script>

Explicación del uso de las variables:

numpost = valor entero (Número de post que quieren visualizar). Valor máximo: 25
showpostdate = true (Muestra la fecha de publicación del post) / false (para ocultar)
showpostsummary = true (Muestra el contenido textual del post) / false (ocultar).
numchars = valor entero (Número de caracteres del texto del post) Máximo valor recomendable: 400
autoestilo = true (el texto del contenido tiene estilo cursiva y su tamaño es del 85%, la fecha aparece al comienzo del primer renglón del texto de contenido).
false (texto plano, tamaño 100%. La fecha aparece en la misma línea del titulo. Puedes usar código CSS para modificar el estilo del “titulo con fecha” y del “texto de contenido”).
todoespacio = true (deja una línea vacía entre títulos.) / false (sin línea de espaciado.)
todolist = true (visualización de los post como listas.) / false (Todo lo contrario.)
tododesplaza = true (activa el desplazamiento del texto de abajo a arriba) / false (texto estático).

Si el valor de tododesplaza es true se aplican las siguientes opciones:

todovelocidad = valor entero (velocidad del desplazamiento del texto). Valor mínimo: 1. Máximo recomendable: 10
todoaltura = valor entero (altura del bloque donde se desplazará el texto. La medida es en pixeles). Valor máximo recomendado: 500.

Si el autoestilo tiene el valor de false usamos el siguiente código para personalizar nuestro estilo.

Lo colocamos en el CSS, por ejemplo, antes de ]]>,</b:skin>

.Todotitulo {
font-weight: bold; //es para darle el efecto de negrita al texto
font-size: 100%; //tamaño del texto en porcentaje
font-style:italic; //efecto de cursiva
color:#ffffff; //color del texto }
.Todotexto {
font-weight: bold;
font-size: 100%;
font-style:italic;
color:#ffffff; }


Puede parecer un poco complicado con tantas variables e instrucciones, aunque en mi caso no he modificado nada más que el "var altura" y he dejado las demás variables tal cual están en el código, ya que el texto se adapta automáticamente al estilo del blog.

Para añadirle el subir/bajar y podamos hacer que el texto se desplace hacia arriba o hacia abajo, copiaremos después del código que hemos puesto dentro del elemento, estas líneas:

<br/><center><a style="color: rgb(166, 196, 255);" href="javascript:void(0);" onclick="getElementById('todoposts').direction='down';">Bajar</a><span style="padding-left: 30px;"><a style="color: rgb(166, 196, 255);" href="javascript:void(0);" onclick="getElementById('todoposts').direction='up';">Subir</a></span></center>

El color del texto "subir" y "bajar" podemos cambiarlo en "rgb(166,196,255)".
Para añadir un icono con unas flechitas, por ejemplo, sustituimos "subir" y "bajar" por la url de la imagen del icono: <img src="Url_del_icono"/> o podemos dejar texto e imagen juntos.

En este link podéis consultar el manual completo que Wells nos proporciona, y si alguna duda surge, lo mejor es consultar con Wells en Todo-links, estoy segura que cualquier cosa os atenderá encantado.

¡Gracias Wells!

Nota:
El script funciona desde Google Pages, para evitar problemas podéis descargarlo desde mi alojamiento (botón derecho, guardar como...) y subirlo al vuestro.
Si lo hacéis así, el script que bajéis no llevará incluida la publicidad de los autores.

0 comentarios:

Publicar un comentario