Joomla! Documentation - User contributions [en]

J3.x:Creating a submenu/es

2015-12-25T19:30:44Z

Framon: Created page with " Category:Beginners/es Category:Tutorials/es Category:Joomla! 3.x/es Category:Menu Management/es"

<noinclude><languages /></noinclude>
{{Top portal heading|color=white-bkgd|icon=magic|icon-color=#5091cd|size=3x|text-color=#333|title=Tutorial 
Cómo Crear un Submenú en un Sitio Joomla!}}
<noinclude>{{Joomla version|version=3.x}}</noinclude>
En Joomla, los submenús se pueden mostrar de dos formas: bajo dos o más niveles jerárquicos o como un menú modular completamente separado. Esto sirve para construir menús que muestren la jerarquía de navegación entre items (a nivel de padres e hijos), o para mostrar solamente items en un cierto subnivel del menú en una posición del template completamente separada del resto. Para mostrar como hacerlo, iremos creando paso a paso items de menú padres e hijos y veremos como visualizar estos items dentro de un solo gran menú jerárquico, o como un menú separado que solo muestre los items hijos en una posición separada del template. {{-}}
__TOC__
Para empezar, funciones de menú con tres construcciones básicas:
*Artículos - necesitas contenido para enlazar. Pueden ser partes de un componente, otros items de menú, o enlaces externos.
*Menú - describe los elementos del menú, el tipo de navegación, su relación padre/hijo a otros elementos de menú y el orden en que se muestran.
*Módulo de Menú - controla la posición y visualización del menú.

Para este tutorial, comienza ingresando en Joomla como usuario administrador. Si no sabes como ingresar lee el siguiente artículo: [[S:MyLanguage/J3.x:Logging_in_or_out_of_the_Administrator_back-end|Ingresando y saliendo del panel de administración de Joomla]]. {{-}}

'''Nota:''' Para este tutorial necesitas permisos de super administrador o permisos suficientes para crear y modificar artículos, items de menú, y módulos. Para más información sobre Control de Acceso de Usuarios (ACL) lee: [[S:MyLanguage/J3.x:Access Control List Tutorial|Tutorial ACL]].

==Paso 1 - Crea Tus Artículos==
En nuestro ejemplo, vamos a crear items de menú de nivel superior para "Perros" y "Gatos". Bajo Perros, tendremos "Collies" y "Pomeranos". Bajo "Gatos" tendremos "Birmanos" y "Azul Ruso". Así que la estructura de nuestro ejemplo de items de menú será como sigue:

*Perros
**Collies
**Pomeranos
*Gatos
**Birmanos
**Azules Rusos

Primero, crea cuatro artículos para que podamos enlazar nuestos items de menú a ellos: "Collies", "Pomeranos", "Birmanos" y "Azules Rusos". Lee este tutorial si necesitas ayuda para crear un artículo: [[S:MyLanguage/Help34:Content Article Manager Edit|Añadir un nuevo artículo]].

==Paso 2 - Crea los Items de Menú de Nivel Superior==
Para crear la estructura, necesitamos navegar al menú donde queremos que estén nuestros nuevos items. Si es un menú nuevo, necesitarás crearlo. Lee el tutorial sobre como crear un menú: [[S:MyLanguage/J3.x:Adding a new menu|Añadir un nuevo menú]].

Una vez tengas tu menú localizado en el Gestor de Menús, añadirás los items de menú padres usando '''Enlaces del Sistema'''{{rarr}}'''Crear una URL''' para cada enlace de navegación: ''Perros'' y ''Gatos''.

Nótese que hay otros tipos de items de menú que se pueden usar para el nivel padre de la estructura de navegación.

Aquí están los pasos para crear los Items de menú usados en nuestros datos de ejemplo. Para más información sobre creación de Menús lee: [[S:MyLanguage/J3.x:Adding a new menu|Añadir un nuevo menú]]. {{-}}
# Navegue hasta el Gestor de Menú haciendo clic en "Menús"'{{rarr}}"'Menú principal"'{{-}}[[Image:J3x-Edit-Main-Menu-es.jpg|775px|border]]
# En la barra de herramientas, clique sobre "Nuevo"{{-}}[[Image:J3x-Edit-Main-Menu-Toolbar-new-es.png|775px|border]]
# En este ejercicio, crearemos enlaces "contenedores" para los items de nivel superior "Perros" y "Gatos". En el panel "Detalles", clique sobre el botón "Seleccionar" un "Tipo de elemento del menú". En la ventana emergente que aparecerá, seleccionaremos posteriormente '''Enlaces del Sistema'''{{rarr}}'''Crear una URL'''. {{-}}[[Image:J3x-Add-Main-Menu-Select-Type-es.png|775px|border]]
# Clique sobre "Enlaces del sistema", luego deslice hacia abajo y seleccione "Crear una URL".{{-}}[[Image:J3x-Create-Sublevel-Menu-System-External-Url-en.png|775px|border]]
# Añade el '''Título de Menú''' y teclee una parrilla "#" en la caja del '''Enlace'''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Menu-Item-External-Url-en.png|775px|border]]
# Guarda el Item de menú recién creado. {{-}}[[Image:Joomla-3-Menu-Add-Menu-Save-es.png|775px|border]]
# Repite los pasos 2 - 6 para el item de nivel superior "Gatos".

==Paso 3 - Crea los Items de menú de nivel inferior==
Ahora se añadirán los items de menú de nivel inferior seleccionando el Tipo de elemento '''Artículos'''{{rarr}}'''Mostrar un solo artículo''' para crear los enlaces a las páginas de "Collies", "Pomeranos", "Birmanos" y "Azules Rusos". Para cada item de menú creado, estableceremos el "Elemento principal" a "Perros" o "Gatos".

Para información más detallada sobre cómo agregar un elemento del menú que apunta a un Artículo, lea: [[S:MyLanguage/Adding a menu item which points to an Article|Agregar un elemento del menú que apunta a un Artículo]].

'''Nota:''' Hay otros tipos de items que se pueden usar para los subniveles de la estructura de navegación.

# En la barra de herramientas, clique sobre "Nuevo".{{-}}[[Image:J3x-Edit-Main-Menu-Toolbar-new-es.png|775px|border]]
# En el nuevo Item de Menú, clique sobre el botón de selección de "Tipo de elemento del menú".{{-}}[[Image:J3x-Add-Main-Menu-Select-Type-es.png|775px|border]]
# Seleccione '''Artículos'''{{rarr}}'''Mostrar un solo artículo''' de la lista mostrada.{{-}}[[Image:J3x-Add-Main-Menu-Article-Type-es.png|border]]
# De vuelta al panel de "Detalles" de nuevo Item de Menú, clique sobre "Seleccionar artículo" para acceder a la lista de artículos.{{-}}[[Image:J3x-Add-Main-Menu-Article-Select-Article-es.png|border]]
# Seleccione el artículo "Collies" para este ejemplo.{{-}}[[Image:J3x-Create-Sublevel-Menu-Menu-Item-Single-Article-en.png|border]]
# De vuelta al panel de "Detalles" de nuevo Item de Menú, teclee un "Título del elemento del menú". A continuación clique sobre la lista de selección "Elemento principal" situada en la columna más a la derecha. Busque y seleccione el item superior "Perros", deslizándose sobre dicha lista. Nótese que el nivel de menú superior se indica mediante un único trazo "-", el segundo nivel con dos trazos "--", el tercero con tres "---" y así sucesivamente. {{-}}[[Image:J3x-Create-Sublevel-Menu-Select-Parent-Item-en.png|775px|border]]
# Clique sobre el botón "Guardar y cerrar" en la barra de herramientas de arriba.{{-}}[[Image:Joomla-3-Menu-Add-Menu-Save-es.png|775px|border]]
# Repita los pasos del 1 al 7 para los restantes artículos: "Pomeranos" con "Perros" como elemento principal y los artículos "Birmanos" y "Azules Rusos" con elemento principal "Gatos".
# Cuando haya terminado con la sección de "Items de Menú", el gestor de Items del Menú debería tener un aspecto similar al siguiente:{{-}}[[Image:J3x-Create-Sublevel-Menu-Items-en.png|775px|border]]

==Step 4 - Configurar el Módulo de Menú==
En este momento, ya tenemos los artículos e items del menú hechos. Ahora necesitamos actualizar el "Módulo de Menú". En Joomla!, el Módulo del Menú determina tres aspectos importantes:
# La apariencia del menú;
# Dónde se mostrará dentro de la página;
# En qué páginas se mostrará.

Realizaremos dos ejemplos:
* En el primer ejemplo configuraremos parámetros del módulo para mostrar el menú con los items de nivel superior y sus subniveles debajo.
* En el segundo ejemplo añadiremos un módulo de menú a mayores que aparecerá en la columna izquierda y mostrará tan solo los items de menú de segundo nivel.
'''Nota:''' Ambos ejemplos usarán el Template Protostar incluido en la instalación estándar de Joomla!

===Ejemplo 1 - Un Módulo de Menú con Items de Menú de Segundo Nivel===
Para mostrar el módulo del menú, siga estos pasos:
# Navega a '''Extensiones'''{{rarr}}'''Módulos''' y localiza el Módulo de Menú asociado con tu menú ("Main Menú" si tus items están en el menú principal). Si necesitas crear un nuevo módulo y necesitas instrucciones, lee: [[S:MyLanguage/Help34:Extensions Module Manager Menu|Module Menu]] {{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Control-Panel-en.png|775px|border]]
# Clica sobre el nombre del módulo asociado con tu menú. En este tutorial, hemos elegido el "Main Menu" (menú principal). '''Nota:''' en esta imagen se ha seleccionado "Menú" en el filtro de "Tipo de módulo" de la columna izquierda, para ver solo los módulos de menú y eliminar el resto de módulos de la vista.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-List-Menus-en.png|775px|border]]
# En los detalles del módulo, establece el "Nivel Inicial" (Start level) a 1, el "Nivel Final" (End Level) a "Todos" (All) y "Mostrar elementos del menú" (Show Sub-menu Items) a "Si" (Yes).{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Details-en.png|775px|border]]
# Para este tutorial, hemos añadido algunos estilos en el panel "Avanzado". En la "Clase CSS" (Menu Class Suffix') hemos introducido "navbar-nav nav-pills". Podrías poner "navbar-nav nav-tabs" para obtener un aspecto ligeramente diferente. Nota: hay un espacio antes de ''navbar-nav''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Advanced-Menu-Class-Suffix-en.png|border]]
# Clica sobre "Guardar y Cerrar".{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Save-en.png|border]]
# Ve a la página principal de tu sitio, que debería ser similar al de la imagen. En el Template Protostar, los items de menú en subniveles se muestran como items desplegables.{{-}}[[Image:J3x-Create-Sublevel-Menu-Frontend-Sample-Dropdown-en.png|775px|border]]
# El código fuente generado debería ser similar a este:
<source lang="html4strict">
<ul class="nav menu navbar-nav nav-pills">
<li class="item-101 current active"><a href="/" >Home</a></li>
<li class="item-102"><a class="dropdown-toggle" href="/about-us" >About Us</a></li>
<li class="item-210 deeper parent"><a href="#" >Dogs</a>
<ul class="nav-child unstyled small">
<li class="item-212"><a href="/2015-11-24-14-19-31/collies" >Collies</a></li>
<li class="item-213"><a href="/2015-11-24-14-19-31/pomeranians" >Pomeranians</a></li>
</ul>
</li>
<li class="item-211 deeper parent"><a href="#" >Cats</a>
<ul class="nav-child unstyled small">
<li class="item-214"><a href="/2015-11-24-14-20-12/burmese" >Burmese </a></li>
<li class="item-215"><a href="/2015-11-24-14-20-12/russian-blues" >Russian Blues</a></li>
</ul>
</li>
</ul>
</source>

===Ejemplo 2 - Un Segundo Módulo de Menú con un menú de nivel hijo===

Para mostrar un módulo separado en una posición distinta, siga estos pasos:
# Navega a '''Extensiones'''{{rarr}}'''Módulos''' y localiza o crea un segundo Módulo de Menú asociado con tu menú. Si no estás familiarizado con la creación de módulos de menú, lee: [[S:MyLanguage/Help34:Extensions Module Manager Menu|Módulos de Menú]]{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Control-Panel-en.png|775px|border]]
# Clica sobre el nombre del módulo asociado con tu menú. En este tutorial, hemos elegido "Menú izquierdo" (Left Menu). Nota: en la imagen se aplicó el filtro "Menú" en el desplegable "Tipo de Módulo".{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-List-Menus-2-en.png|775px|border]]
# En los detalles del Módulo, establece '''Nivel Inicial''' a "2", '''Nivel Final''' a "Todos" y '''Mostrar elementos del menú''' a "Si". Nótese que la posición ha cambiado y el menú al que estamos apuntando ahora es el "Menú principal" (Select Menu: Main Menu).{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Details-2-en.png|775px|border]]
# Para este tutorial, hemos usado el panel '''Asignación de menú''' y configurado la '''Asignación del módulo''' para aparecer en todas las páginas excepto la principal.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Module-Assignment-Tab-en.png]]
# Clica sobre "Guardar y Cerrar".{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Save-en.png]]
# Ve a la página principal de tu sitio y navega al artículo "Collies". Tu menú debería ser similar al de la imagen. Nótese que los únicos items mostrados son los subitems hijos.{{-}}[[Image:J3x-Create-Sublevel-Menu-Frontend-Sample-Child-Menu-en.png|775px|border]]
# El código fuente generado debería parecerse a este:
<source lang="html4strict">
<ul class="nav menu">
<li class="item-212 current active"><a href="/2015-11-24-14-19-31/collies" >Collies</a></li>
<li class="item-213"><a href="/2015-11-24-14-19-31/pomeranians" >Pomeranians</a></li>
</ul>
</source>

==Sub-Sub-Menús==
Utilizando esta misma técnica, es fácil crear menús de tres subniveles. Símplemente debes asignar como '''Elemento Principal''' (Parent Menu) del nuevo item de menú, un item de segundo nivel. A continuación, podrías usar la misma técnica para crear un módulo de menú separado que comience en el nivel 2 y termine en el 3. De este modo, solo se mostrarían los items de menú de nivel tres.

<noinclude>

[[Category:Beginners/es]]
[[Category:Tutorials/es]]
[[Category:Joomla! 3.x/es]]
[[Category:Menu Management/es]]
</noinclude>

Translations:J3.x:Creating a submenu/100/es

2015-12-25T19:30:44Z

Framon: Created page with " Category:Beginners/es Category:Tutorials/es Category:Joomla! 3.x/es Category:Menu Management/es"

[[Category:Beginners/es]]
[[Category:Tutorials/es]]
[[Category:Joomla! 3.x/es]]
[[Category:Menu Management/es]]

J3.x:Creating a submenu/es

2015-12-25T19:28:11Z

Framon: Created page with "Utilizando esta misma técnica, es fácil crear menús de tres subniveles. Símplemente debes asignar como '''Elemento Principal''' (Parent Menu) del nuevo item de menú, un i..."

<noinclude><languages /></noinclude>
{{Top portal heading|color=white-bkgd|icon=magic|icon-color=#5091cd|size=3x|text-color=#333|title=Tutorial 
Cómo Crear un Submenú en un Sitio Joomla!}}
<noinclude>{{Joomla version|version=3.x}}</noinclude>
En Joomla, los submenús se pueden mostrar de dos formas: bajo dos o más niveles jerárquicos o como un menú modular completamente separado. Esto sirve para construir menús que muestren la jerarquía de navegación entre items (a nivel de padres e hijos), o para mostrar solamente items en un cierto subnivel del menú en una posición del template completamente separada del resto. Para mostrar como hacerlo, iremos creando paso a paso items de menú padres e hijos y veremos como visualizar estos items dentro de un solo gran menú jerárquico, o como un menú separado que solo muestre los items hijos en una posición separada del template. {{-}}
__TOC__
Para empezar, funciones de menú con tres construcciones básicas:
*Artículos - necesitas contenido para enlazar. Pueden ser partes de un componente, otros items de menú, o enlaces externos.
*Menú - describe los elementos del menú, el tipo de navegación, su relación padre/hijo a otros elementos de menú y el orden en que se muestran.
*Módulo de Menú - controla la posición y visualización del menú.

Para este tutorial, comienza ingresando en Joomla como usuario administrador. Si no sabes como ingresar lee el siguiente artículo: [[S:MyLanguage/J3.x:Logging_in_or_out_of_the_Administrator_back-end|Ingresando y saliendo del panel de administración de Joomla]]. {{-}}

'''Nota:''' Para este tutorial necesitas permisos de super administrador o permisos suficientes para crear y modificar artículos, items de menú, y módulos. Para más información sobre Control de Acceso de Usuarios (ACL) lee: [[S:MyLanguage/J3.x:Access Control List Tutorial|Tutorial ACL]].

==Paso 1 - Crea Tus Artículos==
En nuestro ejemplo, vamos a crear items de menú de nivel superior para "Perros" y "Gatos". Bajo Perros, tendremos "Collies" y "Pomeranos". Bajo "Gatos" tendremos "Birmanos" y "Azul Ruso". Así que la estructura de nuestro ejemplo de items de menú será como sigue:

*Perros
**Collies
**Pomeranos
*Gatos
**Birmanos
**Azules Rusos

Primero, crea cuatro artículos para que podamos enlazar nuestos items de menú a ellos: "Collies", "Pomeranos", "Birmanos" y "Azules Rusos". Lee este tutorial si necesitas ayuda para crear un artículo: [[S:MyLanguage/Help34:Content Article Manager Edit|Añadir un nuevo artículo]].

==Paso 2 - Crea los Items de Menú de Nivel Superior==
Para crear la estructura, necesitamos navegar al menú donde queremos que estén nuestros nuevos items. Si es un menú nuevo, necesitarás crearlo. Lee el tutorial sobre como crear un menú: [[S:MyLanguage/J3.x:Adding a new menu|Añadir un nuevo menú]].

Una vez tengas tu menú localizado en el Gestor de Menús, añadirás los items de menú padres usando '''Enlaces del Sistema'''{{rarr}}'''Crear una URL''' para cada enlace de navegación: ''Perros'' y ''Gatos''.

Nótese que hay otros tipos de items de menú que se pueden usar para el nivel padre de la estructura de navegación.

Aquí están los pasos para crear los Items de menú usados en nuestros datos de ejemplo. Para más información sobre creación de Menús lee: [[S:MyLanguage/J3.x:Adding a new menu|Añadir un nuevo menú]]. {{-}}
# Navegue hasta el Gestor de Menú haciendo clic en "Menús"'{{rarr}}"'Menú principal"'{{-}}[[Image:J3x-Edit-Main-Menu-es.jpg|775px|border]]
# En la barra de herramientas, clique sobre "Nuevo"{{-}}[[Image:J3x-Edit-Main-Menu-Toolbar-new-es.png|775px|border]]
# En este ejercicio, crearemos enlaces "contenedores" para los items de nivel superior "Perros" y "Gatos". En el panel "Detalles", clique sobre el botón "Seleccionar" un "Tipo de elemento del menú". En la ventana emergente que aparecerá, seleccionaremos posteriormente '''Enlaces del Sistema'''{{rarr}}'''Crear una URL'''. {{-}}[[Image:J3x-Add-Main-Menu-Select-Type-es.png|775px|border]]
# Clique sobre "Enlaces del sistema", luego deslice hacia abajo y seleccione "Crear una URL".{{-}}[[Image:J3x-Create-Sublevel-Menu-System-External-Url-en.png|775px|border]]
# Añade el '''Título de Menú''' y teclee una parrilla "#" en la caja del '''Enlace'''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Menu-Item-External-Url-en.png|775px|border]]
# Guarda el Item de menú recién creado. {{-}}[[Image:Joomla-3-Menu-Add-Menu-Save-es.png|775px|border]]
# Repite los pasos 2 - 6 para el item de nivel superior "Gatos".

