La navegación de una tienda en línea es la forma en que los usuarios interactúan y se desplazan por la misma para buscar productos, acceder a diferentes secciones y realizar compras. Una buena navegación en una tienda en línea debe ser intuitiva, fácil de usar y permitir a los usuarios encontrar rápidamente lo que están buscando, es un aspecto crucial del diseño y la experiencia del usuario.

La navegación de una tienda en línea se configura desde el diseño mediante menús y botones. Estos elementos redirigen a diferentes partes de la tienda e incluso pueden dirigir a lugares externos, como redes sociales. 

En esta sección, puedes crear, configurar y gestionar todos los menús de la tienda en línea. Cada menú está compuesto por ítems a los que se les asigna un nombre para mostrar, se ordenan en diferentes niveles y se selecciona a dónde dirigir a los usuarios.

 Tipos de menú 

Menú de categorías: Cada opción del menú representa una categoría específica de productos, como "Ropa", "Electrónica", "Accesorios", "Hogar y Jardín" y otras categorías relevantes.  Cuando un usuario hace clic en una opción del menú de categorías de productos, se le redirige a una página que muestra los productos correspondientes a esa categoría específica. Este menú se crea y configura desde la sección Categorías.

Menú de navegación:  Cada opción del menú representa una sección principal de la tienda, como "Inicio", "Productos", "Servicios", "Contacto" y otras secciones relevantes. A diferencia del menú de categorías es posible redirigir a los usuarios a distintos tipos de páginas y no necesariamente páginas de producto. 

Mega Menú:  es un tipo de menú desplegable que muestra una amplia variedad de opciones de navegación en un solo panel  con una gran cantidad de contenido y categorías, ofrece una vista más amplia y completa de las opciones de navegación.

Un Mega Menú generalmente se despliega horizontalmente en múltiples columnas y filas, por lo que  permite a los usuarios acceder rápidamente a diferentes secciones y categorías del sitio web de diferentes maneras sin tener que realizar múltiples clics.

Tabla de contenidos

Crear un menú de navegación

El menú de navegación permite agregar items y elegir dónde apunta cada uno de ellos. Puede elegirse uno del listado de links de la tienda o incorporar uno externo. 

Para crear un menú de navegación, realiza los siguientes pasos:

Paso 1. Desde el  administrador ingresa a Tienda online > Navegación.

Paso 2. Presiona el botón + Crear menú.

Paso 3. Asigna un nombre al menú. Esto es de referencia interna, no se visualiza en la tienda.

Paso 4. En la sección Items del menú, presiona el botón + Añadir ítem

Paso 5. Asigna un nombre al ítem del menú.

Paso 6. Selecciona donde dirige el ítem. 

Paso 7. Presiona el botón Guardar

Crear un mega menú

Un Mega Menú generalmente se despliega horizontalmente en múltiples columnas y filas, por lo que  permite a los usuarios acceder rápidamente a diferentes secciones y categorías.

Dentro del megamenu se encuentran “bloques” de categorías agrupadas por un título.


Para crear un mega menú y ordenar los bloques se utilizan los siguientes comandos especiales:

[mega] = Comando que indicar que de ese ítem se desprende un Mega Menú 

 [title] =Comando que indica que el elemento es título dentro del Mega menú.

 | = separador de columnas.  Comando que indica que se divide la columna

- = separador lateral. Comando que indica que se divide la fila

Por ejemplo se desea generar un megamenu para la categoría “Anillos” que cuando al hacer clic, se despliega el panel con los siguientes bloques:

ANILLO 

Metal PiedraLínea
OroCristalesEsencia
PlataRubiMomentos
Recubierto en oroPerlasFantasía
Recubierto en plataAmatista 
 Sin piedra 
 Diamante 
 Zafiro 

La estructura y el orden de los bloques va a ser creada a través de los comandos que se utilicen. Puede generar un menú con tres columnas, uno con tres filas o dos columnas y una compuesta por dos filas. Para este último caso, se utiliza la secuencia de comandos de la siguiente manera:

ANILLOS [mega]

Metal [title]

Oro

Plata

Recubierto en oro

Recubierto en plata

-

Línea [title]

