Mostra Lista de Títulos de las Entradas en Páginas de Etiquetas

Navegando por el blog de Ariane de Templates Novo Blogger me encuentro con un truco muy interesante, el efecto de este truco es que cuando haces click en una de las etiquetas te mostrará una lista de los títulos de todas las entradas de la etiqueta.

Para ponerlo en tu blog ve a Diseño > Edición de HTML > Expandimos los artilugios con la ayuda de (Ctrl + F) buscamos el siguiente código:

<b:include data='post' name='post'>

Lo sustituimos por este otro código:

<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType != "item"'>
<div id='titulos'><ul><li>
<a expr:href='data:post.url'><data:post.title/></a>
</li></ul>
</div>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>

Ahora le daremos estilo a la lista de los títulos, con un poco de CSS añadiendo el siguiente código antes de la etiqueta ]]></b:skin>:

# Títulos (/ * estilo para el espacio ocupado por la lista * /
margin:6px 0px; margin: 6px 0px;
background:#fff; background: # fff;
padding:6px; padding: 6px;
border:1px solid #e3e2e3} border: 1px solid # e3e2e3)

#titulos ul{ /*estilo da lista */ # Títulos ul (/ * lista de estilos * /
margin:0px; margin: 0px;
list-style-type:none; list-style-type: none;
background:#eeeded; background: # eeeded;
padding:3px;} padding: 3px;)

#titulos li{ /* estilo para cada item da lista */ # Títulos li (/ * estilo para cada elemento de la lista * /
background: #fff ; background: # fff;
padding:15px 0px 3px 40px; padding: 15px 0px 3px 40px;
font-weight:bold} font-weight: bold)

Para que las fechas de las entradas no aparezcan en estas páginas, buscamos el código que corresponde a las fechas de las entradas que es el siguiente:

<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>

Y lo sustituimos por el siguiente código:

<b:if cond='data:blog.homepageUrl == data:blog.url'>
<b:if cond='data:post.dateHeader'>
<div class='date-header'><data:post.dateHeader/></div>
</b:if>

<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:if cond='data:post.dateHeader'>
<div class='date-header'><data:post.dateHeader/></div>
</b:if></b:if></b:if>

Guarda tu plantilla y listo.

Vía | Template Novo Blogger