Principal
/
Tutoriales de Joomla!
/
Cómo crear un menú desplegable en Joomla!

Cómo crear un menú desplegable en Joomla!

Este tutorial abarca los siguientes temas:

Si la estructura de tu sitio requiere que tengas un elemento de submenú, esto puede gestionarse creando un menú desplegable para tu sitio web Joomla!. En el últimas versiones de Joomla!, puedes crear elementos de menú desplegable de la misma manera que creas elementos de menú regulares. La única diferencia es que eliges un elemento del menú principal durante el proceso.

Joomla! 4

Crear un menú desplegable en Joomla!

Accede al panel administrativo de tu Joomla! y ve a Menus > Main Menu > Add New Menu Item

Ahora debes seleccionar el tipo de elemento de menú. En este ejemplo, te mostraremos cómo hacer que el enlace del menú desplegable abra un solo artículo Joomla!. Para ello, haz clic en Select junto a la etiqueta Menu Item Type. Aparecerá una lista con los elementos de menú disponibles. Selecciona la categoría Articles y elige Single Article.

Ahora debes elegir el artículo real al que deseas vincular. Haz clic en Select junto a la etiqueta Select Article. Aparecerá una lista con todos tus artículos. Elige el que deseas vincular y haz clic en su título.

El siguiente paso es ingresar un título para el elemento del menú. Para ello, rellena el campo junto a la etiqueta Menu Title. En este tutorial, crearemos un submenú llamado Products.

Busca la etiqueta Parent Item y haz clic en el menú desplegable junto a ella. Ahora selecciona el menú principal para el nuevo elemento de menú que estamos creando. Como mencionamos en el primer párrafo, a los efectos de este tutorial, elegiremos un elemento del menú Home existente como principal.

Finalmente, haz clic en Save en la parte superior izquierda de la página.

¡Eso es todo! Ahora puedes navegar hasta el front-end de tu sitio web y pasar el ratón sobre el menú de inicio. Notarás que el elemento de menú recién creado aparece debajo de él.

Create an Empty Parent Menu

A menudo, no es necesario tener un menú principal que cargue una página específica, sino solo un contenedor para agrupar algunos elementos del menú. Joomla! no tiene un tipo de menú estándar para elementos de menú vacíos, pero afortunadamente hay una solución para esto. Debes crear un elemento de menú principal siguiendo los mismos pasos descritos anteriormente hasta que tengas que elegir el Menu Item Type. Esta vez, en lugar de un “Single Article”, debes seleccionar System Links > URL.

En la página siguiente, debes completar el símbolo del hashtag – “#” en el campo Link y guardar ese menú.

Eso es todo, ahora puedes agregar elementos secundarios a este elemento de menú como se explica en la primera parte de este tutorial. El menú Home en sí mismo no cambiará la URL a una página diferente, sino que solo mostrará sus submenús.

Joomla! 3

Crear un menú desplegable en Joomla! 3.x

En primer lugar, accede a la zona de administrador de tu Joomla! 3 y ve a Menus > Main Menu > Add New Menu Item.

Ahora necesitas seleccionar el tipo de elemento de menú. En este ejemplo te vamos a enseñar cómo hacer un menú desplegable que abra un artículo de Joomla! 3.x. Para hacer esto, haz clic en el botón Seleccionar / Select junto a la etiqueta Tipo de elemento de Menú / Menu Item Type.

Te aparecerá un recuadro con el menú disponible. Selecciona la categoría de Artículos/Articles y elige Artículo único/ Single Article.

Ahora tienes que elegir el artículo que vas a enlazar. Para hacer esto, primero haz clic en el botón Seleccionar /Select junto a la etiqueta Seleccionar Artículo/Select Article.

Una vez hecho esto, te aparecerá un recuadro con todos tus artículos. Elige el que quieras enlazar y haz clic en el título.

En el siguiente paso le podrás nombre al elemento de menú. Tienes que rellenar el campo junto a la etiqueta Título del Menú/Menu Title. En este tutorial crearemos un submenú llamado Awesome Menu.

Ahora la parte importante, encontrar la etiqueta del Artículo Padre y haga clic en el menú desplegable junto a la etiqueta. Ahora selecciona el menú principal para el nuevo elemento de menú que estamos creando. Como mencionamos en el primer párrafo, en este tutorial vamos a elegir como padre el menú Home ya existente.

Por último, haz clic en el botón verde Guardar/ Save en la parte superior izquierda de la página.

¡Eso es! Ahora puede ir a la página principal de tu web y colocar el ratón sobre el menú Products. Te darás cuenta de que el elemento de menú que acabas de crear aparece debajo.

Crear un menú padre vacío

A menudo, no necesita tener un menú principal que cargue una página específica, sólo necesitas un contenedor para agrupar elementos de menú juntos. Joomla! 3 no tiene un tipo de menú estándar para los elementos de menú vacíos pero por suerte hay una solución para esto. Básicamente, lo que necesitas es crear un elemento de menú principal siguiendo los mismos pasos descritos anteriormente hasta que tengas que elegir el Tipo de Elemento de Menú. Esta vez, en lugar de un “Artículo único”, es necesario seleccionar System Links > External URL.

En la siguiente pantalla, es necesario rellenar el símbolo almohadilla “#” en el campo de Enlace/ Link y guardar ese menú.

Eso es todo, ahora puedes agregar elementos secundarios a este elemento de menú como se explica en la primera parte de este tutorial. El menú Home en sí mismo no va a cambiar la URL a una página diferente, sólo mostrará sus submenús.

Comparte este artículo