Esencia

Momentos

Fantasía

|

Piedra[title]

Cristales

Rubi

Perlas

Amatista

Sin piedra

Diamante

Zafiro

Para crear un mega menú, realiza los siguientes pasos:

Paso 1. Desde el  administrador ingresa a Tienda online > Navegación.

Paso 2. Presiona el botón + Crear menú.

Paso 3. Asigna un nombre al menú. Esto es de referencia interna, no se visualiza en la tienda.

Paso 4. Presiona el botón + Añadir ítem, agrega un nombre junto con el comando [mega]

Paso 5. Presiona el botón + sobre el Mega Menú creado, para incorporar un título. 

Paso 6. Asigna un nombre de título junto con el comando [title].

Paso 7. Presiona el botón + sobre el título creado, para incorporar las categorías.

Paso 8. Asigna un nombre a la categoría y selecciona dónde se dirige.

Paso 9. Presiona + sobre el Mega Menú creado para incorporar los comandos “|” para dividir en columnas o “-” para dividir en fila. Este comando debe redireccionarse a un Link Vacío

Paso 10. Repite el proceso por cada “bloque” que deseas agregar.

Paso 11. Presiona el botón Guardar

Donde dirigir la navegación

Dentro de un menú, cada uno de los ítems se dirige a distintas partes de la tienda. Puede elegir una sección ya creada o pegar un link en particular donde direccionar. A continuación se detallan cada una de las secciones donde puede direccionarse:

Página principal: dirige a la home

Categorías: dirige a una categoría de productos.

Colecciones: dirige a una colección.

Productos: dirige a una página de producto

Fabricantes: dirige a una grilla de productos del fabricante.

Tiendas: dirige a la información de sucursales.

Formulario de contacto: dirige a la página de formulario.

Páginas: dirige a una página de contenidos

Secciones y tópicos: dirige a una agrupación de contenidos.

Legales: dirige a una página de políticas

Vacío: no realiza una redirección. 

Pegar Link: permite agregar cualquier link ya sea interno o externo. 

Donde utilizar un menú

Encabezado: es el menú de navegación principal

Menú primario: Para el caso de tipos de encabezado de dos menús, es el que se encuentra a la izquierda.

Menú secundario: Para el caso de tipos de encabezado de dos menús, es el que se encuentra a la derecha.

Top bar: es una herramienta que permite incorporar dos menús por encima del menú principal. Puede seleccionar un menú en la parte izquierda y uno en la parte derecha. 

Pie de página: de acuerdo al estilo del pie de página, pueden agregarse de 3 a 4 menús en el footer. 

Agregar un item al menú

Para agregar un ítem al menú, realiza los siguientes pasos:

Paso 1. Desde el  administrador ingresa a Tienda online > Navegación.

Paso 2. Busca y selecciona el menú a editar.

Paso 3. Presiona el botón + Añadir ítem

Paso 4. Asigna un nombre y selecciona dónde se dirige

Paso 5. Presiona el botón Guardar.

Editar un item del menú

Para editar un menú, realiza los siguientes pasos:

Paso 1. Desde el  administrador ingresa a Tienda online > Navegación.

Paso 2. Busca y selecciona el menú a editar.

Paso 3. Realiza las modificaciones en el ítem a editar.

Paso 4. Presiona el botón Guardar.

Eliminar un ítem del menú

Para eliminar un menú, realiza los siguientes pasos:

Paso 1. Desde el  administrador ingresa a Tienda online > Navegación.

Paso 2. Busca y selecciona el menú a editar.

Paso 3. Presiona el botón Eliminar

Paso 4. En la ventana emergente, presiona el botón Eliminar.

Cambiar el orden de los ítems del menú

Para cambiar el orden de los ítems de un menú, realiza los siguientes pasos:

Paso 1. Desde el  administrador ingresa a Tienda online > Navegación.

Paso 2. Busca y selecciona el menú a editar.

Paso 3. En el ítem mantener presionado el botón de drag and drop simbolizado por puntos al lado del nombre del item. 

Paso 4. Con el botón presionado arrastra el ítem a la posición que se desea.

Paso 5. Presiona el botón Guardar.