#activar ~ .desplegable {display: none;overflow: hidden;} #activar:checked ~ .desplegable {display: block;} -->
Photopea, editor de imágenes gratis
Plantilla ClickMag-2
Introducción al HTML
Hacer tooltip con una imagen
Rutinas The Ordinary
Personalizar la primera letra de las entradas del blog
Convertidor PDF, JPG, Word, Excel, PNG...
Efectos imágenes para las entradas de nuestro blog
Plantilla Vogue
Cómo Insertar un PDF en excel
Botón subir arriba
Calcular el porcentaje

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

Publicar un comentario

0 Comentarios