==Paso 3 - Crea los Items de menú de nivel inferior==
Ahora se añadirán los items de menú de nivel inferior seleccionando el Tipo de elemento '''Artículos'''{{rarr}}'''Mostrar un solo artículo''' para crear los enlaces a las páginas de "Collies", "Pomeranos", "Birmanos" y "Azules Rusos". Para cada item de menú creado, estableceremos el "Elemento principal" a "Perros" o "Gatos".

Para información más detallada sobre cómo agregar un elemento del menú que apunta a un Artículo, lea: [[S:MyLanguage/Adding a menu item which points to an Article|Agregar un elemento del menú que apunta a un Artículo]].

'''Nota:''' Hay otros tipos de items que se pueden usar para los subniveles de la estructura de navegación.

# En la barra de herramientas, clique sobre "Nuevo".{{-}}[[Image:J3x-Edit-Main-Menu-Toolbar-new-es.png|775px|border]]
# En el nuevo Item de Menú, clique sobre el botón de selección de "Tipo de elemento del menú".{{-}}[[Image:J3x-Add-Main-Menu-Select-Type-es.png|775px|border]]
# Seleccione '''Artículos'''{{rarr}}'''Mostrar un solo artículo''' de la lista mostrada.{{-}}[[Image:J3x-Add-Main-Menu-Article-Type-es.png|border]]
# De vuelta al panel de "Detalles" de nuevo Item de Menú, clique sobre "Seleccionar artículo" para acceder a la lista de artículos.{{-}}[[Image:J3x-Add-Main-Menu-Article-Select-Article-es.png|border]]
# Seleccione el artículo "Collies" para este ejemplo.{{-}}[[Image:J3x-Create-Sublevel-Menu-Menu-Item-Single-Article-en.png|border]]
# De vuelta al panel de "Detalles" de nuevo Item de Menú, teclee un "Título del elemento del menú". A continuación clique sobre la lista de selección "Elemento principal" situada en la columna más a la derecha. Busque y seleccione el item superior "Perros", deslizándose sobre dicha lista. Nótese que el nivel de menú superior se indica mediante un único trazo "-", el segundo nivel con dos trazos "--", el tercero con tres "---" y así sucesivamente. {{-}}[[Image:J3x-Create-Sublevel-Menu-Select-Parent-Item-en.png|775px|border]]
# Clique sobre el botón "Guardar y cerrar" en la barra de herramientas de arriba.{{-}}[[Image:Joomla-3-Menu-Add-Menu-Save-es.png|775px|border]]
# Repita los pasos del 1 al 7 para los restantes artículos: "Pomeranos" con "Perros" como elemento principal y los artículos "Birmanos" y "Azules Rusos" con elemento principal "Gatos".
# Cuando haya terminado con la sección de "Items de Menú", el gestor de Items del Menú debería tener un aspecto similar al siguiente:{{-}}[[Image:J3x-Create-Sublevel-Menu-Items-en.png|775px|border]]

==Step 4 - Configurar el Módulo de Menú==
En este momento, ya tenemos los artículos e items del menú hechos. Ahora necesitamos actualizar el "Módulo de Menú". En Joomla!, el Módulo del Menú determina tres aspectos importantes:
# La apariencia del menú;
# Dónde se mostrará dentro de la página;
# En qué páginas se mostrará.

Realizaremos dos ejemplos:
* En el primer ejemplo configuraremos parámetros del módulo para mostrar el menú con los items de nivel superior y sus subniveles debajo.
* En el segundo ejemplo añadiremos un módulo de menú a mayores que aparecerá en la columna izquierda y mostrará tan solo los items de menú de segundo nivel.
'''Nota:''' Ambos ejemplos usarán el Template Protostar incluido en la instalación estándar de Joomla!

===Ejemplo 1 - Un Módulo de Menú con Items de Menú de Segundo Nivel===
Para mostrar el módulo del menú, siga estos pasos:
# Navega a '''Extensiones'''{{rarr}}'''Módulos''' y localiza el Módulo de Menú asociado con tu menú ("Main Menú" si tus items están en el menú principal). Si necesitas crear un nuevo módulo y necesitas instrucciones, lee: [[S:MyLanguage/Help34:Extensions Module Manager Menu|Module Menu]] {{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Control-Panel-en.png|775px|border]]
# Clica sobre el nombre del módulo asociado con tu menú. En este tutorial, hemos elegido el "Main Menu" (menú principal). '''Nota:''' en esta imagen se ha seleccionado "Menú" en el filtro de "Tipo de módulo" de la columna izquierda, para ver solo los módulos de menú y eliminar el resto de módulos de la vista.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-List-Menus-en.png|775px|border]]
# En los detalles del módulo, establece el "Nivel Inicial" (Start level) a 1, el "Nivel Final" (End Level) a "Todos" (All) y "Mostrar elementos del menú" (Show Sub-menu Items) a "Si" (Yes).{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Details-en.png|775px|border]]
# Para este tutorial, hemos añadido algunos estilos en el panel "Avanzado". En la "Clase CSS" (Menu Class Suffix') hemos introducido "navbar-nav nav-pills". Podrías poner "navbar-nav nav-tabs" para obtener un aspecto ligeramente diferente. Nota: hay un espacio antes de ''navbar-nav''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Advanced-Menu-Class-Suffix-en.png|border]]
# Clica sobre "Guardar y Cerrar".{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Save-en.png|border]]
# Ve a la página principal de tu sitio, que debería ser similar al de la imagen. En el Template Protostar, los items de menú en subniveles se muestran como items desplegables.{{-}}[[Image:J3x-Create-Sublevel-Menu-Frontend-Sample-Dropdown-en.png|775px|border]]
# El código fuente generado debería ser similar a este:
<source lang="html4strict">
<ul class="nav menu navbar-nav nav-pills">
<li class="item-101 current active"><a href="/" >Home</a></li>
<li class="item-102"><a class="dropdown-toggle" href="/about-us" >About Us</a></li>
<li class="item-210 deeper parent"><a href="#" >Dogs</a>
<ul class="nav-child unstyled small">
<li class="item-212"><a href="/2015-11-24-14-19-31/collies" >Collies</a></li>
<li class="item-213"><a href="/2015-11-24-14-19-31/pomeranians" >Pomeranians</a></li>
</ul>
</li>
<li class="item-211 deeper parent"><a href="#" >Cats</a>
<ul class="nav-child unstyled small">
<li class="item-214"><a href="/2015-11-24-14-20-12/burmese" >Burmese </a></li>
<li class="item-215"><a href="/2015-11-24-14-20-12/russian-blues" >Russian Blues</a></li>
</ul>
</li>
</ul>
</source>

===Ejemplo 2 - Un Segundo Módulo de Menú con un menú de nivel hijo===

Para mostrar un módulo separado en una posición distinta, siga estos pasos:
# Navega a '''Extensiones'''{{rarr}}'''Módulos''' y localiza o crea un segundo Módulo de Menú asociado con tu menú. Si no estás familiarizado con la creación de módulos de menú, lee: [[S:MyLanguage/Help34:Extensions Module Manager Menu|Módulos de Menú]]{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Control-Panel-en.png|775px|border]]
# Clica sobre el nombre del módulo asociado con tu menú. En este tutorial, hemos elegido "Menú izquierdo" (Left Menu). Nota: en la imagen se aplicó el filtro "Menú" en el desplegable "Tipo de Módulo".{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-List-Menus-2-en.png|775px|border]]
# En los detalles del Módulo, establece '''Nivel Inicial''' a "2", '''Nivel Final''' a "Todos" y '''Mostrar elementos del menú''' a "Si". Nótese que la posición ha cambiado y el menú al que estamos apuntando ahora es el "Menú principal" (Select Menu: Main Menu).{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Details-2-en.png|775px|border]]
# Para este tutorial, hemos usado el panel '''Asignación de menú''' y configurado la '''Asignación del módulo''' para aparecer en todas las páginas excepto la principal.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Module-Assignment-Tab-en.png]]
# Clica sobre "Guardar y Cerrar".{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Save-en.png]]
# Ve a la página principal de tu sitio y navega al artículo "Collies". Tu menú debería ser similar al de la imagen. Nótese que los únicos items mostrados son los subitems hijos.{{-}}[[Image:J3x-Create-Sublevel-Menu-Frontend-Sample-Child-Menu-en.png|775px|border]]
# El código fuente generado debería parecerse a este:
<source lang="html4strict">
<ul class="nav menu">
<li class="item-212 current active"><a href="/2015-11-24-14-19-31/collies" >Collies</a></li>
<li class="item-213"><a href="/2015-11-24-14-19-31/pomeranians" >Pomeranians</a></li>
</ul>
</source>

==Sub-Sub-Menús==
Utilizando esta misma técnica, es fácil crear menús de tres subniveles. Símplemente debes asignar como '''Elemento Principal''' (Parent Menu) del nuevo item de menú, un item de segundo nivel. A continuación, podrías usar la misma técnica para crear un módulo de menú separado que comience en el nivel 2 y termine en el 3. De este modo, solo se mostrarían los items de menú de nivel tres.

<noinclude>
[[Category:Beginners]]
[[Category:Tutorials]]
[[Category:Joomla! 3.x]]
[[Category:Menu Management]]
</noinclude>

Translations:J3.x:Creating a submenu/99/es

2015-12-25T19:28:10Z

Utilizando esta misma técnica, es fácil crear menús de tres subniveles. Símplemente debes asignar como '''Elemento Principal''' (Parent Menu) del nuevo item de menú, un item de segundo nivel. A continuación, podrías usar la misma técnica para crear un módulo de menú separado que comience en el nivel 2 y termine en el 3. De este modo, solo se mostrarían los items de menú de nivel tres.

J3.x:Creating a submenu/es

2015-12-25T19:24:00Z

Framon: Created page with "# El código fuente generado debería parecerse a este:"

<noinclude><languages /></noinclude>
{{Top portal heading|color=white-bkgd|icon=magic|icon-color=#5091cd|size=3x|text-color=#333|title=Tutorial 
Cómo Crear un Submenú en un Sitio Joomla!}}
<noinclude>{{Joomla version|version=3.x}}</noinclude>
En Joomla, los submenús se pueden mostrar de dos formas: bajo dos o más niveles jerárquicos o como un menú modular completamente separado. Esto sirve para construir menús que muestren la jerarquía de navegación entre items (a nivel de padres e hijos), o para mostrar solamente items en un cierto subnivel del menú en una posición del template completamente separada del resto. Para mostrar como hacerlo, iremos creando paso a paso items de menú padres e hijos y veremos como visualizar estos items dentro de un solo gran menú jerárquico, o como un menú separado que solo muestre los items hijos en una posición separada del template. {{-}}
__TOC__
Para empezar, funciones de menú con tres construcciones básicas:
*Artículos - necesitas contenido para enlazar. Pueden ser partes de un componente, otros items de menú, o enlaces externos.
*Menú - describe los elementos del menú, el tipo de navegación, su relación padre/hijo a otros elementos de menú y el orden en que se muestran.
*Módulo de Menú - controla la posición y visualización del menú.

Para este tutorial, comienza ingresando en Joomla como usuario administrador. Si no sabes como ingresar lee el siguiente artículo: [[S:MyLanguage/J3.x:Logging_in_or_out_of_the_Administrator_back-end|Ingresando y saliendo del panel de administración de Joomla]]. {{-}}

'''Nota:''' Para este tutorial necesitas permisos de super administrador o permisos suficientes para crear y modificar artículos, items de menú, y módulos. Para más información sobre Control de Acceso de Usuarios (ACL) lee: [[S:MyLanguage/J3.x:Access Control List Tutorial|Tutorial ACL]].

==Paso 1 - Crea Tus Artículos==
En nuestro ejemplo, vamos a crear items de menú de nivel superior para "Perros" y "Gatos". Bajo Perros, tendremos "Collies" y "Pomeranos". Bajo "Gatos" tendremos "Birmanos" y "Azul Ruso". Así que la estructura de nuestro ejemplo de items de menú será como sigue:

*Perros
**Collies
**Pomeranos
*Gatos
**Birmanos
**Azules Rusos

Primero, crea cuatro artículos para que podamos enlazar nuestos items de menú a ellos: "Collies", "Pomeranos", "Birmanos" y "Azules Rusos". Lee este tutorial si necesitas ayuda para crear un artículo: [[S:MyLanguage/Help34:Content Article Manager Edit|Añadir un nuevo artículo]].

==Paso 2 - Crea los Items de Menú de Nivel Superior==
Para crear la estructura, necesitamos navegar al menú donde queremos que estén nuestros nuevos items. Si es un menú nuevo, necesitarás crearlo. Lee el tutorial sobre como crear un menú: [[S:MyLanguage/J3.x:Adding a new menu|Añadir un nuevo menú]].

Una vez tengas tu menú localizado en el Gestor de Menús, añadirás los items de menú padres usando '''Enlaces del Sistema'''{{rarr}}'''Crear una URL''' para cada enlace de navegación: ''Perros'' y ''Gatos''.

Nótese que hay otros tipos de items de menú que se pueden usar para el nivel padre de la estructura de navegación.

Aquí están los pasos para crear los Items de menú usados en nuestros datos de ejemplo. Para más información sobre creación de Menús lee: [[S:MyLanguage/J3.x:Adding a new menu|Añadir un nuevo menú]]. {{-}}
# Navegue hasta el Gestor de Menú haciendo clic en "Menús"'{{rarr}}"'Menú principal"'{{-}}[[Image:J3x-Edit-Main-Menu-es.jpg|775px|border]]
# En la barra de herramientas, clique sobre "Nuevo"{{-}}[[Image:J3x-Edit-Main-Menu-Toolbar-new-es.png|775px|border]]
# En este ejercicio, crearemos enlaces "contenedores" para los items de nivel superior "Perros" y "Gatos". En el panel "Detalles", clique sobre el botón "Seleccionar" un "Tipo de elemento del menú". En la ventana emergente que aparecerá, seleccionaremos posteriormente '''Enlaces del Sistema'''{{rarr}}'''Crear una URL'''. {{-}}[[Image:J3x-Add-Main-Menu-Select-Type-es.png|775px|border]]
# Clique sobre "Enlaces del sistema", luego deslice hacia abajo y seleccione "Crear una URL".{{-}}[[Image:J3x-Create-Sublevel-Menu-System-External-Url-en.png|775px|border]]
# Añade el '''Título de Menú''' y teclee una parrilla "#" en la caja del '''Enlace'''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Menu-Item-External-Url-en.png|775px|border]]
# Guarda el Item de menú recién creado. {{-}}[[Image:Joomla-3-Menu-Add-Menu-Save-es.png|775px|border]]
# Repite los pasos 2 - 6 para el item de nivel superior "Gatos".

==Paso 3 - Crea los Items de menú de nivel inferior==
Ahora se añadirán los items de menú de nivel inferior seleccionando el Tipo de elemento '''Artículos'''{{rarr}}'''Mostrar un solo artículo''' para crear los enlaces a las páginas de "Collies", "Pomeranos", "Birmanos" y "Azules Rusos". Para cada item de menú creado, estableceremos el "Elemento principal" a "Perros" o "Gatos".

Para información más detallada sobre cómo agregar un elemento del menú que apunta a un Artículo, lea: [[S:MyLanguage/Adding a menu item which points to an Article|Agregar un elemento del menú que apunta a un Artículo]].

'''Nota:''' Hay otros tipos de items que se pueden usar para los subniveles de la estructura de navegación.

# En la barra de herramientas, clique sobre "Nuevo".{{-}}[[Image:J3x-Edit-Main-Menu-Toolbar-new-es.png|775px|border]]
# En el nuevo Item de Menú, clique sobre el botón de selección de "Tipo de elemento del menú".{{-}}[[Image:J3x-Add-Main-Menu-Select-Type-es.png|775px|border]]
# Seleccione '''Artículos'''{{rarr}}'''Mostrar un solo artículo''' de la lista mostrada.{{-}}[[Image:J3x-Add-Main-Menu-Article-Type-es.png|border]]
# De vuelta al panel de "Detalles" de nuevo Item de Menú, clique sobre "Seleccionar artículo" para acceder a la lista de artículos.{{-}}[[Image:J3x-Add-Main-Menu-Article-Select-Article-es.png|border]]
# Seleccione el artículo "Collies" para este ejemplo.{{-}}[[Image:J3x-Create-Sublevel-Menu-Menu-Item-Single-Article-en.png|border]]
# De vuelta al panel de "Detalles" de nuevo Item de Menú, teclee un "Título del elemento del menú". A continuación clique sobre la lista de selección "Elemento principal" situada en la columna más a la derecha. Busque y seleccione el item superior "Perros", deslizándose sobre dicha lista. Nótese que el nivel de menú superior se indica mediante un único trazo "-", el segundo nivel con dos trazos "--", el tercero con tres "---" y así sucesivamente. {{-}}[[Image:J3x-Create-Sublevel-Menu-Select-Parent-Item-en.png|775px|border]]
# Clique sobre el botón "Guardar y cerrar" en la barra de herramientas de arriba.{{-}}[[Image:Joomla-3-Menu-Add-Menu-Save-es.png|775px|border]]
# Repita los pasos del 1 al 7 para los restantes artículos: "Pomeranos" con "Perros" como elemento principal y los artículos "Birmanos" y "Azules Rusos" con elemento principal "Gatos".
# Cuando haya terminado con la sección de "Items de Menú", el gestor de Items del Menú debería tener un aspecto similar al siguiente:{{-}}[[Image:J3x-Create-Sublevel-Menu-Items-en.png|775px|border]]

==Step 4 - Configurar el Módulo de Menú==
En este momento, ya tenemos los artículos e items del menú hechos. Ahora necesitamos actualizar el "Módulo de Menú". En Joomla!, el Módulo del Menú determina tres aspectos importantes:
# La apariencia del menú;
# Dónde se mostrará dentro de la página;
# En qué páginas se mostrará.

Realizaremos dos ejemplos:
* En el primer ejemplo configuraremos parámetros del módulo para mostrar el menú con los items de nivel superior y sus subniveles debajo.
* En el segundo ejemplo añadiremos un módulo de menú a mayores que aparecerá en la columna izquierda y mostrará tan solo los items de menú de segundo nivel.
'''Nota:''' Ambos ejemplos usarán el Template Protostar incluido en la instalación estándar de Joomla!

