Etiquetas en forma de menú desplegable

Si tenemos muchas etiquetas esta es una forma para que no nos ocupen mucho en nuestro blog.

Sólo necesitas entrar en Diseño | Edición de HTML, marcar la casilla Expandir plantillas de artilugios y buscar este código:

Código

<ul>

<b:loop values='data:labels' var='label'>

<li>

<b:if cond='data:blog.url == data:label.url'>

<span expr:dir='data:blog.languageDirection'><data:label.name/></span>

<b:else/>

<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>

</b:if>

<b:if cond='data:showFreqNumbers'>

<span dir='ltr'>(<data:label.count/>)</span>

</b:if>

</li>

</b:loop>

</ul>

Elimínalo y en su lugar pega esto:

<br/>

<select class='menu-etiquetas' onchange='location=this.options[this.selectedIndex].value;'>

<option>Selecciona una categoría</option>

<b:loop values='data:labels' var='label'>

<option expr:value='data:label.url'><data:label.name/>

(<data:label.count/>)

</option>

</b:loop>

</select>

Con eso será suficiente. Puedes cambiar el texto Selecciona una categoría donde se indica. Si quieres que no se muestren el número de entradas que tiene cada etiqueta elimina lo que está en color azul.

También puedes darle un poco de color para que se vea más o menos de esta forma:

Selecciona una categoría

Si lo quieres así sigue el mismo procedimiento, pero adicionalmente deberás pegar antes de

]]></b:skin> este código:

.menu-etiquetas {

background-color: #CEE3F6; /* Color de fondo */

color: #000000; /* Color del texto */

}

Nota:
Antes de realizar cualquier cambio en nuestro blog, tendremos que realizar una copia de seguridad del mismo por si algo no sale bien.

Puedes ver en este post como lo hacemos paso a paso

Enlace

Datos de Miltrucosblogger