Indice del blog por Autores

Hace una semana publique el indice o sitemap de nuestro blog con el que ordenábamos el contenido con orden alfabético de las etiquetas y donde se agregaba una etiqueta Nuevo a las entradas más nuevas.

Hoy les entrego un nuevo indice, en este caso se ordenan los contenidos según el autor, se puede usar como gadget, en una página nueva o en la entrada que queramos.

La idea me la dio uno de los blog a los que sigo para buscar contenido nuevo pero no me gusto la forma en la que se presenta la información porque carece de clases y de etiquetas y por lo tanto se complica el agregar estilo a la forma en la que se muestran las entradas de cada autor.

Por lo anterior me decidí a modificar el código de mi indice y lograr los mismos resultados pero con las opción de agregar css.

El indice tiene dos estados para cada autor, uno es abierto donde se muestran las contribuciones y el otro es cerrado para aprovechar el espacio vertical y ocultar lo que no queremos ver.

Estado cerrado

Estado abierto

Por defecto el contenido de los autores estará cerrado por lo que el código es excelente como gadget de cualquier blog con múltiples autores.

Para usarlo agregamos un gadget de contenido HTML/JavaScript o creamos una página o una nueva página y activamos "Edición HTML" y pegamos el siguiente código si lo queremos usar sin los css pre configurados.

<style type='text/css'>
.Visible {display: block;}
.Oculto {display:none;}
</style>
<script type="text/javascript" src="http://sites.google.com/site/rincondelrecursoweb/home/author1.0.js" ></script>
<script src="http://rinconubuntero.blogspot.com/feeds/posts/summary?max-results=9999&alt=json-in-script&callback=loadtoc"></script>

Por lo que se vera como así.


Para usar el css configurado pegamos el siguiente código

<link rel="stylesheet" href="indice.css" type="text/css" media="screen" />
<style type='text/css'>
.Visible {display: block;}
.Oculto {display:none;}
</style>
<script type="text/javascript" src="http://sites.google.com/site/rincondelrecursoweb/home/author1.0.js" ></script>
<script src="http://rinconubuntero.blogspot.com/feeds/posts/summary?max-results=9999&alt=json-in-script&callback=loadtoc"></script>

Y el resultado será el siguiente

En cualquiera de los casos cambiamos el texto en rojo (http://rinconubuntero.blogspot.com) por la dirección de nuestro blog, se guardan o se publica la entrada y el trabajo esta hecho.