¿Demasiadas etiquetas en tu sidebar? La mejor opción: ponerlas todas en un menú desplegable, como este: . Por supuesto que funciona de manera automática, todo lo que hay que hacer está en estos dos sencillos pasos:
1) Buscar el código de las etiquetas
En Diseño » Edición de HTML (sin expandir la plantilla), busca la siguiente línea:
Nota 1: La plantilla debe tener instalado un widget de etiquetas, lo cual es lo más normal. Si no lo tiene, hay que agregarlo desde Diseño » Elementos de la página » Añadir un elemento de página » Etiquetas.
Nota 2: Si la plantilla ha sido modificada con anterioridad, es posible que no encuentres esta línea tal como está arriba. Si éste es el caso, la solución es la siguiente: buscar sólo la última parte del código (type='Label') y luego seleccionar lo más parecido a la la línea original, empezando siempre desde <b:widget id= (lo que puede llegar a estar distinto es: el número después de "Label", "Locked=true" en lugar de "Locked=false" o el título "Etiquetas" cambiado por algún otro).
Luego de encontrado el código, prosigue con el siguiente paso:
2) Reemplazar las etiquetas por el menú
Esta parte es más sencilla. Sólo copia y pega en su lugar este fragmento:
<b:widget id='Label1' locked='false' title='Etiquetas' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<br />
<select onchange='location=this.options[this.selectedIndex].value;'>
<option>Elije 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>
</div>
</b:includable>
</b:widget>
3) Personalización (opcional)
- En el código de arriba, el título del widget es "Etiquetas" (resaltado). Puede cambiarse reemplazándolo por cualquier palabra o frase. También puede cambiarse más tarde desde Diseño » Elementos de la página » Editar.
- El texto que aparece por defecto en el menú, antes de que el usuario elija una etiqueta, es "Elije una categoría" (resaltado). Puede cambiarse por cualquier otro texto, pero hay que tener en cuenta que por defecto, el menú será tan ancho como la variable anterior o la etiqueta más larga que tengamos en el blog.
- Si al ser desplegado, el menú sigue siendo demasiado alto como para caber en la página, podemos darle una vuelta de tuerca transformándolo en una lista con una barra deslizable (scroll bar), como por ejemplo:
Para ello, son necesarios dos pasos adicionales muy rápidos:
Paso 1) Agregar luego del primer "select": size="X", donde X debe ser reemplazado por el número de líneas que queremos mostrar (en este ejemplo es 3).
Paso 2) Eliminar la primer opción del código del menú (<option>Elije una categoría</option>).
Ante cualquier duda, sugerencia o mejoras para este código, por favor dejen sus comentarios.
Actualizaciones en tu Email
1 comentarios:
Muchas gracias, llevaba tiempo buscando como hacerle :)
Publicar un comentario en la entrada