===Ejemplo 1 - Un Módulo de Menú con Items de Menú de Segundo Nivel===
Para mostrar el módulo del menú, siga estos pasos:
# Navega a '''Extensiones'''{{rarr}}'''Módulos''' y localiza el Módulo de Menú asociado con tu menú ("Main Menú" si tus items están en el menú principal). Si necesitas crear un nuevo módulo y necesitas instrucciones, lee: [[S:MyLanguage/Help34:Extensions Module Manager Menu|Module Menu]] {{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Control-Panel-en.png|775px|border]]
# Clica sobre el nombre del módulo asociado con tu menú. En este tutorial, hemos elegido el "Main Menu" (menú principal). '''Nota:''' en esta imagen se ha seleccionado "Menú" en el filtro de "Tipo de módulo" de la columna izquierda, para ver solo los módulos de menú y eliminar el resto de módulos de la vista.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-List-Menus-en.png|775px|border]]
# En los detalles del módulo, establece el "Nivel Inicial" (Start level) a 1, el "Nivel Final" (End Level) a "Todos" (All) y "Mostrar elementos del menú" (Show Sub-menu Items) a "Si" (Yes).{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Details-en.png|775px|border]]
# Para este tutorial, hemos añadido algunos estilos en el panel "Avanzado". En la "Clase CSS" (Menu Class Suffix') hemos introducido "navbar-nav nav-pills". Podrías poner "navbar-nav nav-tabs" para obtener un aspecto ligeramente diferente. Nota: hay un espacio antes de ''navbar-nav''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Advanced-Menu-Class-Suffix-en.png|border]]
# Clica sobre "Guardar y Cerrar".{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Save-en.png|border]]
# Ve a la página principal de tu sitio, que debería ser similar al de la imagen. En el Template Protostar, los items de menú en subniveles se muestran como items desplegables.{{-}}[[Image:J3x-Create-Sublevel-Menu-Frontend-Sample-Dropdown-en.png|775px|border]]
# El código fuente generado debería ser similar a este:
<source lang="html4strict">
<ul class="nav menu navbar-nav nav-pills">
<li class="item-101 current active"><a href="/" >Home</a></li>
<li class="item-102"><a class="dropdown-toggle" href="/about-us" >About Us</a></li>
<li class="item-210 deeper parent"><a href="#" >Dogs</a>
<ul class="nav-child unstyled small">
<li class="item-212"><a href="/2015-11-24-14-19-31/collies" >Collies</a></li>
<li class="item-213"><a href="/2015-11-24-14-19-31/pomeranians" >Pomeranians</a></li>
</ul>
</li>
<li class="item-211 deeper parent"><a href="#" >Cats</a>
<ul class="nav-child unstyled small">
<li class="item-214"><a href="/2015-11-24-14-20-12/burmese" >Burmese </a></li>
<li class="item-215"><a href="/2015-11-24-14-20-12/russian-blues" >Russian Blues</a></li>
</ul>
</li>
</ul>
</source>

===Ejemplo 2 - Un Segundo Módulo de Menú con un menú de nivel hijo===

Para mostrar un módulo separado en una posición distinta, siga estos pasos:
# Navega a '''Extensiones'''{{rarr}}'''Módulos''' y localiza o crea un segundo Módulo de Menú asociado con tu menú. Si no estás familiarizado con la creación de módulos de menú, lee: [[S:MyLanguage/Help34:Extensions Module Manager Menu|Módulos de Menú]]{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Control-Panel-en.png|775px|border]]
# Clica sobre el nombre del módulo asociado con tu menú. En este tutorial, hemos elegido "Menú izquierdo" (Left Menu). Nota: en la imagen se aplicó el filtro "Menú" en el desplegable "Tipo de Módulo".{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-List-Menus-2-en.png|775px|border]]
# En los detalles del Módulo, establece '''Nivel Inicial''' a "2", '''Nivel Final''' a "Todos" y '''Mostrar elementos del menú''' a "Si". Nótese que la posición ha cambiado y el menú al que estamos apuntando ahora es el "Menú principal" (Select Menu: Main Menu).{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Details-2-en.png|775px|border]]
# Para este tutorial, hemos usado el panel '''Asignación de menú''' y configurado la '''Asignación del módulo''' para aparecer en todas las páginas excepto la principal.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Module-Assignment-Tab-en.png]]
# Clica sobre "Guardar y Cerrar".{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Save-en.png]]
# Ve a la página principal de tu sitio y navega al artículo "Collies". Tu menú debería ser similar al de la imagen. Nótese que los únicos items mostrados son los subitems hijos.{{-}}[[Image:J3x-Create-Sublevel-Menu-Frontend-Sample-Child-Menu-en.png|775px|border]]
# El código fuente generado debería parecerse a este:
<source lang="html4strict">
<ul class="nav menu">
<li class="item-212 current active"><a href="/2015-11-24-14-19-31/collies" >Collies</a></li>
<li class="item-213"><a href="/2015-11-24-14-19-31/pomeranians" >Pomeranians</a></li>
</ul>
</source>

==Sub-Sub-Menús==
Using this same technique, it is easy to create third-level sub-menus. You just make the Parent Menu Item a second-level sub-menu. Then you could use the same technique to create a separate Menu Module with Start Level of 2 and End Level of 3. This would show only the third-level Menu Items.

<noinclude>
[[Category:Beginners]]
[[Category:Tutorials]]
[[Category:Joomla! 3.x]]
[[Category:Menu Management]]
</noinclude>

Translations:J3.x:Creating a submenu/97/es

2015-12-25T19:23:59Z

Framon: Created page with "# El código fuente generado debería parecerse a este:"

# El código fuente generado debería parecerse a este:

J3.x:Creating a submenu/es

2015-12-25T19:23:39Z

Framon: Created page with "# Ve a la página principal de tu sitio y navega al artículo "Collies". Tu menú debería ser similar al de la imagen. Nótese que los únicos items mostrados son los subitem..."

<noinclude><languages /></noinclude>
{{Top portal heading|color=white-bkgd|icon=magic|icon-color=#5091cd|size=3x|text-color=#333|title=Tutorial 
Cómo Crear un Submenú en un Sitio Joomla!}}
<noinclude>{{Joomla version|version=3.x}}</noinclude>
En Joomla, los submenús se pueden mostrar de dos formas: bajo dos o más niveles jerárquicos o como un menú modular completamente separado. Esto sirve para construir menús que muestren la jerarquía de navegación entre items (a nivel de padres e hijos), o para mostrar solamente items en un cierto subnivel del menú en una posición del template completamente separada del resto. Para mostrar como hacerlo, iremos creando paso a paso items de menú padres e hijos y veremos como visualizar estos items dentro de un solo gran menú jerárquico, o como un menú separado que solo muestre los items hijos en una posición separada del template. {{-}}
__TOC__
Para empezar, funciones de menú con tres construcciones básicas:
*Artículos - necesitas contenido para enlazar. Pueden ser partes de un componente, otros items de menú, o enlaces externos.
*Menú - describe los elementos del menú, el tipo de navegación, su relación padre/hijo a otros elementos de menú y el orden en que se muestran.
*Módulo de Menú - controla la posición y visualización del menú.

Para este tutorial, comienza ingresando en Joomla como usuario administrador. Si no sabes como ingresar lee el siguiente artículo: [[S:MyLanguage/J3.x:Logging_in_or_out_of_the_Administrator_back-end|Ingresando y saliendo del panel de administración de Joomla]]. {{-}}

'''Nota:''' Para este tutorial necesitas permisos de super administrador o permisos suficientes para crear y modificar artículos, items de menú, y módulos. Para más información sobre Control de Acceso de Usuarios (ACL) lee: [[S:MyLanguage/J3.x:Access Control List Tutorial|Tutorial ACL]].

==Paso 1 - Crea Tus Artículos==
En nuestro ejemplo, vamos a crear items de menú de nivel superior para "Perros" y "Gatos". Bajo Perros, tendremos "Collies" y "Pomeranos". Bajo "Gatos" tendremos "Birmanos" y "Azul Ruso". Así que la estructura de nuestro ejemplo de items de menú será como sigue:

*Perros
**Collies
**Pomeranos
*Gatos
**Birmanos
**Azules Rusos

Primero, crea cuatro artículos para que podamos enlazar nuestos items de menú a ellos: "Collies", "Pomeranos", "Birmanos" y "Azules Rusos". Lee este tutorial si necesitas ayuda para crear un artículo: [[S:MyLanguage/Help34:Content Article Manager Edit|Añadir un nuevo artículo]].

==Paso 2 - Crea los Items de Menú de Nivel Superior==
Para crear la estructura, necesitamos navegar al menú donde queremos que estén nuestros nuevos items. Si es un menú nuevo, necesitarás crearlo. Lee el tutorial sobre como crear un menú: [[S:MyLanguage/J3.x:Adding a new menu|Añadir un nuevo menú]].

Una vez tengas tu menú localizado en el Gestor de Menús, añadirás los items de menú padres usando '''Enlaces del Sistema'''{{rarr}}'''Crear una URL''' para cada enlace de navegación: ''Perros'' y ''Gatos''.

Nótese que hay otros tipos de items de menú que se pueden usar para el nivel padre de la estructura de navegación.

Aquí están los pasos para crear los Items de menú usados en nuestros datos de ejemplo. Para más información sobre creación de Menús lee: [[S:MyLanguage/J3.x:Adding a new menu|Añadir un nuevo menú]]. {{-}}
# Navegue hasta el Gestor de Menú haciendo clic en "Menús"'{{rarr}}"'Menú principal"'{{-}}[[Image:J3x-Edit-Main-Menu-es.jpg|775px|border]]
# En la barra de herramientas, clique sobre "Nuevo"{{-}}[[Image:J3x-Edit-Main-Menu-Toolbar-new-es.png|775px|border]]
# En este ejercicio, crearemos enlaces "contenedores" para los items de nivel superior "Perros" y "Gatos". En el panel "Detalles", clique sobre el botón "Seleccionar" un "Tipo de elemento del menú". En la ventana emergente que aparecerá, seleccionaremos posteriormente '''Enlaces del Sistema'''{{rarr}}'''Crear una URL'''. {{-}}[[Image:J3x-Add-Main-Menu-Select-Type-es.png|775px|border]]
# Clique sobre "Enlaces del sistema", luego deslice hacia abajo y seleccione "Crear una URL".{{-}}[[Image:J3x-Create-Sublevel-Menu-System-External-Url-en.png|775px|border]]
# Añade el '''Título de Menú''' y teclee una parrilla "#" en la caja del '''Enlace'''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Menu-Item-External-Url-en.png|775px|border]]
# Guarda el Item de menú recién creado. {{-}}[[Image:Joomla-3-Menu-Add-Menu-Save-es.png|775px|border]]
# Repite los pasos 2 - 6 para el item de nivel superior "Gatos".

==Paso 3 - Crea los Items de menú de nivel inferior==
Ahora se añadirán los items de menú de nivel inferior seleccionando el Tipo de elemento '''Artículos'''{{rarr}}'''Mostrar un solo artículo''' para crear los enlaces a las páginas de "Collies", "Pomeranos", "Birmanos" y "Azules Rusos". Para cada item de menú creado, estableceremos el "Elemento principal" a "Perros" o "Gatos".

Para información más detallada sobre cómo agregar un elemento del menú que apunta a un Artículo, lea: [[S:MyLanguage/Adding a menu item which points to an Article|Agregar un elemento del menú que apunta a un Artículo]].

'''Nota:''' Hay otros tipos de items que se pueden usar para los subniveles de la estructura de navegación.

# En la barra de herramientas, clique sobre "Nuevo".{{-}}[[Image:J3x-Edit-Main-Menu-Toolbar-new-es.png|775px|border]]
# En el nuevo Item de Menú, clique sobre el botón de selección de "Tipo de elemento del menú".{{-}}[[Image:J3x-Add-Main-Menu-Select-Type-es.png|775px|border]]
# Seleccione '''Artículos'''{{rarr}}'''Mostrar un solo artículo''' de la lista mostrada.{{-}}[[Image:J3x-Add-Main-Menu-Article-Type-es.png|border]]
# De vuelta al panel de "Detalles" de nuevo Item de Menú, clique sobre "Seleccionar artículo" para acceder a la lista de artículos.{{-}}[[Image:J3x-Add-Main-Menu-Article-Select-Article-es.png|border]]
# Seleccione el artículo "Collies" para este ejemplo.{{-}}[[Image:J3x-Create-Sublevel-Menu-Menu-Item-Single-Article-en.png|border]]
# De vuelta al panel de "Detalles" de nuevo Item de Menú, teclee un "Título del elemento del menú". A continuación clique sobre la lista de selección "Elemento principal" situada en la columna más a la derecha. Busque y seleccione el item superior "Perros", deslizándose sobre dicha lista. Nótese que el nivel de menú superior se indica mediante un único trazo "-", el segundo nivel con dos trazos "--", el tercero con tres "---" y así sucesivamente. {{-}}[[Image:J3x-Create-Sublevel-Menu-Select-Parent-Item-en.png|775px|border]]
# Clique sobre el botón "Guardar y cerrar" en la barra de herramientas de arriba.{{-}}[[Image:Joomla-3-Menu-Add-Menu-Save-es.png|775px|border]]
# Repita los pasos del 1 al 7 para los restantes artículos: "Pomeranos" con "Perros" como elemento principal y los artículos "Birmanos" y "Azules Rusos" con elemento principal "Gatos".
# Cuando haya terminado con la sección de "Items de Menú", el gestor de Items del Menú debería tener un aspecto similar al siguiente:{{-}}[[Image:J3x-Create-Sublevel-Menu-Items-en.png|775px|border]]

==Step 4 - Configurar el Módulo de Menú==
En este momento, ya tenemos los artículos e items del menú hechos. Ahora necesitamos actualizar el "Módulo de Menú". En Joomla!, el Módulo del Menú determina tres aspectos importantes:
# La apariencia del menú;
# Dónde se mostrará dentro de la página;
# En qué páginas se mostrará.

Realizaremos dos ejemplos:
* En el primer ejemplo configuraremos parámetros del módulo para mostrar el menú con los items de nivel superior y sus subniveles debajo.
* En el segundo ejemplo añadiremos un módulo de menú a mayores que aparecerá en la columna izquierda y mostrará tan solo los items de menú de segundo nivel.
'''Nota:''' Ambos ejemplos usarán el Template Protostar incluido en la instalación estándar de Joomla!

===Ejemplo 1 - Un Módulo de Menú con Items de Menú de Segundo Nivel===
Para mostrar el módulo del menú, siga estos pasos:
# Navega a '''Extensiones'''{{rarr}}'''Módulos''' y localiza el Módulo de Menú asociado con tu menú ("Main Menú" si tus items están en el menú principal). Si necesitas crear un nuevo módulo y necesitas instrucciones, lee: [[S:MyLanguage/Help34:Extensions Module Manager Menu|Module Menu]] {{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Control-Panel-en.png|775px|border]]
# Clica sobre el nombre del módulo asociado con tu menú. En este tutorial, hemos elegido el "Main Menu" (menú principal). '''Nota:''' en esta imagen se ha seleccionado "Menú" en el filtro de "Tipo de módulo" de la columna izquierda, para ver solo los módulos de menú y eliminar el resto de módulos de la vista.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-List-Menus-en.png|775px|border]]
# En los detalles del módulo, establece el "Nivel Inicial" (Start level) a 1, el "Nivel Final" (End Level) a "Todos" (All) y "Mostrar elementos del menú" (Show Sub-menu Items) a "Si" (Yes).{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Details-en.png|775px|border]]
# Para este tutorial, hemos añadido algunos estilos en el panel "Avanzado". En la "Clase CSS" (Menu Class Suffix') hemos introducido "navbar-nav nav-pills". Podrías poner "navbar-nav nav-tabs" para obtener un aspecto ligeramente diferente. Nota: hay un espacio antes de ''navbar-nav''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Advanced-Menu-Class-Suffix-en.png|border]]
# Clica sobre "Guardar y Cerrar".{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Save-en.png|border]]
# Ve a la página principal de tu sitio, que debería ser similar al de la imagen. En el Template Protostar, los items de menú en subniveles se muestran como items desplegables.{{-}}[[Image:J3x-Create-Sublevel-Menu-Frontend-Sample-Dropdown-en.png|775px|border]]
# El código fuente generado debería ser similar a este:
<source lang="html4strict">
<ul class="nav menu navbar-nav nav-pills">
<li class="item-101 current active"><a href="/" >Home</a></li>
<li class="item-102"><a class="dropdown-toggle" href="/about-us" >About Us</a></li>
<li class="item-210 deeper parent"><a href="#" >Dogs</a>
<ul class="nav-child unstyled small">
<li class="item-212"><a href="/2015-11-24-14-19-31/collies" >Collies</a></li>
<li class="item-213"><a href="/2015-11-24-14-19-31/pomeranians" >Pomeranians</a></li>
</ul>
</li>
<li class="item-211 deeper parent"><a href="#" >Cats</a>
<ul class="nav-child unstyled small">
<li class="item-214"><a href="/2015-11-24-14-20-12/burmese" >Burmese </a></li>
<li class="item-215"><a href="/2015-11-24-14-20-12/russian-blues" >Russian Blues</a></li>
</ul>
</li>
</ul>
</source>

===Ejemplo 2 - Un Segundo Módulo de Menú con un menú de nivel hijo===

Para mostrar un módulo separado en una posición distinta, siga estos pasos:
# Navega a '''Extensiones'''{{rarr}}'''Módulos''' y localiza o crea un segundo Módulo de Menú asociado con tu menú. Si no estás familiarizado con la creación de módulos de menú, lee: [[S:MyLanguage/Help34:Extensions Module Manager Menu|Módulos de Menú]]{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Control-Panel-en.png|775px|border]]
# Clica sobre el nombre del módulo asociado con tu menú. En este tutorial, hemos elegido "Menú izquierdo" (Left Menu). Nota: en la imagen se aplicó el filtro "Menú" en el desplegable "Tipo de Módulo".{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-List-Menus-2-en.png|775px|border]]
# En los detalles del Módulo, establece '''Nivel Inicial''' a "2", '''Nivel Final''' a "Todos" y '''Mostrar elementos del menú''' a "Si". Nótese que la posición ha cambiado y el menú al que estamos apuntando ahora es el "Menú principal" (Select Menu: Main Menu).{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Details-2-en.png|775px|border]]
# Para este tutorial, hemos usado el panel '''Asignación de menú''' y configurado la '''Asignación del módulo''' para aparecer en todas las páginas excepto la principal.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Module-Assignment-Tab-en.png]]
# Clica sobre "Guardar y Cerrar".{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Save-en.png]]
# Ve a la página principal de tu sitio y navega al artículo "Collies". Tu menú debería ser similar al de la imagen. Nótese que los únicos items mostrados son los subitems hijos.{{-}}[[Image:J3x-Create-Sublevel-Menu-Frontend-Sample-Child-Menu-en.png|775px|border]]
# The source code generated will look similar to this:
<source lang="html4strict">
<ul class="nav menu">
<li class="item-212 current active"><a href="/2015-11-24-14-19-31/collies" >Collies</a></li>
<li class="item-213"><a href="/2015-11-24-14-19-31/pomeranians" >Pomeranians</a></li>
</ul>
</source>

==Sub-Sub-Menús==
Using this same technique, it is easy to create third-level sub-menus. You just make the Parent Menu Item a second-level sub-menu. Then you could use the same technique to create a separate Menu Module with Start Level of 2 and End Level of 3. This would show only the third-level Menu Items.

<noinclude>
[[Category:Beginners]]
[[Category:Tutorials]]
[[Category:Joomla! 3.x]]
[[Category:Menu Management]]
</noinclude>

Translations:J3.x:Creating a submenu/95/es

2015-12-25T19:23:39Z

# Ve a la página principal de tu sitio y navega al artículo "Collies". Tu menú debería ser similar al de la imagen. Nótese que los únicos items mostrados son los subitems hijos.

J3.x:Creating a submenu/es

2015-12-25T19:21:42Z

Framon: Created page with "# Clica sobre "Guardar y Cerrar"."

<noinclude><languages /></noinclude>
{{Top portal heading|color=white-bkgd|icon=magic|icon-color=#5091cd|size=3x|text-color=#333|title=Tutorial 
Cómo Crear un Submenú en un Sitio Joomla!}}
<noinclude>{{Joomla version|version=3.x}}</noinclude>
En Joomla, los submenús se pueden mostrar de dos formas: bajo dos o más niveles jerárquicos o como un menú modular completamente separado. Esto sirve para construir menús que muestren la jerarquía de navegación entre items (a nivel de padres e hijos), o para mostrar solamente items en un cierto subnivel del menú en una posición del template completamente separada del resto. Para mostrar como hacerlo, iremos creando paso a paso items de menú padres e hijos y veremos como visualizar estos items dentro de un solo gran menú jerárquico, o como un menú separado que solo muestre los items hijos en una posición separada del template. {{-}}
__TOC__
Para empezar, funciones de menú con tres construcciones básicas:
*Artículos - necesitas contenido para enlazar. Pueden ser partes de un componente, otros items de menú, o enlaces externos.
*Menú - describe los elementos del menú, el tipo de navegación, su relación padre/hijo a otros elementos de menú y el orden en que se muestran.
*Módulo de Menú - controla la posición y visualización del menú.

