Etiquetas en menú desplegable para mostrar los títulos de las entradas

Estoy seguro de que conoces el gadget de archivos que blogger ofrece y que nos facilita la búsqueda de una entrada específica gracias a la agrupación por fechas de los títulos publicados.

En el caso del gadget de etiquetas, no disponemos de esta útil característica y por ello quiero presentarte un truco que te permitirá modificarlo.

Como puedes ver en la imagen que te muestro a continuación, las etiquetas aparecerán en una lista tal y como las tienes en tu blog, pero dispondrán de un pequeño botoncito que al pulsarse, muestra los títulos de los artículos con dicha etiqueta.

Si lo deseas, puedes ver el truco en funcionamiento. Para ello, accede a este blog de pruebas.

Diseño>Edición de HTML>expandimos artilugios

Busca esta línea en tu plantilla:

<b:section class='sidebar' id='sidebar' preferred='yes'>

Ahora, justo debajo de ella incluye este código:

<b:widget id='Label20' locked='false' title='Etiquetas' type='Label'>
<b:includable id='main'>
<script type='text/javascript'>
home_page = "http://elbalcondejaime.blogspot.com/";
max_rc_posts = 10;
</script>
<script src='https://sites.google.com/site/scriptsbalcon/b/bletiquetascn.txt' type='text/javascript'/>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<ul>
<b:loop values='data:labels' var='label'>
<li style='margin-top:4px;'>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'>
<data:label.name/> <span dir='ltr'>(<data:label.count/>)</span> <a expr:onclick='"showPostLabel(\"" + data:label.name + "\",event)"' href='javascript:void(0)'>►</a>
</span>
<b:else/>
<a expr:onclick='"showPostLabel(\"" + data:label.name + "\",event)"' href='javascript:void(0)' style='margin-right:6px;padding:2px;border:1px solid #ccc;'>▼</a><a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a><style>.sidebar li {padding-top:4px;}</style>
<span dir='ltr'>(<data:label.count/>)</span>
</b:if>
</li>
</b:loop>
</ul>
</div>
</b:includable>
</b:widget>

Reemplaza http://elbalcondejaime.blogspot.com/ por la dirección de tu blog y guarda haz vista previa para comprobar el resultado. Si te gusta, tan solo debes guardar la plantilla.

En caso de querer mostrar la opción 'Suscribirme a esta etiqueta' tal y como te muestro a continuación utiliza este otro código:

<b:widget id='Label20' locked='false' title='Etiquetas' type='Label'>
<b:includable id='main'>
<script type='text/javascript'>
home_page = "http://elbalcondejaime.blogspot.com/";
max_rc_posts = 10;
</script>
<script src='https://sites.google.com/site/scriptsbalcon/b/bletiquetascn.txt' type='text/javascript'/>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<ul>
<b:loop values='data:labels' var='label'>
<li style='margin-top:4px;'>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'>
<data:label.name/> <span dir='ltr'>(<data:label.count/>)</span> <a expr:onclick='"showPostLabel(\"" + data:label.name + "\",event)"' href='javascript:void(0)'>►</a>
</span>
<b:else/>
<a expr:onclick='"showPostLabel(\"" + data:label.name + "\",event)"' href='javascript:void(0)' style='margin-right:6px;padding:2px;border:1px solid #ccc;'>▼</a><a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a><style>.sidebar li {padding-top:4px;}</style>
<span dir='ltr'>(<data:label.count/>)</span><a expr:href='data:post.url + "/feeds/posts/default/-/" + data:label.name'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjO5obz0-4S3NFcpfPrq2QzHnJ3YbBnW9eFpEXvLPXKo84b2IVjhbecMnWxq5ebCi2ZAu4K9nJrU2gx6IYK4hMpOGvPwZZ4p8F7Cr3GYeAAqCrX4pAjnFucDNkPF2IPBreNCyudpUu8mTE/s400/balcnfd.png' style='padding-left:4px;' title='Suscribirme a esta etiqueta'/></a>
</b:if>
</li>
</b:loop>
</ul>
</div>
</b:includable>
</b:widget>

Notas:

- Accede a esta otra entrada una vez hayas instalado el gadget en caso de querer modificar las etiquetas a mostrar.

- Si lo deseas, puedes subir el script que hace funcionar el truco a tu propio alojamiento de archivos: descargar. Después, reemplaza la dirección que ves en color grisáceo por la nueva URL.