Cómo modificar el menú principal en Shopify: Guía UX

El menú de navegación es el GPS de tu tienda online. Si un cliente entra y no entiende en menos de 3 segundos dónde hacer clic para encontrar lo que busca, se irá.

Muchos merchants cometen el error de llenar el menú principal de enlaces inútiles ("Quiénes somos", "Blog", "Política de envíos") antes de mostrar sus productos. O peor, crean estructuras tan complejas que nadie las entiende.

En este tutorial, aprenderás a editar, ordenar y crear menús desplegables en Shopify, aplicando las mejores prácticas de UX (Experiencia de Usuario).

Paso 1: Acceder al Editor de Navegación

A diferencia de otras plataformas, en Shopify los menús no se editan dentro del "Diseño del Tema", sino en una sección propia.

1. Ve a tu panel de administración.
2. Haz clic en Tienda online > Navegación.
3. Verás dos menús por defecto:
   • Main menu (Menú principal): El que sale arriba en la cabecera.
   • Footer menu (Menú inferior): El que sale al pie de página (ideal para legales y contacto).
4. Haz clic en Main menu para editarlo.

Paso 2: Añadir y enlazar elementos

Dentro del editor, verás la lista de enlaces actuales.

Para añadir un enlace nuevo:

1. Haz clic en Agregar elemento del menú.
2. Nombre: Escribe el texto que verá el cliente (ej: "Zapatillas").
3. Enlace: Aquí viene la magia. No tienes que copiar y pegar URLs. Haz clic en la caja y selecciona:
   • Colecciones: Para enlazar a una categoría de productos (Lo más común).
   • Productos: Para destacar un producto específico (ej: "Tarjeta Regalo").
   • Páginas: Para "Sobre Nosotros" o "Contacto".
   • Blogs: Para tu blog de noticias.

Consejo Pro: Usa nombres cortos y descriptivos. Mejor "Mujer" que "Catálogo de Ropa para Señora".

Paso 3: Crear menús desplegables (Drop-down)

Si tienes muchas categorías (Camisetas, Pantalones, Abrigos), no las pongas todas en la primera fila. Agrúpalas bajo "Ropa".

Para crear un submenú (anidamiento):

1. Crea el elemento principal (ej: "Ropa") y enlázalo a una colección general o pon `#` si no quieres que lleve a ningún sitio.
2. Crea los elementos hijos (ej: "Camisetas").
3. Arrastra y suelta: Haz clic en los 6 puntitos (⠿) a la izquierda del nombre "Camisetas" y arrástralo debajo y un poco a la derecha de "Ropa".
4. Verás que se crea una estructura escalonada. Eso indica que "Camisetas" ahora está dentro de "Ropa".

Puedes crear hasta 3 niveles de profundidad (Menú > Submenú > Sub-submenú).

La Regla de Oro: Menos es Más

Tu menú principal no es un almacén, es un escaparate. Sigue estas reglas para vender más:

• Máximo 7 elementos: La memoria a corto plazo humana colapsa con más de 7 opciones.
• Lo importante a la izquierda: Pon "Tienda" o tus categorías principales ("Novedades", "Best Sellers") al principio.
• Lo corporativo al final (o al Footer): "Contacto", "Envíos" y "Aviso Legal" no deberían ocupar espacio prime en tu cabecera. Muévelos al menú inferior o a un menú secundario.

Preguntas Frecuentes sobre Navegación

¿Cómo creo un "Mega Menú" con fotos?

El editor nativo de Shopify solo permite menús de texto simples. Si quieres un Mega Menú visual con imágenes promocionales, necesitas que tu Tema lo soporte (la mayoría de temas 2.0 Premium lo tienen) o instalar una App de menús.

¿Puedo tener menús diferentes para móvil y escritorio?

Nativamente, Shopify usa el mismo menú ("Main menu") para ambos, adaptándolo a formato hamburguesa en móvil. Sin embargo, algunos temas avanzados permiten seleccionar menús distintos en la configuración del encabezado.

¿Cómo hago un enlace que no lleve a ningún sitio (solo desplegable)?

Al crear el elemento padre (ej: "Catálogo"), en el campo Enlace escribe el símbolo de># y selecciónalo. Esto creará un enlace "muerto" que solo sirve para abrir el desplegable.