Para este tutorial, comienza ingresando en Joomla como usuario administrador. Si no sabes como ingresar lee el siguiente artículo: [[S:MyLanguage/J3.x:Logging_in_or_out_of_the_Administrator_back-end|Ingresando y saliendo del panel de administración de Joomla]]. {{-}}

'''Nota:''' Para este tutorial necesitas permisos de super administrador o permisos suficientes para crear y modificar artículos, items de menú, y módulos. Para más información sobre Control de Acceso de Usuarios (ACL) lee: [[S:MyLanguage/J3.x:Access Control List Tutorial|Tutorial ACL]].

==Paso 1 - Crea Tus Artículos==
En nuestro ejemplo, vamos a crear items de menú de nivel superior para "Perros" y "Gatos". Bajo Perros, tendremos "Collies" y "Pomeranos". Bajo "Gatos" tendremos "Birmanos" y "Azul Ruso". Así que la estructura de nuestro ejemplo de items de menú será como sigue:

*Perros
**Collies
**Pomeranos
*Gatos
**Birmanos
**Azules Rusos

Primero, crea cuatro artículos para que podamos enlazar nuestos items de menú a ellos: "Collies", "Pomeranos", "Birmanos" y "Azules Rusos". Lee este tutorial si necesitas ayuda para crear un artículo: [[S:MyLanguage/Help34:Content Article Manager Edit|Añadir un nuevo artículo]].

==Paso 2 - Crea los Items de Menú de Nivel Superior==
Para crear la estructura, necesitamos navegar al menú donde queremos que estén nuestros nuevos items. Si es un menú nuevo, necesitarás crearlo. Lee el tutorial sobre como crear un menú: [[S:MyLanguage/J3.x:Adding a new menu|Añadir un nuevo menú]].

Una vez tengas tu menú localizado en el Gestor de Menús, añadirás los items de menú padres usando '''Enlaces del Sistema'''{{rarr}}'''Crear una URL''' para cada enlace de navegación: ''Perros'' y ''Gatos''.

Nótese que hay otros tipos de items de menú que se pueden usar para el nivel padre de la estructura de navegación.

Aquí están los pasos para crear los Items de menú usados en nuestros datos de ejemplo. Para más información sobre creación de Menús lee: [[S:MyLanguage/J3.x:Adding a new menu|Añadir un nuevo menú]]. {{-}}
# Navegue hasta el Gestor de Menú haciendo clic en "Menús"'{{rarr}}"'Menú principal"'{{-}}[[Image:J3x-Edit-Main-Menu-es.jpg|775px|border]]
# En la barra de herramientas, clique sobre "Nuevo"{{-}}[[Image:J3x-Edit-Main-Menu-Toolbar-new-es.png|775px|border]]
# En este ejercicio, crearemos enlaces "contenedores" para los items de nivel superior "Perros" y "Gatos". En el panel "Detalles", clique sobre el botón "Seleccionar" un "Tipo de elemento del menú". En la ventana emergente que aparecerá, seleccionaremos posteriormente '''Enlaces del Sistema'''{{rarr}}'''Crear una URL'''. {{-}}[[Image:J3x-Add-Main-Menu-Select-Type-es.png|775px|border]]
# Clique sobre "Enlaces del sistema", luego deslice hacia abajo y seleccione "Crear una URL".{{-}}[[Image:J3x-Create-Sublevel-Menu-System-External-Url-en.png|775px|border]]
# Añade el '''Título de Menú''' y teclee una parrilla "#" en la caja del '''Enlace'''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Menu-Item-External-Url-en.png|775px|border]]
# Guarda el Item de menú recién creado. {{-}}[[Image:Joomla-3-Menu-Add-Menu-Save-es.png|775px|border]]
# Repite los pasos 2 - 6 para el item de nivel superior "Gatos".

==Paso 3 - Crea los Items de menú de nivel inferior==
Ahora se añadirán los items de menú de nivel inferior seleccionando el Tipo de elemento '''Artículos'''{{rarr}}'''Mostrar un solo artículo''' para crear los enlaces a las páginas de "Collies", "Pomeranos", "Birmanos" y "Azules Rusos". Para cada item de menú creado, estableceremos el "Elemento principal" a "Perros" o "Gatos".

Para información más detallada sobre cómo agregar un elemento del menú que apunta a un Artículo, lea: [[S:MyLanguage/Adding a menu item which points to an Article|Agregar un elemento del menú que apunta a un Artículo]].

'''Nota:''' Hay otros tipos de items que se pueden usar para los subniveles de la estructura de navegación.

# En la barra de herramientas, clique sobre "Nuevo".{{-}}[[Image:J3x-Edit-Main-Menu-Toolbar-new-es.png|775px|border]]
# En el nuevo Item de Menú, clique sobre el botón de selección de "Tipo de elemento del menú".{{-}}[[Image:J3x-Add-Main-Menu-Select-Type-es.png|775px|border]]
# Seleccione '''Artículos'''{{rarr}}'''Mostrar un solo artículo''' de la lista mostrada.{{-}}[[Image:J3x-Add-Main-Menu-Article-Type-es.png|border]]
# De vuelta al panel de "Detalles" de nuevo Item de Menú, clique sobre "Seleccionar artículo" para acceder a la lista de artículos.{{-}}[[Image:J3x-Add-Main-Menu-Article-Select-Article-es.png|border]]
# Seleccione el artículo "Collies" para este ejemplo.{{-}}[[Image:J3x-Create-Sublevel-Menu-Menu-Item-Single-Article-en.png|border]]
# De vuelta al panel de "Detalles" de nuevo Item de Menú, teclee un "Título del elemento del menú". A continuación clique sobre la lista de selección "Elemento principal" situada en la columna más a la derecha. Busque y seleccione el item superior "Perros", deslizándose sobre dicha lista. Nótese que el nivel de menú superior se indica mediante un único trazo "-", el segundo nivel con dos trazos "--", el tercero con tres "---" y así sucesivamente. {{-}}[[Image:J3x-Create-Sublevel-Menu-Select-Parent-Item-en.png|775px|border]]
# Clique sobre el botón "Guardar y cerrar" en la barra de herramientas de arriba.{{-}}[[Image:Joomla-3-Menu-Add-Menu-Save-es.png|775px|border]]
# Repita los pasos del 1 al 7 para los restantes artículos: "Pomeranos" con "Perros" como elemento principal y los artículos "Birmanos" y "Azules Rusos" con elemento principal "Gatos".
# Cuando haya terminado con la sección de "Items de Menú", el gestor de Items del Menú debería tener un aspecto similar al siguiente:{{-}}[[Image:J3x-Create-Sublevel-Menu-Items-en.png|775px|border]]

==Step 4 - Configurar el Módulo de Menú==
En este momento, ya tenemos los artículos e items del menú hechos. Ahora necesitamos actualizar el "Módulo de Menú". En Joomla!, el Módulo del Menú determina tres aspectos importantes:
# La apariencia del menú;
# Dónde se mostrará dentro de la página;
# En qué páginas se mostrará.

Realizaremos dos ejemplos:
* En el primer ejemplo configuraremos parámetros del módulo para mostrar el menú con los items de nivel superior y sus subniveles debajo.
* En el segundo ejemplo añadiremos un módulo de menú a mayores que aparecerá en la columna izquierda y mostrará tan solo los items de menú de segundo nivel.
'''Nota:''' Ambos ejemplos usarán el Template Protostar incluido en la instalación estándar de Joomla!

===Ejemplo 1 - Un Módulo de Menú con Items de Menú de Segundo Nivel===
Para mostrar el módulo del menú, siga estos pasos:
# Navega a '''Extensiones'''{{rarr}}'''Módulos''' y localiza el Módulo de Menú asociado con tu menú ("Main Menú" si tus items están en el menú principal). Si necesitas crear un nuevo módulo y necesitas instrucciones, lee: [[S:MyLanguage/Help34:Extensions Module Manager Menu|Module Menu]] {{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Control-Panel-en.png|775px|border]]
# Clica sobre el nombre del módulo asociado con tu menú. En este tutorial, hemos elegido el "Main Menu" (menú principal). '''Nota:''' en esta imagen se ha seleccionado "Menú" en el filtro de "Tipo de módulo" de la columna izquierda, para ver solo los módulos de menú y eliminar el resto de módulos de la vista.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-List-Menus-en.png|775px|border]]
# En los detalles del módulo, establece el "Nivel Inicial" (Start level) a 1, el "Nivel Final" (End Level) a "Todos" (All) y "Mostrar elementos del menú" (Show Sub-menu Items) a "Si" (Yes).{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Details-en.png|775px|border]]
# Para este tutorial, hemos añadido algunos estilos en el panel "Avanzado". En la "Clase CSS" (Menu Class Suffix') hemos introducido "navbar-nav nav-pills". Podrías poner "navbar-nav nav-tabs" para obtener un aspecto ligeramente diferente. Nota: hay un espacio antes de ''navbar-nav''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Advanced-Menu-Class-Suffix-en.png|border]]
# Clica sobre "Guardar y Cerrar".{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Save-en.png|border]]
# Ve a la página principal de tu sitio, que debería ser similar al de la imagen. En el Template Protostar, los items de menú en subniveles se muestran como items desplegables.{{-}}[[Image:J3x-Create-Sublevel-Menu-Frontend-Sample-Dropdown-en.png|775px|border]]
# El código fuente generado debería ser similar a este:
<source lang="html4strict">
<ul class="nav menu navbar-nav nav-pills">
<li class="item-101 current active"><a href="/" >Home</a></li>
<li class="item-102"><a class="dropdown-toggle" href="/about-us" >About Us</a></li>
<li class="item-210 deeper parent"><a href="#" >Dogs</a>
<ul class="nav-child unstyled small">
<li class="item-212"><a href="/2015-11-24-14-19-31/collies" >Collies</a></li>
<li class="item-213"><a href="/2015-11-24-14-19-31/pomeranians" >Pomeranians</a></li>
</ul>
</li>
<li class="item-211 deeper parent"><a href="#" >Cats</a>
<ul class="nav-child unstyled small">
<li class="item-214"><a href="/2015-11-24-14-20-12/burmese" >Burmese </a></li>
<li class="item-215"><a href="/2015-11-24-14-20-12/russian-blues" >Russian Blues</a></li>
</ul>
</li>
</ul>
</source>

===Ejemplo 2 - Un Segundo Módulo de Menú con un menú de nivel hijo===

Para mostrar un módulo separado en una posición distinta, siga estos pasos:
# Navega a '''Extensiones'''{{rarr}}'''Módulos''' y localiza o crea un segundo Módulo de Menú asociado con tu menú. Si no estás familiarizado con la creación de módulos de menú, lee: [[S:MyLanguage/Help34:Extensions Module Manager Menu|Módulos de Menú]]{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Control-Panel-en.png|775px|border]]
# Clica sobre el nombre del módulo asociado con tu menú. En este tutorial, hemos elegido "Menú izquierdo" (Left Menu). Nota: en la imagen se aplicó el filtro "Menú" en el desplegable "Tipo de Módulo".{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-List-Menus-2-en.png|775px|border]]
# En los detalles del Módulo, establece '''Nivel Inicial''' a "2", '''Nivel Final''' a "Todos" y '''Mostrar elementos del menú''' a "Si". Nótese que la posición ha cambiado y el menú al que estamos apuntando ahora es el "Menú principal" (Select Menu: Main Menu).{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Details-2-en.png|775px|border]]
# Para este tutorial, hemos usado el panel '''Asignación de menú''' y configurado la '''Asignación del módulo''' para aparecer en todas las páginas excepto la principal.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Module-Assignment-Tab-en.png]]
# Clica sobre "Guardar y Cerrar".{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Save-en.png]]
# Go to the frontend of your site and navigate to the ''Collies'' article. Your menu should look similar to this. Notice the child level subitems are the only items showing.{{-}}[[Image:J3x-Create-Sublevel-Menu-Frontend-Sample-Child-Menu-en.png|775px|border]]
# The source code generated will look similar to this:
<source lang="html4strict">
<ul class="nav menu">
<li class="item-212 current active"><a href="/2015-11-24-14-19-31/collies" >Collies</a></li>
<li class="item-213"><a href="/2015-11-24-14-19-31/pomeranians" >Pomeranians</a></li>
</ul>
</source>

==Sub-Sub-Menús==
Using this same technique, it is easy to create third-level sub-menus. You just make the Parent Menu Item a second-level sub-menu. Then you could use the same technique to create a separate Menu Module with Start Level of 2 and End Level of 3. This would show only the third-level Menu Items.

<noinclude>
[[Category:Beginners]]
[[Category:Tutorials]]
[[Category:Joomla! 3.x]]
[[Category:Menu Management]]
</noinclude>

Translations:J3.x:Creating a submenu/93/es

2015-12-25T19:21:42Z

2015-12-25T19:17:49Z

Framon:

# En los detalles del Módulo, establece '''Nivel Inicial''' a "2", '''Nivel Final''' a "Todos" y '''Mostrar elementos del menú''' a "Si". Nótese que la posición ha cambiado y el menú al que estamos apuntando ahora es el "Menú principal" (Select Menu: Main Menu).

J3.x:Creating a submenu/es

2015-12-25T19:15:57Z

Framon:

<noinclude><languages /></noinclude>
{{Top portal heading|color=white-bkgd|icon=magic|icon-color=#5091cd|size=3x|text-color=#333|title=Tutorial 
Cómo Crear un Submenú en un Sitio Joomla!}}
<noinclude>{{Joomla version|version=3.x}}</noinclude>
En Joomla, los submenús se pueden mostrar de dos formas: bajo dos o más niveles jerárquicos o como un menú modular completamente separado. Esto sirve para construir menús que muestren la jerarquía de navegación entre items (a nivel de padres e hijos), o para mostrar solamente items en un cierto subnivel del menú en una posición del template completamente separada del resto. Para mostrar como hacerlo, iremos creando paso a paso items de menú padres e hijos y veremos como visualizar estos items dentro de un solo gran menú jerárquico, o como un menú separado que solo muestre los items hijos en una posición separada del template. {{-}}
__TOC__
Para empezar, funciones de menú con tres construcciones básicas:
*Artículos - necesitas contenido para enlazar. Pueden ser partes de un componente, otros items de menú, o enlaces externos.
*Menú - describe los elementos del menú, el tipo de navegación, su relación padre/hijo a otros elementos de menú y el orden en que se muestran.
*Módulo de Menú - controla la posición y visualización del menú.

Para este tutorial, comienza ingresando en Joomla como usuario administrador. Si no sabes como ingresar lee el siguiente artículo: [[S:MyLanguage/J3.x:Logging_in_or_out_of_the_Administrator_back-end|Ingresando y saliendo del panel de administración de Joomla]]. {{-}}

'''Nota:''' Para este tutorial necesitas permisos de super administrador o permisos suficientes para crear y modificar artículos, items de menú, y módulos. Para más información sobre Control de Acceso de Usuarios (ACL) lee: [[S:MyLanguage/J3.x:Access Control List Tutorial|Tutorial ACL]].

==Paso 1 - Crea Tus Artículos==
En nuestro ejemplo, vamos a crear items de menú de nivel superior para "Perros" y "Gatos". Bajo Perros, tendremos "Collies" y "Pomeranos". Bajo "Gatos" tendremos "Birmanos" y "Azul Ruso". Así que la estructura de nuestro ejemplo de items de menú será como sigue:

*Perros
**Collies
**Pomeranos
*Gatos
**Birmanos
**Azules Rusos

Primero, crea cuatro artículos para que podamos enlazar nuestos items de menú a ellos: "Collies", "Pomeranos", "Birmanos" y "Azules Rusos". Lee este tutorial si necesitas ayuda para crear un artículo: [[S:MyLanguage/Help34:Content Article Manager Edit|Añadir un nuevo artículo]].

==Paso 2 - Crea los Items de Menú de Nivel Superior==
Para crear la estructura, necesitamos navegar al menú donde queremos que estén nuestros nuevos items. Si es un menú nuevo, necesitarás crearlo. Lee el tutorial sobre como crear un menú: [[S:MyLanguage/J3.x:Adding a new menu|Añadir un nuevo menú]].

Una vez tengas tu menú localizado en el Gestor de Menús, añadirás los items de menú padres usando '''Enlaces del Sistema'''{{rarr}}'''Crear una URL''' para cada enlace de navegación: ''Perros'' y ''Gatos''.

Nótese que hay otros tipos de items de menú que se pueden usar para el nivel padre de la estructura de navegación.

Aquí están los pasos para crear los Items de menú usados en nuestros datos de ejemplo. Para más información sobre creación de Menús lee: [[S:MyLanguage/J3.x:Adding a new menu|Añadir un nuevo menú]]. {{-}}
# Navegue hasta el Gestor de Menú haciendo clic en "Menús"'{{rarr}}"'Menú principal"'{{-}}[[Image:J3x-Edit-Main-Menu-es.jpg|775px|border]]
# En la barra de herramientas, clique sobre "Nuevo"{{-}}[[Image:J3x-Edit-Main-Menu-Toolbar-new-es.png|775px|border]]
# En este ejercicio, crearemos enlaces "contenedores" para los items de nivel superior "Perros" y "Gatos". En el panel "Detalles", clique sobre el botón "Seleccionar" un "Tipo de elemento del menú". En la ventana emergente que aparecerá, seleccionaremos posteriormente '''Enlaces del Sistema'''{{rarr}}'''Crear una URL'''. {{-}}[[Image:J3x-Add-Main-Menu-Select-Type-es.png|775px|border]]
# Clique sobre "Enlaces del sistema", luego deslice hacia abajo y seleccione "Crear una URL".{{-}}[[Image:J3x-Create-Sublevel-Menu-System-External-Url-en.png|775px|border]]
# Añade el '''Título de Menú''' y teclee una parrilla "#" en la caja del '''Enlace'''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Menu-Item-External-Url-en.png|775px|border]]
# Guarda el Item de menú recién creado. {{-}}[[Image:Joomla-3-Menu-Add-Menu-Save-es.png|775px|border]]
# Repite los pasos 2 - 6 para el item de nivel superior "Gatos".

==Paso 3 - Crea los Items de menú de nivel inferior==
Ahora se añadirán los items de menú de nivel inferior seleccionando el Tipo de elemento '''Artículos'''{{rarr}}'''Mostrar un solo artículo''' para crear los enlaces a las páginas de "Collies", "Pomeranos", "Birmanos" y "Azules Rusos". Para cada item de menú creado, estableceremos el "Elemento principal" a "Perros" o "Gatos".

Para información más detallada sobre cómo agregar un elemento del menú que apunta a un Artículo, lea: [[S:MyLanguage/Adding a menu item which points to an Article|Agregar un elemento del menú que apunta a un Artículo]].

'''Nota:''' Hay otros tipos de items que se pueden usar para los subniveles de la estructura de navegación.

