Configurar reglas de visibilidad
Las Visibility Rules son un conjunto de condiciones que determinan si un menú o un elemento de menú se muestra a un visitante específico — basado en dispositivo, contenido del carrito, horario, mercado, etiquetas de cliente o clientes B2B — aplicando a ambos niveles con exactamente un conjunto de reglas.
Dónde configurarlas
- Nivel de elemento de menú: abre Edit item → grupo Visibility → haz clic en Setup the Visibility rules. (El grupo Visibility está dentro de un bloque contraído — si no lo ves de inmediato, haz clic en See more para expandirlo.)
- Nivel de menú: abre el panel Setting del menú → tarjeta Visibility Rules.
- Atajo desde la lista de menús: en la página de lista de menús, la columna Visibility Rules muestra No rule o Setup para cada menú — haz clic en Setup para saltar directamente a la tarjeta Visibility Rules de ese menú.
- Atajo desde el árbol de menú: un elemento que no es siempre visible muestra un icono de ojo junto a su nombre en el árbol — pasa el cursor para ver un resumen de sus condiciones activas, o haz clic para abrir directamente las Visibility Rules de ese elemento.
De aquí en adelante, todas las condiciones, sintaxis y cómo se combinan son compartidas para ambos niveles — solo la ubicación difiere.
Market / Customer tag / B2B se aplican solo a Shopify y son actualmente campos de texto libre (sin menú desplegable predefinido) — cada campo tiene un enlace “View your Markets” / “Manage customer tags” / “Manage B2B companies” que te lleva directamente a la página correspondiente de Shopify Admin para verificar el valor exacto antes de escribir.
Condiciones soportadas
| Condición | Plan | Mostrar cuando | Valor de entrada |
|---|---|---|---|
| Device | Business en adelante | Coincide con el dispositivo seleccionado | All devices / Mobile only / Desktop only |
| Page / URL | Business en adelante | Tipo de página correcto o URL contiene/no contiene palabra clave | Marca tipos de página (Home/Products/Collections/Pages/Blogs/Others) + 2 campos de palabra clave |
| Cart contents | Business en adelante | El carrito tiene N o más productos (o menos de N, con la opción “ocultar cuando hay menos” activada) | Número entero, ej. 1 |
| Schedule | Business en adelante | Dentro del rango de fecha + hora establecido | Fecha/hora de inicio → fin, ingresado en UTC (convierte desde la hora local antes de escribir), comparado con el reloj del dispositivo del visitante |
| Market / Country | Elite | El visitante está navegando en el mercado seleccionado | Identificador de mercado, múltiples valores separados por comas: us, ca |
| Customer tag | Elite | El visitante conectado tiene la etiqueta | Una etiqueta única, ej. vip |
| B2B customer | Elite | El visitante conectado utiliza una cuenta B2B | Interruptor activado/desactivado |
Cómo se combinan las condiciones
Todas las condiciones habilitadas deben todas coincidir para que el menú/elemento se muestre — solo una condición fallida lo oculta inmediatamente. Las condiciones vacías se omiten y no cuentan.
Por ejemplo, habilitar tanto Device = Mobile only y Schedule = 01/09–15/09: muestra solo a visitantes en teléfonos móviles, y solo durante esas 2 semanas exactas.
Solo una condición habilitada que falla (rama derecha ✗) oculta el menú/elemento inmediatamente — independientemente de si otras condiciones pasan. Las condiciones vacías (no habilitadas) se omiten e ignoran.
5 ejemplos del mundo real
1. Mayoreo y menudeo al mismo tiempo, oculta precios mayoristas de clientes minoristas (nivel de menú)
Tu tienda vende tanto mayoreo como menudeo. Los clientes mayoristas (con una cuenta B2B aprobada por Shopify) compran a mejores precios y tienen su propio grupo de producto/colección. Quieres un grupo de menú “Precios mayoristas”, “Pedidos mayoristas rápidos”, “Productos mayoristas” — mostrando solo a clientes mayoristas, mientras que los visitantes minoristas no ven ningún menú de este tipo (evitando confusiones de precio y ocultando descuentos).
Cómo hacerlo: Construye un menú separado (o grupo de menú) que contenga enlaces mayoristas. Ve a Setting → Visibility Rules, habilita B2B customer. Resultado: este menú completo se muestra solo a visitantes con cuentas B2B conectadas; los clientes minoristas (incluso si están conectados) no verán este menú mientras navegan.
2. Banner promocional por tiempo limitado, muestra solo mientras compra (nivel de elemento)
Quieres un banner “Envío gratis en pedidos de 50€+” mostrándose solo durante la venta, y solo para clientes que han añadido al menos un producto a su carrito (evita distraer nuevos visitantes al llegar).
Cómo hacerlo: En el elemento banner, haz clic en Setup the Visibility rules → habilita Cart contents = 1, y Schedule = fechas de inicio/fin de la venta.
3. Enlace de oferta exclusiva para clientes VIP (nivel de elemento)
Quieres un elemento de menú “Ofertas VIP” visible solo para clientes etiquetados como VIP, mientras que los clientes regulares ni siquiera saben que existe.
Cómo hacerlo: Etiqueta el grupo de clientes VIP a través de Shopify Flow/Customer Segment (Segment → Flow “Customer enters segment” → aplicar etiqueta). En el elemento, haz clic en Setup the Visibility rules → habilita Customer tag = vip.
4. Tab Bar Premium para clientes VIP (nivel de menú)
Tu tienda quiere que los clientes VIP tengan una experiencia de navegación diferente — fondo oscuro, efectos brillantes, sensación premium — en lugar de compartir la interfaz estándar con todos los demás.
Cómo hacerlo: Construye una Tab Bar separada con una plantilla oscura premium, publícala en la misma posición de Tab Bar que tu tienda usa por defecto. Ve a Setting → Visibility Rules, habilita Customer tag = vip (etiqueta a través de Shopify Flow/Customer Segment como en el ejemplo 3). Resultado: los clientes etiquetados como VIP ven la Tab Bar premium; los clientes regulares aún ven tu Tab Bar estándar. (Mobile Menu usa el mismo enfoque.)
5. FAB impulsa venta adicional justo cuando el cliente añade el primer artículo (nivel de menú)
El cliente acaba de añadir su primer producto al carrito — el momento decisivo — y quieres que aparezca un botón flotante (FAB) con información de promoción (“compra más para desbloquear envío gratis”, regalo gratuito…) para empujarlo hacia el checkout más rápido, en lugar de que el FAB siempre se muestre y desordenar la vista desde el inicio.
Cómo hacerlo: Construye un FAB (Floating Button) con contenido promocional. Ve a Setting → Visibility Rules, habilita Cart contents = 1 (mostrar solo cuando el carrito tiene 1+ productos). Resultado: el FAB permanece oculto hasta que un cliente añade el primer producto a su carrito. Nota: la condición solo verifica el NÚMERO de productos en el carrito, no el valor del pedido — “50€+ desbloquea envío gratis” es el texto de marketing que escribes dentro del FAB, no una Visibility Rule que calcule por precio.