Cómo agregar un nuevo elemento al menú de navegación de Shopify (Cualquier enlace, cualquier menú, móvil incluido)
Agregar un elemento de menú en Shopify solo toma un minuto; el verdadero reto consiste en seleccionar el tipo de enlace correcto, colocarlo en el lugar adecuado y comprobar que se visualice correctamente en todas las superficies donde navegan los clientes (encabezado de escritorio, menú lateral móvil, pie de página y menús generados por aplicaciones).
Aunque crearlo en el panel toma segundos, los enlaces requieren una ubicación adecuada para verse limpios en cada pantalla.
Esta guía explica cómo agregar cualquier tipo de enlace a cualquier menú en Shopify, posicionarlo bien y verificar su visibilidad.
Quick answer: add a new item to your navigation menu
Para agregar un nuevo elemento a tu menú de navegación de Shopify, dirígete a Contenido > Menús en el panel de administración, abre el menú que utiliza tu tema, haz clic en Agregar elemento de menú, escribe un nombre, selecciona un enlace de la lista y guarda el menú.
Sigue estos 6 pasos en tu panel de Shopify:
- En tu panel de administración de Shopify, ve a Content > Menus (Shopify Help Center).
- Haz clic en el menú que muestra tu tema activo, generalmente denominado Main menu (Shopify Help Center).
- Haz clic en Add menu item (Shopify Help Center).
- En Name, escribe el texto que verán los clientes.
- En Link, selecciona el destino directamente de la lista en lugar de pegar una URL (Shopify Help Center).
- Haz clic en Add y luego en Save menu (Shopify Help Center; Fudge.ai).
Algunas guías anteriores mencionaban “Online Store > Navigation”, pero Content > Menus es la ruta oficial en tiendas modernas.
Before you add the item: create the destination first
Crea y publica siempre tu página, colección, producto o política antes de enlazarla en el menú.
Selecciona destinos de la lista de Shopify: cambiar la URL o enlazar manualmente puede romper la conexión y causar errores 404 (Shopify Help Center).
Mantén un nombre (Name) corto y familiar. Etiquetas claras como “Zapatillas de correr” facilitan la navegación inmediata.
Pick the link type for your new item
Al hacer clic en Link, Shopify muestra su lista definida de tipos de enlace (Shopify Help Center). Elegir el tipo correcto garantiza un acceso confiable.
| Tipo de enlace | Uso recomendado | Ejemplo práctico |
|---|---|---|
| Home page | Dirige a los usuarios de vuelta a la página principal de la tienda | Un botón explícito de “Inicio” o alternativa al logo |
| Search | Abre la página de búsqueda del catálogo | Un enlace de texto “Buscar productos” en menús de servicio |
| Collections | Agrupaciones de productos, líneas de temporada o categorías | “Pantalones de mujer”, “Rebajas de verano” o “Novedades” |
| Products | Acceso directo a la página de detalle de un producto específico | Destacar un lanzamiento principal o una edición limitada |
| Pages | Contenido informativo independiente y páginas de ayuda | “Quiénes somos”, “Guía de tallas”, “Contacto” o “FAQ” |
| Blogs | Página principal o listado de artículos de un canal de blog | “Nuestro diario”, “Consejos de estilo” o “Noticias” |
| Blog posts | Un artículo individual publicado en el blog | Enlazar una guía de compra popular o ideas de regalo |
| Policies | Términos legales y normativas comerciales | “Política de reembolso”, “Privacidad” o “Términos del servicio” |
| Customer accounts | Acceso a inicio de sesión, registro o historial de pedidos | “Mi cuenta”, “Historial de pedidos” o “Iniciar sesión” |
| External page | Páginas web alojadas fuera del dominio de Shopify | Un portal de venta al por mayor o una mención de prensa |
| Email link | Un enlace mailto a tu dirección de soporte o ventas | Un enlace de asistencia directa como “Escribir a soporte” |
Link to an external site or an email address
Para enlazar un sitio externo, pega la URL completa en Link, espera a que aparezca el destino y selecciónalo (Shopify Help Center).
Para correos, escribe mailto:[email protected] en Link (Shopify Help Center).
Enlazar con URL manuales en páginas internas puede romper rutas y causar errores 404 (Shopify Help Center).
Concept illustration: elegir un tipo de enlace para un nuevo elemento de menú y verlo aparecer en el menú de la tienda.
Decide where the item goes: top level, inside a dropdown or the footer
Los elementos de menú se muestran en la tienda en el orden exacto definido en el panel de control (Shopify Help Center).
Move the item and change its order
Para cambiar el orden de los elementos:
- Mantén pulsado el icono de control (
⠿) junto al nombre del elemento (Shopify Help Center). - Arrastra el elemento verticalmente hacia arriba o hacia abajo hasta la posición deseada.
- Suelta el icono y haz clic en Save menu.
Put the item inside a dropdown
Para situar un elemento en un menú desplegable, arrástralo bajo el elemento principal y muévelo a la derecha hasta que quede sangrado.
Shopify admite hasta dos niveles de submenús bajo un elemento principal (Shopify Help Center). Introduce # si el elemento principal no debe enlazar a ninguna página.
La mayoría de los temas tratan los títulos desplegables como botones y no enlaces (Shopify Help Center). Cuando el catálogo crezca, conviene planificar una estructura de menú multinivel a tiempo.
Add the item to the footer menu
Los enlaces secundarios de utilidad encajan mejor en el menú del pie de página para no saturar la cabecera.
En Content > Menus, entra en Footer menu, haz clic en Add menu item y elige tu enlace. El pie de página solo muestra elementos de primer nivel (Shopify Help Center).
Shopify recomienda un máximo de siete elementos de primer nivel en el menú principal para evitar saturaciones (Shopify Help Center).
One item, every surface: where your new item shows up
Guardar un elemento no garantiza que se vea idéntico en todos los dispositivos. Su visualización depende de la superficie y del tema.
Shopify incluye por defecto menús principal y de pie en cada página (Shopify Help Center). Su ubicación exacta varía según el tema (Shopify Help Center).
En móviles, muchos temas repliegan el menú principal en un panel lateral tras un botón de hamburguesa; su posición exacta depende del tema.
Nielsen Norman Group advierte que el menú de hamburguesa no es universal y ocultar la navegación degrada la experiencia en escritorio y móvil (NN/g). Explora la navegación móvil más allá del menú hamburguesa o un menú con iconos para categorías visuales.
Las aplicaciones de terceros crean menús internamente sin usar los ajustes del panel (Shopify Help Center). Si una app gestiona la navegación, debes agregar el elemento en la app.
| Superficie | ¿Aparece el elemento automáticamente? | Qué debes hacer |
|---|---|---|
| Encabezado escritorio | Normalmente sí (según tema) | Verifica la asignación en la sección Header; vigila saltos de línea. |
| Menú lateral móvil | Depende del tema | Prueba en un móvil real; comprueba la sangría y el área de toque. |
| Menú de pie de página | Solo elementos de primer nivel | Agrega directamente a Footer menu; no admite submenús desplegables. |
| Menú de aplicación | No | Las aplicaciones gestionan su propio árbol; agrégalo en su panel. |
Concept illustration: dónde puede aparecer un nuevo elemento en el encabezado de escritorio y en el menú móvil.
New item not showing? Five quick checks
Si un elemento nuevo no aparece en la tienda, comprueba estos cinco puntos:
- ¿Guardaste el menú? Los cambios solo se aplican tras hacer clic en Save menu (Shopify Help Center; Fudge.ai).
- ¿El tema apunta al menú correcto? En tu editor de temas, comprueba las secciones Header y Footer (Shopify Help Center).
- ¿El subelemento está sangrado? Verifica que el enlace desplegable esté bajo el elemento principal y desplazado a la derecha (Shopify Help Center).
- ¿Tu tema es una versión antigua? Algunos temas viejos no admiten menús con tres o más niveles (Shopify Help Center).
- ¿El menú está gestionado por una aplicación? Las apps crean menús propios e ignoran los ajustes del panel (Shopify Help Center).
Si un enlace da error 404, asegúrate de seleccionar el destino de la lista en vez de escribir la URL (Shopify Help Center).
Trade-offs: when not to add another item
Cada elemento adicional añade carga cognitiva a los clientes. Añadir enlaces sin límite perjudica la legibilidad de la tienda.
Shopify aconseja mantener siete o menos elementos de primer nivel para no saturar la cabecera (Shopify Help Center). Agrupa categorías en menús desplegables.
Los menús desplegables tienen desventajas: la mayoría de temas convierten el elemento principal en un botón (Shopify Help Center), impidiendo navegar a la colección principal.
En móviles, ocultar la navegación global empeora la experiencia del usuario (NN/g), facilitando que los enlaces profundos pasen inadvertidos.
Antes de agregar a la cabecera, valora otros lugares: los enlaces secundarios van bien en el pie, que solo muestra primer nivel (Shopify Help Center). Los atributos pueden encajar mejor como filtros. Consulta los límites del menú del tema predeterminado.
Adding the same item to a Navi+ menu
Shopify señala que las apps de navegación crean los menús dentro de la app en lugar de usar los ajustes de menú del panel (Shopify Help Center). Navi+ Tab Bar, Mobile Menu y Mega Menu funcionan así, por lo que agregar enlaces en Content > Menus no actualizará tu menú Navi+.
Para agregar un elemento en Navi+:
- Abre el panel de Navi+ en Shopify y elige tu menú.
- Haz clic en + Add item; los nuevos elementos se agregan al final (Navi+ Documentation).
- Arrastra verticalmente hacia arriba para reordenarlo.
- Desplaza a la derecha para convertirlo en subelemento del elemento superior (Navi+ Documentation).
- Haz clic en Save; los cambios no serán visibles hasta que guardes (Navi+ Documentation).
- En la Tab Bar, publica el menú para mostrarlo en tu tienda (Navi+ Documentation).
El límite de profundidad depende del tipo de menú, no del plan (Navi+ Documentation); la Tab Bar admite 3 niveles (Navi+ Documentation). Aprende cómo crear un menú de escritorio en una aplicación de menús.
If you want the same new item to sit in a bottom tab bar or a mega menu on top of your theme menu, Navi+ Tab Bar & Mega Menu lets you add it in the app’s menu tree, drag it into place, save and publish.
Action checklist
Revisa estos 8 puntos antes de dar por publicado tu nuevo enlace:
- Destino existente: Página, colección, producto o política publicada en tu panel.
- Elegido de la lista: Destino seleccionado de la lista en lugar de una URL manual.
- Tipo de enlace correcto: El tipo coincide con el recurso de destino.
- Ubicación adecuada: Máximo 7 elementos principales, desplegable sangrado o pie.
- Menú guardado: Guardado en el editor Content > Menus de Shopify.
- Ajustes de tema verificados: Cabecera y pie del tema apuntan al menú editado.
- Comprobado en móvil: Verificado en un teléfono real que el enlace se pulse con facilidad.
- Menú de app actualizado: Añadido en el panel de la aplicación si procede.
FAQ
¿Dónde puedo agregar un nuevo elemento de menú en Shopify?
En Shopify, ve a Content > Menus, selecciona tu menú activo (habitualmente Main menu) y haz clic en Add menu item (Shopify Help Center).
¿Un elemento de menú puede enlazar a una web externa o a un correo?
Sí. Para sitios externos, pega la URL en Link, espera que aparezca el destino y selecciónalo (Shopify Help Center). Para correos, usa mailto:[email protected].
¿Cuántos niveles puedo anidar en un menú de Shopify?
Un elemento principal admite hasta dos niveles de submenús desplegables (tres niveles en total) (Shopify Help Center). Algunos temas antiguos no admiten tres niveles (Shopify Help Center).
¿Por qué no aparece el nuevo elemento en mi tienda?
Suele deberse a menús no guardados, temas apuntando a otro menú o menús generados por una aplicación (Shopify Help Center; Fudge.ai). Comprueba también la sangría (Shopify Help Center).
¿Puedo poner un menú desplegable en el pie de página?
No. Los menús de pie de página de Shopify solo muestran enlaces de primer nivel y no admiten desplegables (Shopify Help Center).
¿El nuevo elemento aparecerá automáticamente en móviles?
El menú principal se muestra en móvil, pero su diseño depende del tema (suele ser un menú lateral) (Shopify Help Center). Si usas una app, agrégalo dentro de la app (Shopify Help Center).
Sources
- Shopify Help Center: Add, remove, or edit menu items in your online store
- Shopify Help Center: Set up drop-down menus in your online store
- Shopify Help Center: Understanding navigation
- Nielsen Norman Group: Mobile Navigation: Hamburger or Not?
- Navi+ Documentation: Item Create & Manage
- Navi+ Documentation: Tab Bar & Bottom Navigation
- Navi+ Documentation: Multi-level Structure
- Fudge.ai: How to Add a New Menu Item in Shopify
Explora los temas
Esta guía enlaza a artículos específicos — profundiza en cada uno.