# En la barra de herramientas, clique sobre "Nuevo".{{-}}[[Image:J3x-Edit-Main-Menu-Toolbar-new-es.png|775px|border]]
# En el nuevo Item de Menú, clique sobre el botón de selección de "Tipo de elemento del menú".{{-}}[[Image:J3x-Add-Main-Menu-Select-Type-es.png|775px|border]]
# Seleccione '''Artículos'''{{rarr}}'''Mostrar un solo artículo''' de la lista mostrada.{{-}}[[Image:J3x-Add-Main-Menu-Article-Type-es.png|border]]
# De vuelta al panel de "Detalles" de nuevo Item de Menú, clique sobre "Seleccionar artículo" para acceder a la lista de artículos.{{-}}[[Image:J3x-Add-Main-Menu-Article-Select-Article-es.png|border]]
# Seleccione el artículo "Collies" para este ejemplo.{{-}}[[Image:J3x-Create-Sublevel-Menu-Menu-Item-Single-Article-en.png|border]]
# De vuelta al panel de "Detalles" de nuevo Item de Menú, teclee un "Título del elemento del menú". A continuación clique sobre la lista de selección "Elemento principal" situada en la columna más a la derecha. Busque y seleccione el item superior "Perros", deslizándose sobre dicha lista. Nótese que el nivel de menú superior se indica mediante un único trazo "-", el segundo nivel con dos trazos "--", el tercero con tres "---" y así sucesivamente. {{-}}[[Image:J3x-Create-Sublevel-Menu-Select-Parent-Item-en.png|775px|border]]
# Clique sobre el botón "Guardar y cerrar" en la barra de herramientas de arriba.{{-}}[[Image:Joomla-3-Menu-Add-Menu-Save-es.png|775px|border]]
# Repita los pasos del 1 al 7 para los restantes artículos: "Pomeranos" con "Perros" como elemento principal y los artículos "Birmanos" y "Azules Rusos" con elemento principal "Gatos".
# Cuando haya terminado con la sección de "Items de Menú", el gestor de Items del Menú debería tener un aspecto similar al siguiente:{{-}}[[Image:J3x-Create-Sublevel-Menu-Items-en.png|775px|border]]

==Step 4 - Configurar el Módulo de Menú==
En este momento, ya tenemos los artículos e items del menú hechos. Ahora necesitamos actualizar el "Módulo de Menú". En Joomla!, el Módulo del Menú determina tres aspectos importantes:
# La apariencia del menú;
# Dónde se mostrará dentro de la página;
# En qué páginas se mostrará.

Realizaremos dos ejemplos:
* En el primer ejemplo configuraremos parámetros del módulo para mostrar el menú con los items de nivel superior y sus subniveles debajo.
* En el segundo ejemplo añadiremos un módulo de menú a mayores que aparecerá en la columna izquierda y mostrará tan solo los items de menú de segundo nivel.
'''Nota:''' Ambos ejemplos usarán el Template Protostar incluido en la instalación estándar de Joomla!

===Ejemplo 1 - Un Módulo de Menú con Items de Menú de Segundo Nivel===
Para mostrar el módulo del menú, siga estos pasos:
# Navega a '''Extensiones'''{{rarr}}'''Módulos''' y localiza el Módulo de Menú asociado con tu menú ("Main Menú" si tus items están en el menú principal). Si necesitas crear un nuevo módulo y necesitas instrucciones, lee: [[S:MyLanguage/Help34:Extensions Module Manager Menu|Module Menu]] {{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Control-Panel-en.png|775px|border]]
# Clica sobre el nombre del módulo asociado con tu menú. En este tutorial, hemos elegido el "Main Menu" (menú principal). '''Nota:''' en esta imagen se ha seleccionado "Menú" en el filtro de "Tipo de módulo" de la columna izquierda, para ver solo los módulos de menú y eliminar el resto de módulos de la vista.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-List-Menus-en.png|775px|border]]
# En los detalles del módulo, establece el "Nivel Inicial" (Start level) a 1, el "Nivel Final" (End Level) a "Todos" (All) y "Mostrar elementos del menú" (Show Sub-menu Items) a "Si" (Yes).{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Details-en.png|775px|border]]
# Para este tutorial, hemos añadido algunos estilos en el panel "Avanzado". En la "Clase CSS" (Menu Class Suffix') hemos introducido "navbar-nav nav-pills". Podrías poner "navbar-nav nav-tabs" para obtener un aspecto ligeramente diferente. Nota: hay un espacio antes de ''navbar-nav''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Advanced-Menu-Class-Suffix-en.png|border]]
# Clica sobre "Guardar y Cerrar".{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Save-en.png|border]]
# Ve a la página principal de tu sitio, que debería ser similar al de la imagen. En el Template Protostar, los items de menú en subniveles se muestran como items desplegables.{{-}}[[Image:J3x-Create-Sublevel-Menu-Frontend-Sample-Dropdown-en.png|775px|border]]
# El código fuente generado debería ser similar a este:
<source lang="html4strict">
<ul class="nav menu navbar-nav nav-pills">
<li class="item-101 current active"><a href="/" >Home</a></li>
<li class="item-102"><a class="dropdown-toggle" href="/about-us" >About Us</a></li>
<li class="item-210 deeper parent"><a href="#" >Dogs</a>
<ul class="nav-child unstyled small">
<li class="item-212"><a href="/2015-11-24-14-19-31/collies" >Collies</a></li>
<li class="item-213"><a href="/2015-11-24-14-19-31/pomeranians" >Pomeranians</a></li>
</ul>
</li>
<li class="item-211 deeper parent"><a href="#" >Cats</a>
<ul class="nav-child unstyled small">
<li class="item-214"><a href="/2015-11-24-14-20-12/burmese" >Burmese </a></li>
<li class="item-215"><a href="/2015-11-24-14-20-12/russian-blues" >Russian Blues</a></li>
</ul>
</li>
</ul>
</source>

===Ejemplo 2 - Un Segundo Módulo de Menú con un menú de nivel hijo===

Para mostrar un módulo separado en una posición distinta, siga estos pasos:
# Navega a '''Extensiones'''{{rarr}}'''Módulos''' y localiza o crea un segundo Módulo de Menú asociado con tu menú. Si no estás familiarizado con la creación de módulos de menú, lee: [[S:MyLanguage/Help34:Extensions Module Manager Menu|Módulos de Menú]]{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Control-Panel-en.png|775px|border]]
# Clica sobre el nombre del módulo asociado con tu menú. En este tutorial, hemos elegido "Menú izquierdo" (Left Menu). Nota: en la imagen se aplicó el filtro "Menú" en el desplegable "Tipo de Módulo".{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-List-Menus-2-en.png|775px|border]]
# En los detalles del Módulo, establece '''Nivel Inicial''' a "2", '''Nivel Final''' a "Todos" y '''Mostrar elementos del menú''' a "Si".{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Details-2-en.png|775px|border]]
# For this tutorial, we have used the '''Module Assignment''' tab and assigned this Menu Module to appear on all pages except the home page.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Module-Assignment-Tab-es.png]]
# Click on '''Save & Close'''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Save-es.png]]
# Go to the frontend of your site and navigate to the ''Collies'' article. Your menu should look similar to this. Notice the child level subitems are the only items showing.{{-}}[[Image:J3x-Create-Sublevel-Menu-Frontend-Sample-Child-Menu-es.png|775px|border]]
# The source code generated will look similar to this:
<source lang="html4strict">
<ul class="nav menu">
<li class="item-212 current active"><a href="/2015-11-24-14-19-31/collies" >Collies</a></li>
<li class="item-213"><a href="/2015-11-24-14-19-31/pomeranians" >Pomeranians</a></li>
</ul>
</source>

==Sub-Sub-Menús==
Using this same technique, it is easy to create third-level sub-menus. You just make the Parent Menu Item a second-level sub-menu. Then you could use the same technique to create a separate Menu Module with Start Level of 2 and End Level of 3. This would show only the third-level Menu Items.

<noinclude>
[[Category:Beginners]]
[[Category:Tutorials]]
[[Category:Joomla! 3.x]]
[[Category:Menu Management]]
</noinclude>

Translations:J3.x:Creating a submenu/90/es

2015-12-25T19:15:56Z

Framon:

J3.x:Creating a submenu/es

2015-12-25T19:15:54Z

Framon: Created page with "# En los detalles del Módulo, establece '''Nivel Inicial''' a "2", '''Nivel Final''' a "Todos" y '''Mostrar elementos del menú''' a "Si"."

<noinclude><languages /></noinclude>
{{Top portal heading|color=white-bkgd|icon=magic|icon-color=#5091cd|size=3x|text-color=#333|title=Tutorial 
Cómo Crear un Submenú en un Sitio Joomla!}}
<noinclude>{{Joomla version|version=3.x}}</noinclude>
En Joomla, los submenús se pueden mostrar de dos formas: bajo dos o más niveles jerárquicos o como un menú modular completamente separado. Esto sirve para construir menús que muestren la jerarquía de navegación entre items (a nivel de padres e hijos), o para mostrar solamente items en un cierto subnivel del menú en una posición del template completamente separada del resto. Para mostrar como hacerlo, iremos creando paso a paso items de menú padres e hijos y veremos como visualizar estos items dentro de un solo gran menú jerárquico, o como un menú separado que solo muestre los items hijos en una posición separada del template. {{-}}
__TOC__
Para empezar, funciones de menú con tres construcciones básicas:
*Artículos - necesitas contenido para enlazar. Pueden ser partes de un componente, otros items de menú, o enlaces externos.
*Menú - describe los elementos del menú, el tipo de navegación, su relación padre/hijo a otros elementos de menú y el orden en que se muestran.
*Módulo de Menú - controla la posición y visualización del menú.

Para este tutorial, comienza ingresando en Joomla como usuario administrador. Si no sabes como ingresar lee el siguiente artículo: [[S:MyLanguage/J3.x:Logging_in_or_out_of_the_Administrator_back-end|Ingresando y saliendo del panel de administración de Joomla]]. {{-}}

'''Nota:''' Para este tutorial necesitas permisos de super administrador o permisos suficientes para crear y modificar artículos, items de menú, y módulos. Para más información sobre Control de Acceso de Usuarios (ACL) lee: [[S:MyLanguage/J3.x:Access Control List Tutorial|Tutorial ACL]].

==Paso 1 - Crea Tus Artículos==
En nuestro ejemplo, vamos a crear items de menú de nivel superior para "Perros" y "Gatos". Bajo Perros, tendremos "Collies" y "Pomeranos". Bajo "Gatos" tendremos "Birmanos" y "Azul Ruso". Así que la estructura de nuestro ejemplo de items de menú será como sigue:

*Perros
**Collies
**Pomeranos
*Gatos
**Birmanos
**Azules Rusos

Primero, crea cuatro artículos para que podamos enlazar nuestos items de menú a ellos: "Collies", "Pomeranos", "Birmanos" y "Azules Rusos". Lee este tutorial si necesitas ayuda para crear un artículo: [[S:MyLanguage/Help34:Content Article Manager Edit|Añadir un nuevo artículo]].

==Paso 2 - Crea los Items de Menú de Nivel Superior==
Para crear la estructura, necesitamos navegar al menú donde queremos que estén nuestros nuevos items. Si es un menú nuevo, necesitarás crearlo. Lee el tutorial sobre como crear un menú: [[S:MyLanguage/J3.x:Adding a new menu|Añadir un nuevo menú]].

Una vez tengas tu menú localizado en el Gestor de Menús, añadirás los items de menú padres usando '''Enlaces del Sistema'''{{rarr}}'''Crear una URL''' para cada enlace de navegación: ''Perros'' y ''Gatos''.

Nótese que hay otros tipos de items de menú que se pueden usar para el nivel padre de la estructura de navegación.

Aquí están los pasos para crear los Items de menú usados en nuestros datos de ejemplo. Para más información sobre creación de Menús lee: [[S:MyLanguage/J3.x:Adding a new menu|Añadir un nuevo menú]]. {{-}}
# Navegue hasta el Gestor de Menú haciendo clic en "Menús"'{{rarr}}"'Menú principal"'{{-}}[[Image:J3x-Edit-Main-Menu-es.jpg|775px|border]]
# En la barra de herramientas, clique sobre "Nuevo"{{-}}[[Image:J3x-Edit-Main-Menu-Toolbar-new-es.png|775px|border]]
# En este ejercicio, crearemos enlaces "contenedores" para los items de nivel superior "Perros" y "Gatos". En el panel "Detalles", clique sobre el botón "Seleccionar" un "Tipo de elemento del menú". En la ventana emergente que aparecerá, seleccionaremos posteriormente '''Enlaces del Sistema'''{{rarr}}'''Crear una URL'''. {{-}}[[Image:J3x-Add-Main-Menu-Select-Type-es.png|775px|border]]
# Clique sobre "Enlaces del sistema", luego deslice hacia abajo y seleccione "Crear una URL".{{-}}[[Image:J3x-Create-Sublevel-Menu-System-External-Url-en.png|775px|border]]
# Añade el '''Título de Menú''' y teclee una parrilla "#" en la caja del '''Enlace'''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Menu-Item-External-Url-en.png|775px|border]]
# Guarda el Item de menú recién creado. {{-}}[[Image:Joomla-3-Menu-Add-Menu-Save-es.png|775px|border]]
# Repite los pasos 2 - 6 para el item de nivel superior "Gatos".

==Paso 3 - Crea los Items de menú de nivel inferior==
Ahora se añadirán los items de menú de nivel inferior seleccionando el Tipo de elemento '''Artículos'''{{rarr}}'''Mostrar un solo artículo''' para crear los enlaces a las páginas de "Collies", "Pomeranos", "Birmanos" y "Azules Rusos". Para cada item de menú creado, estableceremos el "Elemento principal" a "Perros" o "Gatos".

Para información más detallada sobre cómo agregar un elemento del menú que apunta a un Artículo, lea: [[S:MyLanguage/Adding a menu item which points to an Article|Agregar un elemento del menú que apunta a un Artículo]].

'''Nota:''' Hay otros tipos de items que se pueden usar para los subniveles de la estructura de navegación.

# En la barra de herramientas, clique sobre "Nuevo".{{-}}[[Image:J3x-Edit-Main-Menu-Toolbar-new-es.png|775px|border]]
# En el nuevo Item de Menú, clique sobre el botón de selección de "Tipo de elemento del menú".{{-}}[[Image:J3x-Add-Main-Menu-Select-Type-es.png|775px|border]]
# Seleccione '''Artículos'''{{rarr}}'''Mostrar un solo artículo''' de la lista mostrada.{{-}}[[Image:J3x-Add-Main-Menu-Article-Type-es.png|border]]
# De vuelta al panel de "Detalles" de nuevo Item de Menú, clique sobre "Seleccionar artículo" para acceder a la lista de artículos.{{-}}[[Image:J3x-Add-Main-Menu-Article-Select-Article-es.png|border]]
# Seleccione el artículo "Collies" para este ejemplo.{{-}}[[Image:J3x-Create-Sublevel-Menu-Menu-Item-Single-Article-en.png|border]]
# De vuelta al panel de "Detalles" de nuevo Item de Menú, teclee un "Título del elemento del menú". A continuación clique sobre la lista de selección "Elemento principal" situada en la columna más a la derecha. Busque y seleccione el item superior "Perros", deslizándose sobre dicha lista. Nótese que el nivel de menú superior se indica mediante un único trazo "-", el segundo nivel con dos trazos "--", el tercero con tres "---" y así sucesivamente. {{-}}[[Image:J3x-Create-Sublevel-Menu-Select-Parent-Item-en.png|775px|border]]
# Clique sobre el botón "Guardar y cerrar" en la barra de herramientas de arriba.{{-}}[[Image:Joomla-3-Menu-Add-Menu-Save-es.png|775px|border]]
# Repita los pasos del 1 al 7 para los restantes artículos: "Pomeranos" con "Perros" como elemento principal y los artículos "Birmanos" y "Azules Rusos" con elemento principal "Gatos".
# Cuando haya terminado con la sección de "Items de Menú", el gestor de Items del Menú debería tener un aspecto similar al siguiente:{{-}}[[Image:J3x-Create-Sublevel-Menu-Items-en.png|775px|border]]

==Step 4 - Configurar el Módulo de Menú==
En este momento, ya tenemos los artículos e items del menú hechos. Ahora necesitamos actualizar el "Módulo de Menú". En Joomla!, el Módulo del Menú determina tres aspectos importantes:
# La apariencia del menú;
# Dónde se mostrará dentro de la página;
# En qué páginas se mostrará.

Realizaremos dos ejemplos:
* En el primer ejemplo configuraremos parámetros del módulo para mostrar el menú con los items de nivel superior y sus subniveles debajo.
* En el segundo ejemplo añadiremos un módulo de menú a mayores que aparecerá en la columna izquierda y mostrará tan solo los items de menú de segundo nivel.
'''Nota:''' Ambos ejemplos usarán el Template Protostar incluido en la instalación estándar de Joomla!

===Ejemplo 1 - Un Módulo de Menú con Items de Menú de Segundo Nivel===
Para mostrar el módulo del menú, siga estos pasos:
# Navega a '''Extensiones'''{{rarr}}'''Módulos''' y localiza el Módulo de Menú asociado con tu menú ("Main Menú" si tus items están en el menú principal). Si necesitas crear un nuevo módulo y necesitas instrucciones, lee: [[S:MyLanguage/Help34:Extensions Module Manager Menu|Module Menu]] {{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Control-Panel-en.png|775px|border]]
# Clica sobre el nombre del módulo asociado con tu menú. En este tutorial, hemos elegido el "Main Menu" (menú principal). '''Nota:''' en esta imagen se ha seleccionado "Menú" en el filtro de "Tipo de módulo" de la columna izquierda, para ver solo los módulos de menú y eliminar el resto de módulos de la vista.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-List-Menus-en.png|775px|border]]
# En los detalles del módulo, establece el "Nivel Inicial" (Start level) a 1, el "Nivel Final" (End Level) a "Todos" (All) y "Mostrar elementos del menú" (Show Sub-menu Items) a "Si" (Yes).{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Details-en.png|775px|border]]
# Para este tutorial, hemos añadido algunos estilos en el panel "Avanzado". En la "Clase CSS" (Menu Class Suffix') hemos introducido "navbar-nav nav-pills". Podrías poner "navbar-nav nav-tabs" para obtener un aspecto ligeramente diferente. Nota: hay un espacio antes de ''navbar-nav''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Advanced-Menu-Class-Suffix-en.png|border]]
# Clica sobre "Guardar y Cerrar".{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Save-en.png|border]]
# Ve a la página principal de tu sitio, que debería ser similar al de la imagen. En el Template Protostar, los items de menú en subniveles se muestran como items desplegables.{{-}}[[Image:J3x-Create-Sublevel-Menu-Frontend-Sample-Dropdown-en.png|775px|border]]
# El código fuente generado debería ser similar a este:
<source lang="html4strict">
<ul class="nav menu navbar-nav nav-pills">
<li class="item-101 current active"><a href="/" >Home</a></li>
<li class="item-102"><a class="dropdown-toggle" href="/about-us" >About Us</a></li>
<li class="item-210 deeper parent"><a href="#" >Dogs</a>
<ul class="nav-child unstyled small">
<li class="item-212"><a href="/2015-11-24-14-19-31/collies" >Collies</a></li>
<li class="item-213"><a href="/2015-11-24-14-19-31/pomeranians" >Pomeranians</a></li>
</ul>
</li>
<li class="item-211 deeper parent"><a href="#" >Cats</a>
<ul class="nav-child unstyled small">
<li class="item-214"><a href="/2015-11-24-14-20-12/burmese" >Burmese </a></li>
<li class="item-215"><a href="/2015-11-24-14-20-12/russian-blues" >Russian Blues</a></li>
</ul>
</li>
</ul>
</source>

