Añadir un menú a tu blog para tener todo bien organizado

Buenos días!!!

Si vuestro blog tiene varias secciones diferenciadas seguro que habéis pensando en añadir un menú a vuestro espacio para que filtre los artículos por temática y tener así todo muy organizado.



Si no es así, igual deseáis que algún apartado en especial os abra una página nueva, como puede ser el apartado “Sobre mí”, por deciros un ejemplo.

Pues bien, voy a mostraros un ejemplo que tenga un poco de todo. Al igual que en mi blog. Un menú que tenga tanto los distitntos bloques del blog así como alguna página independiente para la sección “sobre mi”.


Para conseguir nuestro menú tendremos que irnos a la  vista de “PÁGINAS”. Ya os hablé de él en el artículo “basico blogger”.

Vais a encontrar lo siguiente:


Para seleccionar qué tipo de menú queréis mostrar elegiréis la opción que prefiráis:


Una vez seleccionado y pulsado “save arrangement” podéis ir a ver vuestro blog y obsevar que tenéis el menú añadido con la página "Home". Tener un menú tiene sentido si vuestro espacio tiene varias secciones, así que vamos a añadir páginas nuevas para que ese menú tenga más secciones.



Volvemos a  la vista “pages”.
Ahora desplegamos el menú “new pages” y podremos ver lo siguiente:


Si añadimos una "blank page" será para crear cualquier página independiente. Por ejemplo un "sobre mi". Al añadirla  se nos abrirá un editor de texto igualito al de los artículos. Ahí pondremos el título de la página (el que se mostrará en el menú) así como contenido de nuestra página.

Si añadimos una “web address” será para los siguientes casos:

  1. Añadir una página en la que se muestren solo los artículos de nuestro blog que tengan una temática.
  2. Abrir una dirección web que nos interese. Otra página o algo parecido.
Al seleccionar "añadir una página de este tipo" se abrirá un popup como el siguiente para rellenar el nombre de la página (el que aparecerá en el menú) y la url.


Lo más habitual será añadir una página "Web Address" para filtrar nuestros artículos, ¿verdad? Pues vamos a explicar este caso. Si su función es apuntar a otra página es evidente que la url que hay que rellenar es la de esa web. No tiene más complicación. Por ello nos centraremos en el caso de quererla para organizar y filtrar nuestros artículos.


Antes de nada hay que tener en cuenta que el blog filtra las noticias en función de los valores que pongáis en los “labels” de vuestro artículo. Tenéis que pensar un label para cada sección del menú.


Una vez tenido esto en cuenta, la url que hay que añadir al popup que se muestra en la captura anterior tiene el formato que podéis ver en la imagen siguiente. Os enseño un ejemplo de este blog para la sección de herramientas molonas. La etiqueta de estos artículos que he puesto es "herramientas". Entonces la url es la siguiente:





Pues bien, si añadimos una página de este tipo veremos que se ha añadido una nueva página a nuestro blog, una sección en el que se muestran los artículos con esa temática.



Al seleccionar en nuestro menú una sección se mostrarán todas las entradas con la etiqueta que hayamos decidido. Pero también se mostrará un mensje que pone:

“Mostrando entradas con la etiqueta X. Mostrar todas las entradas”.

 Si lo queréis eliminiar tendréis que añadir el siguiente css:

.status-msg-wrap {visibility:hidden;display:none;}

Para ello vais al menú template customize advance css y lo pegáis ahí:



Al aplicar los cambios pulsando  en “apply to blog” ya no saldrá ningún mensaje.  Podéis comprobarlo.

Pues muy bien, amigos. Hoy hemos aprendido a: 

Añadir un menú a nuestro blog, tanto sea horizontal como lateral. 

Añadir páginas en blanco para redactar en ellas lo que queramos o añadir páginas que nos filtren los artículos por sus labels. 

Quitar el mensaje de “Mostrando entradas con la etiqueta X. Mostrar todas las entradas” que a mí, personalmente, no me gusta nada.


Si os interesa os redactaré otro post con trucos para personalizar este menú, ¿okey?.


Saludos y






No hay comentarios:

Publicar un comentario

instagram (@missmint_design)