===Ejemplo 2 - Un Segundo Módulo de Menú con un menú de nivel hijo===

Para mostrar un módulo separado en una posición distinta, siga estos pasos:
# Navega a '''Extensiones'''{{rarr}}'''Módulos''' y localiza o crea un segundo Módulo de Menú asociado con tu menú. Si no estás familiarizado con la creación de módulos de menú, lee: [[S:MyLanguage/Help34:Extensions Module Manager Menu|Módulos de Menú]]{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Control-Panel-en.png|775px|border]]
# Clica sobre el nombre del módulo asociado con tu menú. En este tutorial, hemos elegido "Menú izquierdo" (Left Menu). Nota: en la imagen se aplicó el filtro "Menú" en el desplegable "Tipo de Módulo".{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-List-Menus-2-en.png|775px|border]]
# En los detalles del Módulo, establece '''Nivel Inicial''' a "2", '''Nivel Final''' a "Todos" y '''Mostrar elementos del menú''' a "Si".{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Details-2-es.png|775px|border]]
# For this tutorial, we have used the '''Module Assignment''' tab and assigned this Menu Module to appear on all pages except the home page.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Module-Assignment-Tab-es.png]]
# Click on '''Save & Close'''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Save-es.png]]
# Go to the frontend of your site and navigate to the ''Collies'' article. Your menu should look similar to this. Notice the child level subitems are the only items showing.{{-}}[[Image:J3x-Create-Sublevel-Menu-Frontend-Sample-Child-Menu-es.png|775px|border]]
# The source code generated will look similar to this:
<source lang="html4strict">
<ul class="nav menu">
<li class="item-212 current active"><a href="/2015-11-24-14-19-31/collies" >Collies</a></li>
<li class="item-213"><a href="/2015-11-24-14-19-31/pomeranians" >Pomeranians</a></li>
</ul>
</source>

==Sub-Sub-Menús==
Using this same technique, it is easy to create third-level sub-menus. You just make the Parent Menu Item a second-level sub-menu. Then you could use the same technique to create a separate Menu Module with Start Level of 2 and End Level of 3. This would show only the third-level Menu Items.

<noinclude>
[[Category:Beginners]]
[[Category:Tutorials]]
[[Category:Joomla! 3.x]]
[[Category:Menu Management]]
</noinclude>

Translations:J3.x:Creating a submenu/89/es

2015-12-25T19:15:53Z

2015-12-25T19:00:35Z

Framon: Created page with "Módulos de Menú"

[[S:MyLanguage/Help34:Extensions Module Manager Menu|Módulos de Menú]]

J3.x:Creating a submenu/es

2015-12-25T19:00:16Z

Framon: Created page with "# Navega a '''Extensiones'''{{rarr}}'''Módulos''' y localiza o crea un segundo Módulo de Menú asociado con tu menú. Si no estás familiarizado con la creación de módulos..."

<noinclude><languages /></noinclude>
{{Top portal heading|color=white-bkgd|icon=magic|icon-color=#5091cd|size=3x|text-color=#333|title=Tutorial 
Cómo Crear un Submenú en un Sitio Joomla!}}
<noinclude>{{Joomla version|version=3.x}}</noinclude>
En Joomla, los submenús se pueden mostrar de dos formas: bajo dos o más niveles jerárquicos o como un menú modular completamente separado. Esto sirve para construir menús que muestren la jerarquía de navegación entre items (a nivel de padres e hijos), o para mostrar solamente items en un cierto subnivel del menú en una posición del template completamente separada del resto. Para mostrar como hacerlo, iremos creando paso a paso items de menú padres e hijos y veremos como visualizar estos items dentro de un solo gran menú jerárquico, o como un menú separado que solo muestre los items hijos en una posición separada del template. {{-}}
__TOC__
Para empezar, funciones de menú con tres construcciones básicas:
*Artículos - necesitas contenido para enlazar. Pueden ser partes de un componente, otros items de menú, o enlaces externos.
*Menú - describe los elementos del menú, el tipo de navegación, su relación padre/hijo a otros elementos de menú y el orden en que se muestran.
*Módulo de Menú - controla la posición y visualización del menú.

Para este tutorial, comienza ingresando en Joomla como usuario administrador. Si no sabes como ingresar lee el siguiente artículo: [[S:MyLanguage/J3.x:Logging_in_or_out_of_the_Administrator_back-end|Ingresando y saliendo del panel de administración de Joomla]]. {{-}}

'''Nota:''' Para este tutorial necesitas permisos de super administrador o permisos suficientes para crear y modificar artículos, items de menú, y módulos. Para más información sobre Control de Acceso de Usuarios (ACL) lee: [[S:MyLanguage/J3.x:Access Control List Tutorial|Tutorial ACL]].

==Paso 1 - Crea Tus Artículos==
En nuestro ejemplo, vamos a crear items de menú de nivel superior para "Perros" y "Gatos". Bajo Perros, tendremos "Collies" y "Pomeranos". Bajo "Gatos" tendremos "Birmanos" y "Azul Ruso". Así que la estructura de nuestro ejemplo de items de menú será como sigue:

*Perros
**Collies
**Pomeranos
*Gatos
**Birmanos
**Azules Rusos

Primero, crea cuatro artículos para que podamos enlazar nuestos items de menú a ellos: "Collies", "Pomeranos", "Birmanos" y "Azules Rusos". Lee este tutorial si necesitas ayuda para crear un artículo: [[S:MyLanguage/Help34:Content Article Manager Edit|Añadir un nuevo artículo]].

==Paso 2 - Crea los Items de Menú de Nivel Superior==
Para crear la estructura, necesitamos navegar al menú donde queremos que estén nuestros nuevos items. Si es un menú nuevo, necesitarás crearlo. Lee el tutorial sobre como crear un menú: [[S:MyLanguage/J3.x:Adding a new menu|Añadir un nuevo menú]].

Una vez tengas tu menú localizado en el Gestor de Menús, añadirás los items de menú padres usando '''Enlaces del Sistema'''{{rarr}}'''Crear una URL''' para cada enlace de navegación: ''Perros'' y ''Gatos''.

Nótese que hay otros tipos de items de menú que se pueden usar para el nivel padre de la estructura de navegación.

Aquí están los pasos para crear los Items de menú usados en nuestros datos de ejemplo. Para más información sobre creación de Menús lee: [[S:MyLanguage/J3.x:Adding a new menu|Añadir un nuevo menú]]. {{-}}
# Navegue hasta el Gestor de Menú haciendo clic en "Menús"'{{rarr}}"'Menú principal"'{{-}}[[Image:J3x-Edit-Main-Menu-es.jpg|775px|border]]
# En la barra de herramientas, clique sobre "Nuevo"{{-}}[[Image:J3x-Edit-Main-Menu-Toolbar-new-es.png|775px|border]]
# En este ejercicio, crearemos enlaces "contenedores" para los items de nivel superior "Perros" y "Gatos". En el panel "Detalles", clique sobre el botón "Seleccionar" un "Tipo de elemento del menú". En la ventana emergente que aparecerá, seleccionaremos posteriormente '''Enlaces del Sistema'''{{rarr}}'''Crear una URL'''. {{-}}[[Image:J3x-Add-Main-Menu-Select-Type-es.png|775px|border]]
# Clique sobre "Enlaces del sistema", luego deslice hacia abajo y seleccione "Crear una URL".{{-}}[[Image:J3x-Create-Sublevel-Menu-System-External-Url-en.png|775px|border]]
# Añade el '''Título de Menú''' y teclee una parrilla "#" en la caja del '''Enlace'''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Menu-Item-External-Url-en.png|775px|border]]
# Guarda el Item de menú recién creado. {{-}}[[Image:Joomla-3-Menu-Add-Menu-Save-es.png|775px|border]]
# Repite los pasos 2 - 6 para el item de nivel superior "Gatos".

==Paso 3 - Crea los Items de menú de nivel inferior==
Ahora se añadirán los items de menú de nivel inferior seleccionando el Tipo de elemento '''Artículos'''{{rarr}}'''Mostrar un solo artículo''' para crear los enlaces a las páginas de "Collies", "Pomeranos", "Birmanos" y "Azules Rusos". Para cada item de menú creado, estableceremos el "Elemento principal" a "Perros" o "Gatos".

Para información más detallada sobre cómo agregar un elemento del menú que apunta a un Artículo, lea: [[S:MyLanguage/Adding a menu item which points to an Article|Agregar un elemento del menú que apunta a un Artículo]].

'''Nota:''' Hay otros tipos de items que se pueden usar para los subniveles de la estructura de navegación.

# En la barra de herramientas, clique sobre "Nuevo".{{-}}[[Image:J3x-Edit-Main-Menu-Toolbar-new-es.png|775px|border]]
# En el nuevo Item de Menú, clique sobre el botón de selección de "Tipo de elemento del menú".{{-}}[[Image:J3x-Add-Main-Menu-Select-Type-es.png|775px|border]]
# Seleccione '''Artículos'''{{rarr}}'''Mostrar un solo artículo''' de la lista mostrada.{{-}}[[Image:J3x-Add-Main-Menu-Article-Type-es.png|border]]
# De vuelta al panel de "Detalles" de nuevo Item de Menú, clique sobre "Seleccionar artículo" para acceder a la lista de artículos.{{-}}[[Image:J3x-Add-Main-Menu-Article-Select-Article-es.png|border]]
# Seleccione el artículo "Collies" para este ejemplo.{{-}}[[Image:J3x-Create-Sublevel-Menu-Menu-Item-Single-Article-en.png|border]]
# De vuelta al panel de "Detalles" de nuevo Item de Menú, teclee un "Título del elemento del menú". A continuación clique sobre la lista de selección "Elemento principal" situada en la columna más a la derecha. Busque y seleccione el item superior "Perros", deslizándose sobre dicha lista. Nótese que el nivel de menú superior se indica mediante un único trazo "-", el segundo nivel con dos trazos "--", el tercero con tres "---" y así sucesivamente. {{-}}[[Image:J3x-Create-Sublevel-Menu-Select-Parent-Item-en.png|775px|border]]
# Clique sobre el botón "Guardar y cerrar" en la barra de herramientas de arriba.{{-}}[[Image:Joomla-3-Menu-Add-Menu-Save-es.png|775px|border]]
# Repita los pasos del 1 al 7 para los restantes artículos: "Pomeranos" con "Perros" como elemento principal y los artículos "Birmanos" y "Azules Rusos" con elemento principal "Gatos".
# Cuando haya terminado con la sección de "Items de Menú", el gestor de Items del Menú debería tener un aspecto similar al siguiente:{{-}}[[Image:J3x-Create-Sublevel-Menu-Items-en.png|775px|border]]

==Step 4 - Configurar el Módulo de Menú==
En este momento, ya tenemos los artículos e items del menú hechos. Ahora necesitamos actualizar el "Módulo de Menú". En Joomla!, el Módulo del Menú determina tres aspectos importantes:
# La apariencia del menú;
# Dónde se mostrará dentro de la página;
# En qué páginas se mostrará.

Realizaremos dos ejemplos:
* En el primer ejemplo configuraremos parámetros del módulo para mostrar el menú con los items de nivel superior y sus subniveles debajo.
* En el segundo ejemplo añadiremos un módulo de menú a mayores que aparecerá en la columna izquierda y mostrará tan solo los items de menú de segundo nivel.
'''Nota:''' Ambos ejemplos usarán el Template Protostar incluido en la instalación estándar de Joomla!

===Ejemplo 1 - Un Módulo de Menú con Items de Menú de Segundo Nivel===
Para mostrar el módulo del menú, siga estos pasos:
# Navega a '''Extensiones'''{{rarr}}'''Módulos''' y localiza el Módulo de Menú asociado con tu menú ("Main Menú" si tus items están en el menú principal). Si necesitas crear un nuevo módulo y necesitas instrucciones, lee: [[S:MyLanguage/Help34:Extensions Module Manager Menu|Module Menu]] {{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Control-Panel-en.png|775px|border]]
# Clica sobre el nombre del módulo asociado con tu menú. En este tutorial, hemos elegido el "Main Menu" (menú principal). '''Nota:''' en esta imagen se ha seleccionado "Menú" en el filtro de "Tipo de módulo" de la columna izquierda, para ver solo los módulos de menú y eliminar el resto de módulos de la vista.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-List-Menus-en.png|775px|border]]
# En los detalles del módulo, establece el "Nivel Inicial" (Start level) a 1, el "Nivel Final" (End Level) a "Todos" (All) y "Mostrar elementos del menú" (Show Sub-menu Items) a "Si" (Yes).{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Details-en.png|775px|border]]
# Para este tutorial, hemos añadido algunos estilos en el panel "Avanzado". En la "Clase CSS" (Menu Class Suffix') hemos introducido "navbar-nav nav-pills". Podrías poner "navbar-nav nav-tabs" para obtener un aspecto ligeramente diferente. Nota: hay un espacio antes de ''navbar-nav''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Advanced-Menu-Class-Suffix-en.png|border]]
# Clica sobre "Guardar y Cerrar".{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Save-en.png|border]]
# Ve a la página principal de tu sitio, que debería ser similar al de la imagen. En el Template Protostar, los items de menú en subniveles se muestran como items desplegables.{{-}}[[Image:J3x-Create-Sublevel-Menu-Frontend-Sample-Dropdown-en.png|775px|border]]
# El código fuente generado debería ser similar a este:
<source lang="html4strict">
<ul class="nav menu navbar-nav nav-pills">
<li class="item-101 current active"><a href="/" >Home</a></li>
<li class="item-102"><a class="dropdown-toggle" href="/about-us" >About Us</a></li>
<li class="item-210 deeper parent"><a href="#" >Dogs</a>
<ul class="nav-child unstyled small">
<li class="item-212"><a href="/2015-11-24-14-19-31/collies" >Collies</a></li>
<li class="item-213"><a href="/2015-11-24-14-19-31/pomeranians" >Pomeranians</a></li>
</ul>
</li>
<li class="item-211 deeper parent"><a href="#" >Cats</a>
<ul class="nav-child unstyled small">
<li class="item-214"><a href="/2015-11-24-14-20-12/burmese" >Burmese </a></li>
<li class="item-215"><a href="/2015-11-24-14-20-12/russian-blues" >Russian Blues</a></li>
</ul>
</li>
</ul>
</source>

===Ejemplo 2 - Un Segundo Módulo de Menú con un menú de nivel hijo===

Para mostrar un módulo separado en una posición distinta, siga estos pasos:
# Navega a '''Extensiones'''{{rarr}}'''Módulos''' y localiza o crea un segundo Módulo de Menú asociado con tu menú. Si no estás familiarizado con la creación de módulos de menú, lee: [[S:MyLanguage/Help34:Extensions Module Manager Menu|Module Menu]]{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Control-Panel-es.png|775px|border]]
# Click on the module name associated with your menu. In this tutorial, we are selecting ''Left Menu''. Note: this image has been filtered by selecting ''Menu'' in the Module type dropdown.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-List-Menus-2-es.png|775px|border]]
# In the Module details, set the '''Start level''' to ''2'', the '''End Level''' to ''All'' and set '''Show Submenu Items''' to ''Yes''. Note the position has changed and the menu we are pointing to is the '''Main Menu'''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Details-2-es.png|775px|border]]
# For this tutorial, we have used the '''Module Assignment''' tab and assigned this Menu Module to appear on all pages except the home page.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Module-Assignment-Tab-es.png]]
# Click on '''Save & Close'''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Save-es.png]]
# Go to the frontend of your site and navigate to the ''Collies'' article. Your menu should look similar to this. Notice the child level subitems are the only items showing.{{-}}[[Image:J3x-Create-Sublevel-Menu-Frontend-Sample-Child-Menu-es.png|775px|border]]
# The source code generated will look similar to this:
<source lang="html4strict">
<ul class="nav menu">
<li class="item-212 current active"><a href="/2015-11-24-14-19-31/collies" >Collies</a></li>
<li class="item-213"><a href="/2015-11-24-14-19-31/pomeranians" >Pomeranians</a></li>
</ul>
</source>

==Sub-Sub-Menús==
Using this same technique, it is easy to create third-level sub-menus. You just make the Parent Menu Item a second-level sub-menu. Then you could use the same technique to create a separate Menu Module with Start Level of 2 and End Level of 3. This would show only the third-level Menu Items.

<noinclude>
[[Category:Beginners]]
[[Category:Tutorials]]
[[Category:Joomla! 3.x]]
[[Category:Menu Management]]
</noinclude>

2015-12-25T18:54:08Z

# Ve a la página principal de tu sitio, que debería ser similar a la de la imagen. En el Template Protostar, los items de menú en subniveles se muestran como items desplegables.

J3.x:Creating a submenu/es

2015-12-25T18:49:28Z

Framon: Created page with "# Clica sobre "Guardar y Cerrar"."

<noinclude><languages /></noinclude>
{{Top portal heading|color=white-bkgd|icon=magic|icon-color=#5091cd|size=3x|text-color=#333|title=Tutorial 
Cómo Crear un Submenú en un Sitio Joomla!}}
<noinclude>{{Joomla version|version=3.x}}</noinclude>
En Joomla, los submenús se pueden mostrar de dos formas: bajo dos o más niveles jerárquicos o como un menú modular completamente separado. Esto sirve para construir menús que muestren la jerarquía de navegación entre items (a nivel de padres e hijos), o para mostrar solamente items en un cierto subnivel del menú en una posición del template completamente separada del resto. Para mostrar como hacerlo, iremos creando paso a paso items de menú padres e hijos y veremos como visualizar estos items dentro de un solo gran menú jerárquico, o como un menú separado que solo muestre los items hijos en una posición separada del template. {{-}}
__TOC__
Para empezar, funciones de menú con tres construcciones básicas:
*Artículos - necesitas contenido para enlazar. Pueden ser partes de un componente, otros items de menú, o enlaces externos.
*Menú - describe los elementos del menú, el tipo de navegación, su relación padre/hijo a otros elementos de menú y el orden en que se muestran.
*Módulo de Menú - controla la posición y visualización del menú.

Para este tutorial, comienza ingresando en Joomla como usuario administrador. Si no sabes como ingresar lee el siguiente artículo: [[S:MyLanguage/J3.x:Logging_in_or_out_of_the_Administrator_back-end|Ingresando y saliendo del panel de administración de Joomla]]. {{-}}

'''Nota:''' Para este tutorial necesitas permisos de super administrador o permisos suficientes para crear y modificar artículos, items de menú, y módulos. Para más información sobre Control de Acceso de Usuarios (ACL) lee: [[S:MyLanguage/J3.x:Access Control List Tutorial|Tutorial ACL]].

==Paso 1 - Crea Tus Artículos==
En nuestro ejemplo, vamos a crear items de menú de nivel superior para "Perros" y "Gatos". Bajo Perros, tendremos "Collies" y "Pomeranos". Bajo "Gatos" tendremos "Birmanos" y "Azul Ruso". Así que la estructura de nuestro ejemplo de items de menú será como sigue:

*Perros
**Collies
**Pomeranos
*Gatos
**Birmanos
**Azules Rusos

Primero, crea cuatro artículos para que podamos enlazar nuestos items de menú a ellos: "Collies", "Pomeranos", "Birmanos" y "Azules Rusos". Lee este tutorial si necesitas ayuda para crear un artículo: [[S:MyLanguage/Help34:Content Article Manager Edit|Añadir un nuevo artículo]].

==Paso 2 - Crea los Items de Menú de Nivel Superior==
Para crear la estructura, necesitamos navegar al menú donde queremos que estén nuestros nuevos items. Si es un menú nuevo, necesitarás crearlo. Lee el tutorial sobre como crear un menú: [[S:MyLanguage/J3.x:Adding a new menu|Añadir un nuevo menú]].

Una vez tengas tu menú localizado en el Gestor de Menús, añadirás los items de menú padres usando '''Enlaces del Sistema'''{{rarr}}'''Crear una URL''' para cada enlace de navegación: ''Perros'' y ''Gatos''.

Nótese que hay otros tipos de items de menú que se pueden usar para el nivel padre de la estructura de navegación.

Aquí están los pasos para crear los Items de menú usados en nuestros datos de ejemplo. Para más información sobre creación de Menús lee: [[S:MyLanguage/J3.x:Adding a new menu|Añadir un nuevo menú]]. {{-}}
# Navegue hasta el Gestor de Menú haciendo clic en "Menús"'{{rarr}}"'Menú principal"'{{-}}[[Image:J3x-Edit-Main-Menu-es.jpg|775px|border]]
# En la barra de herramientas, clique sobre "Nuevo"{{-}}[[Image:J3x-Edit-Main-Menu-Toolbar-new-es.png|775px|border]]
# En este ejercicio, crearemos enlaces "contenedores" para los items de nivel superior "Perros" y "Gatos". En el panel "Detalles", clique sobre el botón "Seleccionar" un "Tipo de elemento del menú". En la ventana emergente que aparecerá, seleccionaremos posteriormente '''Enlaces del Sistema'''{{rarr}}'''Crear una URL'''. {{-}}[[Image:J3x-Add-Main-Menu-Select-Type-es.png|775px|border]]
# Clique sobre "Enlaces del sistema", luego deslice hacia abajo y seleccione "Crear una URL".{{-}}[[Image:J3x-Create-Sublevel-Menu-System-External-Url-en.png|775px|border]]
# Añade el '''Título de Menú''' y teclee una parrilla "#" en la caja del '''Enlace'''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Menu-Item-External-Url-en.png|775px|border]]
# Guarda el Item de menú recién creado. {{-}}[[Image:Joomla-3-Menu-Add-Menu-Save-es.png|775px|border]]
# Repite los pasos 2 - 6 para el item de nivel superior "Gatos".

==Paso 3 - Crea los Items de menú de nivel inferior==
Ahora se añadirán los items de menú de nivel inferior seleccionando el Tipo de elemento '''Artículos'''{{rarr}}'''Mostrar un solo artículo''' para crear los enlaces a las páginas de "Collies", "Pomeranos", "Birmanos" y "Azules Rusos". Para cada item de menú creado, estableceremos el "Elemento principal" a "Perros" o "Gatos".

Para información más detallada sobre cómo agregar un elemento del menú que apunta a un Artículo, lea: [[S:MyLanguage/Adding a menu item which points to an Article|Agregar un elemento del menú que apunta a un Artículo]].

'''Nota:''' Hay otros tipos de items que se pueden usar para los subniveles de la estructura de navegación.

# En la barra de herramientas, clique sobre "Nuevo".{{-}}[[Image:J3x-Edit-Main-Menu-Toolbar-new-es.png|775px|border]]
# En el nuevo Item de Menú, clique sobre el botón de selección de "Tipo de elemento del menú".{{-}}[[Image:J3x-Add-Main-Menu-Select-Type-es.png|775px|border]]
# Seleccione '''Artículos'''{{rarr}}'''Mostrar un solo artículo''' de la lista mostrada.{{-}}[[Image:J3x-Add-Main-Menu-Article-Type-es.png|border]]
# De vuelta al panel de "Detalles" de nuevo Item de Menú, clique sobre "Seleccionar artículo" para acceder a la lista de artículos.{{-}}[[Image:J3x-Add-Main-Menu-Article-Select-Article-es.png|border]]
# Seleccione el artículo "Collies" para este ejemplo.{{-}}[[Image:J3x-Create-Sublevel-Menu-Menu-Item-Single-Article-en.png|border]]
# De vuelta al panel de "Detalles" de nuevo Item de Menú, teclee un "Título del elemento del menú". A continuación clique sobre la lista de selección "Elemento principal" situada en la columna más a la derecha. Busque y seleccione el item superior "Perros", deslizándose sobre dicha lista. Nótese que el nivel de menú superior se indica mediante un único trazo "-", el segundo nivel con dos trazos "--", el tercero con tres "---" y así sucesivamente. {{-}}[[Image:J3x-Create-Sublevel-Menu-Select-Parent-Item-en.png|775px|border]]
# Clique sobre el botón "Guardar y cerrar" en la barra de herramientas de arriba.{{-}}[[Image:Joomla-3-Menu-Add-Menu-Save-es.png|775px|border]]
# Repita los pasos del 1 al 7 para los restantes artículos: "Pomeranos" con "Perros" como elemento principal y los artículos "Birmanos" y "Azules Rusos" con elemento principal "Gatos".
# Cuando haya terminado con la sección de "Items de Menú", el gestor de Items del Menú debería tener un aspecto similar al siguiente:{{-}}[[Image:J3x-Create-Sublevel-Menu-Items-en.png|775px|border]]

==Step 4 - Configurar el Módulo de Menú==
En este momento, ya tenemos los artículos e items del menú hechos. Ahora necesitamos actualizar el "Módulo de Menú". En Joomla!, el Módulo del Menú determina tres aspectos importantes:
# La apariencia del menú;
# Dónde se mostrará dentro de la página;
# En qué páginas se mostrará.

Realizaremos dos ejemplos:
* En el primer ejemplo configuraremos parámetros del módulo para mostrar el menú con los items de nivel superior y sus subniveles debajo.
* En el segundo ejemplo añadiremos un módulo de menú a mayores que aparecerá en la columna izquierda y mostrará tan solo los items de menú de segundo nivel.
'''Nota:''' Ambos ejemplos usarán el Template Protostar incluido en la instalación estándar de Joomla!

===Ejemplo 1 - Un Módulo de Menú con Items de Menú de Segundo Nivel===
Para mostrar el módulo del menú, siga estos pasos:
# Navega a '''Extensiones'''{{rarr}}'''Módulos''' y localiza el Módulo de Menú asociado con tu menú ("Main Menú" si tus items están en el menú principal). Si necesitas crear un nuevo módulo y necesitas instrucciones, lee: [[S:MyLanguage/Help34:Extensions Module Manager Menu|Module Menu]] {{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Control-Panel-en.png|775px|border]]
# Clica sobre el nombre del módulo asociado con tu menú. En este tutorial, hemos elegido el "Main Menu" (menú principal). '''Nota:''' en esta imagen se ha seleccionado "Menú" en el filtro de "Tipo de módulo" de la columna izquierda, para ver solo los módulos de menú y eliminar el resto de módulos de la vista.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-List-Menus-en.png|775px|border]]
# En los detalles del módulo, establece el "Nivel Inicial" (Start level) a 1, el "Nivel Final" (End Level) a "Todos" (All) y "Mostrar elementos del menú" (Show Sub-menu Items) a "Si" (Yes).{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Details-en.png|775px|border]]
# Para este tutorial, hemos añadido algunos estilos en el panel "Avanzado". En la "Clase CSS" (Menu Class Suffix') hemos introducido "navbar-nav nav-pills". Podrías poner "navbar-nav nav-tabs" para obtener un aspecto ligeramente diferente. Nota: hay un espacio antes de ''navbar-nav''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Advanced-Menu-Class-Suffix-en.png|border]]
# Clica sobre "Guardar y Cerrar".{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Save-en.png|border]]
# Go to the frontend of your site and your menu should look similar to this. In the Protostar Template, the sublevel menu items are displayed as dropdown menu items.{{-}}[[Image:J3x-Create-Sublevel-Menu-Frontend-Sample-Dropdown-en.png|775px|border]]
# The source code generated will look similar to this:
<source lang="html4strict">
<ul class="nav menu navbar-nav nav-pills">
<li class="item-101 current active"><a href="/" >Home</a></li>
<li class="item-102"><a class="dropdown-toggle" href="/about-us" >About Us</a></li>
<li class="item-210 deeper parent"><a href="#" >Dogs</a>
<ul class="nav-child unstyled small">
<li class="item-212"><a href="/2015-11-24-14-19-31/collies" >Collies</a></li>
<li class="item-213"><a href="/2015-11-24-14-19-31/pomeranians" >Pomeranians</a></li>
</ul>
</li>
<li class="item-211 deeper parent"><a href="#" >Cats</a>
<ul class="nav-child unstyled small">
<li class="item-214"><a href="/2015-11-24-14-20-12/burmese" >Burmese </a></li>
<li class="item-215"><a href="/2015-11-24-14-20-12/russian-blues" >Russian Blues</a></li>
</ul>
</li>
</ul>
</source>

===Example 2 - A Second Menu Module With Child Level Menu Items===

To show in a separate module in a different position, follow these steps:
# Navigate to '''Extensions'''{{rarr}}'''Module Manager''' and locate or create a second Menu Module associated with your menu. If you are unfamiliar with how to create a new menu module, for instructions on creating a menu module, see: [[S:MyLanguage/Help34:Extensions Module Manager Menu|Module Menu]]{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Control-Panel-es.png|775px|border]]
# Click on the module name associated with your menu. In this tutorial, we are selecting ''Left Menu''. Note: this image has been filtered by selecting ''Menu'' in the Module type dropdown.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-List-Menus-2-es.png|775px|border]]
# In the Module details, set the '''Start level''' to ''2'', the '''End Level''' to ''All'' and set '''Show Submenu Items''' to ''Yes''. Note the position has changed and the menu we are pointing to is the '''Main Menu'''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Details-2-es.png|775px|border]]
# For this tutorial, we have used the '''Module Assignment''' tab and assigned this Menu Module to appear on all pages except the home page.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Module-Assignment-Tab-es.png]]
# Click on '''Save & Close'''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Save-es.png]]
# Go to the frontend of your site and navigate to the ''Collies'' article. Your menu should look similar to this. Notice the child level subitems are the only items showing.{{-}}[[Image:J3x-Create-Sublevel-Menu-Frontend-Sample-Child-Menu-es.png|775px|border]]
# The source code generated will look similar to this:
<source lang="html4strict">
<ul class="nav menu">
<li class="item-212 current active"><a href="/2015-11-24-14-19-31/collies" >Collies</a></li>
<li class="item-213"><a href="/2015-11-24-14-19-31/pomeranians" >Pomeranians</a></li>
</ul>
</source>

==Sub-Sub-Menús==
Using this same technique, it is easy to create third-level sub-menus. You just make the Parent Menu Item a second-level sub-menu. Then you could use the same technique to create a separate Menu Module with Start Level of 2 and End Level of 3. This would show only the third-level Menu Items.

<noinclude>
[[Category:Beginners]]
[[Category:Tutorials]]
[[Category:Joomla! 3.x]]
[[Category:Menu Management]]
</noinclude>

Translations:J3.x:Creating a submenu/77/es

2015-12-25T18:49:27Z

Framon: Created page with "# Clica sobre "Guardar y Cerrar"."

# Clica sobre "Guardar y Cerrar".

J3.x:Creating a submenu/es

2015-12-25T18:48:07Z

Framon: Created page with "# Para este tutorial, hemos añadido algunos estilos en el panel "Avanzado". En la "Clase CSS" (Menu Class Suffix') hemos introducido "navbar-nav nav-pills". Podrías poner "n..."

<noinclude><languages /></noinclude>
{{Top portal heading|color=white-bkgd|icon=magic|icon-color=#5091cd|size=3x|text-color=#333|title=Tutorial 
Cómo Crear un Submenú en un Sitio Joomla!}}
<noinclude>{{Joomla version|version=3.x}}</noinclude>
En Joomla, los submenús se pueden mostrar de dos formas: bajo dos o más niveles jerárquicos o como un menú modular completamente separado. Esto sirve para construir menús que muestren la jerarquía de navegación entre items (a nivel de padres e hijos), o para mostrar solamente items en un cierto subnivel del menú en una posición del template completamente separada del resto. Para mostrar como hacerlo, iremos creando paso a paso items de menú padres e hijos y veremos como visualizar estos items dentro de un solo gran menú jerárquico, o como un menú separado que solo muestre los items hijos en una posición separada del template. {{-}}
__TOC__
Para empezar, funciones de menú con tres construcciones básicas:
*Artículos - necesitas contenido para enlazar. Pueden ser partes de un componente, otros items de menú, o enlaces externos.
*Menú - describe los elementos del menú, el tipo de navegación, su relación padre/hijo a otros elementos de menú y el orden en que se muestran.
*Módulo de Menú - controla la posición y visualización del menú.

Para este tutorial, comienza ingresando en Joomla como usuario administrador. Si no sabes como ingresar lee el siguiente artículo: [[S:MyLanguage/J3.x:Logging_in_or_out_of_the_Administrator_back-end|Ingresando y saliendo del panel de administración de Joomla]]. {{-}}

'''Nota:''' Para este tutorial necesitas permisos de super administrador o permisos suficientes para crear y modificar artículos, items de menú, y módulos. Para más información sobre Control de Acceso de Usuarios (ACL) lee: [[S:MyLanguage/J3.x:Access Control List Tutorial|Tutorial ACL]].

==Paso 1 - Crea Tus Artículos==
En nuestro ejemplo, vamos a crear items de menú de nivel superior para "Perros" y "Gatos". Bajo Perros, tendremos "Collies" y "Pomeranos". Bajo "Gatos" tendremos "Birmanos" y "Azul Ruso". Así que la estructura de nuestro ejemplo de items de menú será como sigue:

*Perros
**Collies
**Pomeranos
*Gatos
**Birmanos
**Azules Rusos

Primero, crea cuatro artículos para que podamos enlazar nuestos items de menú a ellos: "Collies", "Pomeranos", "Birmanos" y "Azules Rusos". Lee este tutorial si necesitas ayuda para crear un artículo: [[S:MyLanguage/Help34:Content Article Manager Edit|Añadir un nuevo artículo]].

==Paso 2 - Crea los Items de Menú de Nivel Superior==
Para crear la estructura, necesitamos navegar al menú donde queremos que estén nuestros nuevos items. Si es un menú nuevo, necesitarás crearlo. Lee el tutorial sobre como crear un menú: [[S:MyLanguage/J3.x:Adding a new menu|Añadir un nuevo menú]].

Una vez tengas tu menú localizado en el Gestor de Menús, añadirás los items de menú padres usando '''Enlaces del Sistema'''{{rarr}}'''Crear una URL''' para cada enlace de navegación: ''Perros'' y ''Gatos''.

Nótese que hay otros tipos de items de menú que se pueden usar para el nivel padre de la estructura de navegación.

Aquí están los pasos para crear los Items de menú usados en nuestros datos de ejemplo. Para más información sobre creación de Menús lee: [[S:MyLanguage/J3.x:Adding a new menu|Añadir un nuevo menú]]. {{-}}
# Navegue hasta el Gestor de Menú haciendo clic en "Menús"'{{rarr}}"'Menú principal"'{{-}}[[Image:J3x-Edit-Main-Menu-es.jpg|775px|border]]
# En la barra de herramientas, clique sobre "Nuevo"{{-}}[[Image:J3x-Edit-Main-Menu-Toolbar-new-es.png|775px|border]]
# En este ejercicio, crearemos enlaces "contenedores" para los items de nivel superior "Perros" y "Gatos". En el panel "Detalles", clique sobre el botón "Seleccionar" un "Tipo de elemento del menú". En la ventana emergente que aparecerá, seleccionaremos posteriormente '''Enlaces del Sistema'''{{rarr}}'''Crear una URL'''. {{-}}[[Image:J3x-Add-Main-Menu-Select-Type-es.png|775px|border]]
# Clique sobre "Enlaces del sistema", luego deslice hacia abajo y seleccione "Crear una URL".{{-}}[[Image:J3x-Create-Sublevel-Menu-System-External-Url-en.png|775px|border]]
# Añade el '''Título de Menú''' y teclee una parrilla "#" en la caja del '''Enlace'''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Menu-Item-External-Url-en.png|775px|border]]
# Guarda el Item de menú recién creado. {{-}}[[Image:Joomla-3-Menu-Add-Menu-Save-es.png|775px|border]]
# Repite los pasos 2 - 6 para el item de nivel superior "Gatos".

==Paso 3 - Crea los Items de menú de nivel inferior==
Ahora se añadirán los items de menú de nivel inferior seleccionando el Tipo de elemento '''Artículos'''{{rarr}}'''Mostrar un solo artículo''' para crear los enlaces a las páginas de "Collies", "Pomeranos", "Birmanos" y "Azules Rusos". Para cada item de menú creado, estableceremos el "Elemento principal" a "Perros" o "Gatos".

Para información más detallada sobre cómo agregar un elemento del menú que apunta a un Artículo, lea: [[S:MyLanguage/Adding a menu item which points to an Article|Agregar un elemento del menú que apunta a un Artículo]].

'''Nota:''' Hay otros tipos de items que se pueden usar para los subniveles de la estructura de navegación.

# En la barra de herramientas, clique sobre "Nuevo".{{-}}[[Image:J3x-Edit-Main-Menu-Toolbar-new-es.png|775px|border]]
# En el nuevo Item de Menú, clique sobre el botón de selección de "Tipo de elemento del menú".{{-}}[[Image:J3x-Add-Main-Menu-Select-Type-es.png|775px|border]]
# Seleccione '''Artículos'''{{rarr}}'''Mostrar un solo artículo''' de la lista mostrada.{{-}}[[Image:J3x-Add-Main-Menu-Article-Type-es.png|border]]
# De vuelta al panel de "Detalles" de nuevo Item de Menú, clique sobre "Seleccionar artículo" para acceder a la lista de artículos.{{-}}[[Image:J3x-Add-Main-Menu-Article-Select-Article-es.png|border]]
# Seleccione el artículo "Collies" para este ejemplo.{{-}}[[Image:J3x-Create-Sublevel-Menu-Menu-Item-Single-Article-en.png|border]]
# De vuelta al panel de "Detalles" de nuevo Item de Menú, teclee un "Título del elemento del menú". A continuación clique sobre la lista de selección "Elemento principal" situada en la columna más a la derecha. Busque y seleccione el item superior "Perros", deslizándose sobre dicha lista. Nótese que el nivel de menú superior se indica mediante un único trazo "-", el segundo nivel con dos trazos "--", el tercero con tres "---" y así sucesivamente. {{-}}[[Image:J3x-Create-Sublevel-Menu-Select-Parent-Item-en.png|775px|border]]
# Clique sobre el botón "Guardar y cerrar" en la barra de herramientas de arriba.{{-}}[[Image:Joomla-3-Menu-Add-Menu-Save-es.png|775px|border]]
# Repita los pasos del 1 al 7 para los restantes artículos: "Pomeranos" con "Perros" como elemento principal y los artículos "Birmanos" y "Azules Rusos" con elemento principal "Gatos".
# Cuando haya terminado con la sección de "Items de Menú", el gestor de Items del Menú debería tener un aspecto similar al siguiente:{{-}}[[Image:J3x-Create-Sublevel-Menu-Items-en.png|775px|border]]

==Step 4 - Configurar el Módulo de Menú==
En este momento, ya tenemos los artículos e items del menú hechos. Ahora necesitamos actualizar el "Módulo de Menú". En Joomla!, el Módulo del Menú determina tres aspectos importantes:
# La apariencia del menú;
# Dónde se mostrará dentro de la página;
# En qué páginas se mostrará.

Realizaremos dos ejemplos:
* En el primer ejemplo configuraremos parámetros del módulo para mostrar el menú con los items de nivel superior y sus subniveles debajo.
* En el segundo ejemplo añadiremos un módulo de menú a mayores que aparecerá en la columna izquierda y mostrará tan solo los items de menú de segundo nivel.
'''Nota:''' Ambos ejemplos usarán el Template Protostar incluido en la instalación estándar de Joomla!

===Ejemplo 1 - Un Módulo de Menú con Items de Menú de Segundo Nivel===
Para mostrar el módulo del menú, siga estos pasos:
# Navega a '''Extensiones'''{{rarr}}'''Módulos''' y localiza el Módulo de Menú asociado con tu menú ("Main Menú" si tus items están en el menú principal). Si necesitas crear un nuevo módulo y necesitas instrucciones, lee: [[S:MyLanguage/Help34:Extensions Module Manager Menu|Module Menu]] {{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Control-Panel-en.png|775px|border]]
# Clica sobre el nombre del módulo asociado con tu menú. En este tutorial, hemos elegido el "Main Menu" (menú principal). '''Nota:''' en esta imagen se ha seleccionado "Menú" en el filtro de "Tipo de módulo" de la columna izquierda, para ver solo los módulos de menú y eliminar el resto de módulos de la vista.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-List-Menus-en.png|775px|border]]
# En los detalles del módulo, establece el "Nivel Inicial" (Start level) a 1, el "Nivel Final" (End Level) a "Todos" (All) y "Mostrar elementos del menú" (Show Sub-menu Items) a "Si" (Yes).{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Details-en.png|775px|border]]
# Para este tutorial, hemos añadido algunos estilos en el panel "Avanzado". En la "Clase CSS" (Menu Class Suffix') hemos introducido "navbar-nav nav-pills". Podrías poner "navbar-nav nav-tabs" para obtener un aspecto ligeramente diferente. Nota: hay un espacio antes de ''navbar-nav''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Advanced-Menu-Class-Suffix-en.png|border]]
# Click on '''Save & Close'''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Save-en.png|border]]
# Go to the frontend of your site and your menu should look similar to this. In the Protostar Template, the sublevel menu items are displayed as dropdown menu items.{{-}}[[Image:J3x-Create-Sublevel-Menu-Frontend-Sample-Dropdown-en.png|775px|border]]
# The source code generated will look similar to this:
<source lang="html4strict">
<ul class="nav menu navbar-nav nav-pills">
<li class="item-101 current active"><a href="/" >Home</a></li>
<li class="item-102"><a class="dropdown-toggle" href="/about-us" >About Us</a></li>
<li class="item-210 deeper parent"><a href="#" >Dogs</a>
<ul class="nav-child unstyled small">
<li class="item-212"><a href="/2015-11-24-14-19-31/collies" >Collies</a></li>
<li class="item-213"><a href="/2015-11-24-14-19-31/pomeranians" >Pomeranians</a></li>
</ul>
</li>
<li class="item-211 deeper parent"><a href="#" >Cats</a>
<ul class="nav-child unstyled small">
<li class="item-214"><a href="/2015-11-24-14-20-12/burmese" >Burmese </a></li>
<li class="item-215"><a href="/2015-11-24-14-20-12/russian-blues" >Russian Blues</a></li>
</ul>
</li>
</ul>
</source>

===Example 2 - A Second Menu Module With Child Level Menu Items===

To show in a separate module in a different position, follow these steps:
# Navigate to '''Extensions'''{{rarr}}'''Module Manager''' and locate or create a second Menu Module associated with your menu. If you are unfamiliar with how to create a new menu module, for instructions on creating a menu module, see: [[S:MyLanguage/Help34:Extensions Module Manager Menu|Module Menu]]{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Control-Panel-es.png|775px|border]]
# Click on the module name associated with your menu. In this tutorial, we are selecting ''Left Menu''. Note: this image has been filtered by selecting ''Menu'' in the Module type dropdown.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-List-Menus-2-es.png|775px|border]]
# In the Module details, set the '''Start level''' to ''2'', the '''End Level''' to ''All'' and set '''Show Submenu Items''' to ''Yes''. Note the position has changed and the menu we are pointing to is the '''Main Menu'''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Details-2-es.png|775px|border]]
# For this tutorial, we have used the '''Module Assignment''' tab and assigned this Menu Module to appear on all pages except the home page.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Module-Assignment-Tab-es.png]]
# Click on '''Save & Close'''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Save-es.png]]
# Go to the frontend of your site and navigate to the ''Collies'' article. Your menu should look similar to this. Notice the child level subitems are the only items showing.{{-}}[[Image:J3x-Create-Sublevel-Menu-Frontend-Sample-Child-Menu-es.png|775px|border]]
# The source code generated will look similar to this:
<source lang="html4strict">
<ul class="nav menu">
<li class="item-212 current active"><a href="/2015-11-24-14-19-31/collies" >Collies</a></li>
<li class="item-213"><a href="/2015-11-24-14-19-31/pomeranians" >Pomeranians</a></li>
</ul>
</source>

==Sub-Sub-Menús==
Using this same technique, it is easy to create third-level sub-menus. You just make the Parent Menu Item a second-level sub-menu. Then you could use the same technique to create a separate Menu Module with Start Level of 2 and End Level of 3. This would show only the third-level Menu Items.

<noinclude>
[[Category:Beginners]]
[[Category:Tutorials]]
[[Category:Joomla! 3.x]]
[[Category:Menu Management]]
</noinclude>

Translations:J3.x:Creating a submenu/75/es

2015-12-25T18:48:06Z

# Para este tutorial, hemos añadido algunos estilos en el panel "Avanzado". En la "Clase CSS" (Menu Class Suffix') hemos introducido "navbar-nav nav-pills". Podrías poner "navbar-nav nav-tabs" para obtener un aspecto ligeramente diferente. Nota: hay un espacio antes de ''navbar-nav''.

J3.x:Creating a submenu/es

2015-12-25T18:42:44Z

Framon: Created page with "# En los detalles del módulo, establece el "Nivel Inicial" (Start level) a 1, el "Nivel Final" (End Level) a "Todos" (All) y "Mostrar elementos del menú" (Show Sub-menu Ite..."

<noinclude><languages /></noinclude>
{{Top portal heading|color=white-bkgd|icon=magic|icon-color=#5091cd|size=3x|text-color=#333|title=Tutorial 
Cómo Crear un Submenú en un Sitio Joomla!}}
<noinclude>{{Joomla version|version=3.x}}</noinclude>
En Joomla, los submenús se pueden mostrar de dos formas: bajo dos o más niveles jerárquicos o como un menú modular completamente separado. Esto sirve para construir menús que muestren la jerarquía de navegación entre items (a nivel de padres e hijos), o para mostrar solamente items en un cierto subnivel del menú en una posición del template completamente separada del resto. Para mostrar como hacerlo, iremos creando paso a paso items de menú padres e hijos y veremos como visualizar estos items dentro de un solo gran menú jerárquico, o como un menú separado que solo muestre los items hijos en una posición separada del template. {{-}}
__TOC__
Para empezar, funciones de menú con tres construcciones básicas:
*Artículos - necesitas contenido para enlazar. Pueden ser partes de un componente, otros items de menú, o enlaces externos.
*Menú - describe los elementos del menú, el tipo de navegación, su relación padre/hijo a otros elementos de menú y el orden en que se muestran.
*Módulo de Menú - controla la posición y visualización del menú.

Para este tutorial, comienza ingresando en Joomla como usuario administrador. Si no sabes como ingresar lee el siguiente artículo: [[S:MyLanguage/J3.x:Logging_in_or_out_of_the_Administrator_back-end|Ingresando y saliendo del panel de administración de Joomla]]. {{-}}

'''Nota:''' Para este tutorial necesitas permisos de super administrador o permisos suficientes para crear y modificar artículos, items de menú, y módulos. Para más información sobre Control de Acceso de Usuarios (ACL) lee: [[S:MyLanguage/J3.x:Access Control List Tutorial|Tutorial ACL]].

==Paso 1 - Crea Tus Artículos==
En nuestro ejemplo, vamos a crear items de menú de nivel superior para "Perros" y "Gatos". Bajo Perros, tendremos "Collies" y "Pomeranos". Bajo "Gatos" tendremos "Birmanos" y "Azul Ruso". Así que la estructura de nuestro ejemplo de items de menú será como sigue:

*Perros
**Collies
**Pomeranos
*Gatos
**Birmanos
**Azules Rusos

Primero, crea cuatro artículos para que podamos enlazar nuestos items de menú a ellos: "Collies", "Pomeranos", "Birmanos" y "Azules Rusos". Lee este tutorial si necesitas ayuda para crear un artículo: [[S:MyLanguage/Help34:Content Article Manager Edit|Añadir un nuevo artículo]].

==Paso 2 - Crea los Items de Menú de Nivel Superior==
Para crear la estructura, necesitamos navegar al menú donde queremos que estén nuestros nuevos items. Si es un menú nuevo, necesitarás crearlo. Lee el tutorial sobre como crear un menú: [[S:MyLanguage/J3.x:Adding a new menu|Añadir un nuevo menú]].

Una vez tengas tu menú localizado en el Gestor de Menús, añadirás los items de menú padres usando '''Enlaces del Sistema'''{{rarr}}'''Crear una URL''' para cada enlace de navegación: ''Perros'' y ''Gatos''.

Nótese que hay otros tipos de items de menú que se pueden usar para el nivel padre de la estructura de navegación.

Aquí están los pasos para crear los Items de menú usados en nuestros datos de ejemplo. Para más información sobre creación de Menús lee: [[S:MyLanguage/J3.x:Adding a new menu|Añadir un nuevo menú]]. {{-}}
# Navegue hasta el Gestor de Menú haciendo clic en "Menús"'{{rarr}}"'Menú principal"'{{-}}[[Image:J3x-Edit-Main-Menu-es.jpg|775px|border]]
# En la barra de herramientas, clique sobre "Nuevo"{{-}}[[Image:J3x-Edit-Main-Menu-Toolbar-new-es.png|775px|border]]
# En este ejercicio, crearemos enlaces "contenedores" para los items de nivel superior "Perros" y "Gatos". En el panel "Detalles", clique sobre el botón "Seleccionar" un "Tipo de elemento del menú". En la ventana emergente que aparecerá, seleccionaremos posteriormente '''Enlaces del Sistema'''{{rarr}}'''Crear una URL'''. {{-}}[[Image:J3x-Add-Main-Menu-Select-Type-es.png|775px|border]]
# Clique sobre "Enlaces del sistema", luego deslice hacia abajo y seleccione "Crear una URL".{{-}}[[Image:J3x-Create-Sublevel-Menu-System-External-Url-en.png|775px|border]]
# Añade el '''Título de Menú''' y teclee una parrilla "#" en la caja del '''Enlace'''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Menu-Item-External-Url-en.png|775px|border]]
# Guarda el Item de menú recién creado. {{-}}[[Image:Joomla-3-Menu-Add-Menu-Save-es.png|775px|border]]
# Repite los pasos 2 - 6 para el item de nivel superior "Gatos".

==Paso 3 - Crea los Items de menú de nivel inferior==
Ahora se añadirán los items de menú de nivel inferior seleccionando el Tipo de elemento '''Artículos'''{{rarr}}'''Mostrar un solo artículo''' para crear los enlaces a las páginas de "Collies", "Pomeranos", "Birmanos" y "Azules Rusos". Para cada item de menú creado, estableceremos el "Elemento principal" a "Perros" o "Gatos".

Para información más detallada sobre cómo agregar un elemento del menú que apunta a un Artículo, lea: [[S:MyLanguage/Adding a menu item which points to an Article|Agregar un elemento del menú que apunta a un Artículo]].

'''Nota:''' Hay otros tipos de items que se pueden usar para los subniveles de la estructura de navegación.

# En la barra de herramientas, clique sobre "Nuevo".{{-}}[[Image:J3x-Edit-Main-Menu-Toolbar-new-es.png|775px|border]]
# En el nuevo Item de Menú, clique sobre el botón de selección de "Tipo de elemento del menú".{{-}}[[Image:J3x-Add-Main-Menu-Select-Type-es.png|775px|border]]
# Seleccione '''Artículos'''{{rarr}}'''Mostrar un solo artículo''' de la lista mostrada.{{-}}[[Image:J3x-Add-Main-Menu-Article-Type-es.png|border]]
# De vuelta al panel de "Detalles" de nuevo Item de Menú, clique sobre "Seleccionar artículo" para acceder a la lista de artículos.{{-}}[[Image:J3x-Add-Main-Menu-Article-Select-Article-es.png|border]]
# Seleccione el artículo "Collies" para este ejemplo.{{-}}[[Image:J3x-Create-Sublevel-Menu-Menu-Item-Single-Article-en.png|border]]
# De vuelta al panel de "Detalles" de nuevo Item de Menú, teclee un "Título del elemento del menú". A continuación clique sobre la lista de selección "Elemento principal" situada en la columna más a la derecha. Busque y seleccione el item superior "Perros", deslizándose sobre dicha lista. Nótese que el nivel de menú superior se indica mediante un único trazo "-", el segundo nivel con dos trazos "--", el tercero con tres "---" y así sucesivamente. {{-}}[[Image:J3x-Create-Sublevel-Menu-Select-Parent-Item-en.png|775px|border]]
# Clique sobre el botón "Guardar y cerrar" en la barra de herramientas de arriba.{{-}}[[Image:Joomla-3-Menu-Add-Menu-Save-es.png|775px|border]]
# Repita los pasos del 1 al 7 para los restantes artículos: "Pomeranos" con "Perros" como elemento principal y los artículos "Birmanos" y "Azules Rusos" con elemento principal "Gatos".
# Cuando haya terminado con la sección de "Items de Menú", el gestor de Items del Menú debería tener un aspecto similar al siguiente:{{-}}[[Image:J3x-Create-Sublevel-Menu-Items-en.png|775px|border]]

==Step 4 - Configurar el Módulo de Menú==
En este momento, ya tenemos los artículos e items del menú hechos. Ahora necesitamos actualizar el "Módulo de Menú". En Joomla!, el Módulo del Menú determina tres aspectos importantes:
# La apariencia del menú;
# Dónde se mostrará dentro de la página;
# En qué páginas se mostrará.

Realizaremos dos ejemplos:
* En el primer ejemplo configuraremos parámetros del módulo para mostrar el menú con los items de nivel superior y sus subniveles debajo.
* En el segundo ejemplo añadiremos un módulo de menú a mayores que aparecerá en la columna izquierda y mostrará tan solo los items de menú de segundo nivel.
'''Nota:''' Ambos ejemplos usarán el Template Protostar incluido en la instalación estándar de Joomla!

===Ejemplo 1 - Un Módulo de Menú con Items de Menú de Segundo Nivel===
Para mostrar el módulo del menú, siga estos pasos:
# Navega a '''Extensiones'''{{rarr}}'''Módulos''' y localiza el Módulo de Menú asociado con tu menú ("Main Menú" si tus items están en el menú principal). Si necesitas crear un nuevo módulo y necesitas instrucciones, lee: [[S:MyLanguage/Help34:Extensions Module Manager Menu|Module Menu]] {{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Control-Panel-en.png|775px|border]]
# Clica sobre el nombre del módulo asociado con tu menú. En este tutorial, hemos elegido el "Main Menu" (menú principal). '''Nota:''' en esta imagen se ha seleccionado "Menú" en el filtro de "Tipo de módulo" de la columna izquierda, para ver solo los módulos de menú y eliminar el resto de módulos de la vista.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-List-Menus-en.png|775px|border]]
# En los detalles del módulo, establece el "Nivel Inicial" (Start level) a 1, el "Nivel Final" (End Level) a "Todos" (All) y "Mostrar elementos del menú" (Show Sub-menu Items) a "Si" (Yes).{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Details-en.png|775px|border]]
# For this tutorial, we have added some styling in the '''Advanced''' tab. In the '''Menu Class Suffix''' we have entered ''navbar-nav nav-pills''. You can also add ''navbar-nav nav-tabs'' for a slightly different look. Note: there is a space before ''navbar-nav''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Advanced-Menu-Class-Suffix-en.png|border]]
# Click on '''Save & Close'''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Save-en.png|border]]
# Go to the frontend of your site and your menu should look similar to this. In the Protostar Template, the sublevel menu items are displayed as dropdown menu items.{{-}}[[Image:J3x-Create-Sublevel-Menu-Frontend-Sample-Dropdown-en.png|775px|border]]
# The source code generated will look similar to this:
<source lang="html4strict">
<ul class="nav menu navbar-nav nav-pills">
<li class="item-101 current active"><a href="/" >Home</a></li>
<li class="item-102"><a class="dropdown-toggle" href="/about-us" >About Us</a></li>
<li class="item-210 deeper parent"><a href="#" >Dogs</a>
<ul class="nav-child unstyled small">
<li class="item-212"><a href="/2015-11-24-14-19-31/collies" >Collies</a></li>
<li class="item-213"><a href="/2015-11-24-14-19-31/pomeranians" >Pomeranians</a></li>
</ul>
</li>
<li class="item-211 deeper parent"><a href="#" >Cats</a>
<ul class="nav-child unstyled small">
<li class="item-214"><a href="/2015-11-24-14-20-12/burmese" >Burmese </a></li>
<li class="item-215"><a href="/2015-11-24-14-20-12/russian-blues" >Russian Blues</a></li>
</ul>
</li>
</ul>
</source>

===Example 2 - A Second Menu Module With Child Level Menu Items===

To show in a separate module in a different position, follow these steps:
# Navigate to '''Extensions'''{{rarr}}'''Module Manager''' and locate or create a second Menu Module associated with your menu. If you are unfamiliar with how to create a new menu module, for instructions on creating a menu module, see: [[S:MyLanguage/Help34:Extensions Module Manager Menu|Module Menu]]{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Control-Panel-es.png|775px|border]]
# Click on the module name associated with your menu. In this tutorial, we are selecting ''Left Menu''. Note: this image has been filtered by selecting ''Menu'' in the Module type dropdown.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-List-Menus-2-es.png|775px|border]]
# In the Module details, set the '''Start level''' to ''2'', the '''End Level''' to ''All'' and set '''Show Submenu Items''' to ''Yes''. Note the position has changed and the menu we are pointing to is the '''Main Menu'''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Details-2-es.png|775px|border]]
# For this tutorial, we have used the '''Module Assignment''' tab and assigned this Menu Module to appear on all pages except the home page.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Module-Assignment-Tab-es.png]]
# Click on '''Save & Close'''.{{-}}[[Image:J3x-Create-Sublevel-Menu-Module-Save-es.png]]
# Go to the frontend of your site and navigate to the ''Collies'' article. Your menu should look similar to this. Notice the child level subitems are the only items showing.{{-}}[[Image:J3x-Create-Sublevel-Menu-Frontend-Sample-Child-Menu-es.png|775px|border]]
# The source code generated will look similar to this:
<source lang="html4strict">
<ul class="nav menu">
<li class="item-212 current active"><a href="/2015-11-24-14-19-31/collies" >Collies</a></li>
<li class="item-213"><a href="/2015-11-24-14-19-31/pomeranians" >Pomeranians</a></li>
</ul>
</source>

==Sub-Sub-Menús==
Using this same technique, it is easy to create third-level sub-menus. You just make the Parent Menu Item a second-level sub-menu. Then you could use the same technique to create a separate Menu Module with Start Level of 2 and End Level of 3. This would show only the third-level Menu Items.

<noinclude>
[[Category:Beginners]]
[[Category:Tutorials]]
[[Category:Joomla! 3.x]]
[[Category:Menu Management]]
</noinclude>

Translations:J3.x:Creating a submenu/73/es

2015-12-25T18:42:44Z

# En los detalles del módulo, establece el "Nivel Inicial" (Start level) a 1, el "Nivel Final" (End Level) a "Todos" (All) y "Mostrar elementos del menú" (Show Sub-menu Items) a "Si" (Yes).