Configurer les règles de visibilité
Les Visibility Rules sont un ensemble de conditions qui détermine si un menu ou un élément de menu s’‘affiche pour un visiteur spécifique — selon le dispositif, le contenu du panier, le calendrier, le marché, les étiquettes clients ou les clients B2B — s’‘appliquant aux deux niveaux avec exactement un ensemble de règles.
Où les configurer
- Niveau élément de menu : ouvrez Edit item → groupe Visibility → cliquez sur Setup the Visibility rules. (Le groupe Visibility se trouve dans un bloc rétracté — si vous ne le voyez pas immédiatement, cliquez sur See more pour l’‘expander.)
- Niveau menu : ouvrez le panneau Setting du menu → carte Visibility Rules.
- Raccourci depuis la liste des menus : sur la page de liste des menus, la colonne Visibility Rules affiche No rule ou Setup pour chaque menu — cliquez sur Setup pour accéder directement à la carte Visibility Rules de ce menu.
- Raccourci depuis l’‘arborescence du menu : un élément qui n’‘est pas toujours visible affiche une icône œil à côté de son nom dans l’‘arborescence — survolez-la pour voir un résumé de ses conditions actives, ou cliquez dessus pour ouvrir directement les Visibility Rules de cet élément.
À partir de là, toutes les conditions, syntaxes et la façon dont elles se combinent sont partagées pour les deux niveaux — seule la localisation diffère.
Market / Customer tag / B2B s’‘appliquent uniquement à Shopify et sont actuellement des champs de texte libre (pas de menu déroulant prédéfini) — chaque champ dispose d’‘un lien “View your Markets” / “Manage customer tags” / “Manage B2B companies” qui vous dirige directement vers la page Shopify Admin correspondante pour vérifier la valeur exacte avant de taper.
Conditions soutenues
| Condition | Plan | Afficher quand | Valeur d’‘entrée |
|---|---|---|---|
| Device | Business et supérieur | Correspond au dispositif sélectionné | All devices / Mobile only / Desktop only |
| Page / URL | Business et supérieur | Type de page correct ou URL contient/ne contient pas de mot-clé | Cochez les types de page (Home/Products/Collections/Pages/Blogs/Others) + 2 champs de mot-clé |
| Cart contents | Business et supérieur | Le panier contient N produits ou plus (ou moins de N, avec l’‘inversion “masquer en dessous” activée) | Nombre entier, par ex. 1 |
| Schedule | Business et supérieur | Dans la plage de date + heure définie | Date/heure de début → fin, saisies en UTC (convertir depuis l’‘heure locale avant de saisir), comparées à l’‘horloge du dispositif du visiteur |
| Market / Country | Elite | Le visiteur navigue sous le marché sélectionné | Handle du marché, plusieurs valeurs séparées par des virgules : us, ca |
| Customer tag | Elite | Le visiteur connecté possède l’‘étiquette | Une étiquette unique, par ex. vip |
| B2B customer | Elite | Le visiteur connecté utilise un compte B2B | Interrupteur marche/arrêt |
Comment les conditions se combinent
Toutes les conditions activées doivent toutes correspondre pour que le menu/élément s’‘affiche — une seule condition non remplie le masque immédiatement. Les conditions vides sont ignorées et ne comptent pas.
Par exemple, activer à la fois Device = Mobile only et Schedule = 01/09–15/09 : affiche uniquement aux visiteurs sur téléphones mobiles, et uniquement pendant ces 2 semaines exactes.
Une seule condition activée qui échoue (branche droite ✗) masque immédiatement le menu/élément — indépendamment du fait que d’‘autres conditions réussissent. Les conditions vides (non activées) sont ignorées et omises.
5 exemples concrets
1. Gros et détail à la fois, masquer les prix de gros aux clients au détail (niveau menu)
Votre boutique vend à la fois en gros et au détail. Les clients de gros (avec un compte B2B approuvé par Shopify) achètent à de meilleurs prix et ont leur propre groupe produit/collection. Vous voulez un groupe de menu “Prix de gros”, “Commandes de gros rapides”, “Produits en gros” — affichage uniquement aux clients de gros, tandis que les visiteurs au détail ne voient aucun tel menu (éviter la confusion des prix et masquer les remises).
Comment faire : Construisez un menu séparé (ou groupe de menu) contenant des liens de gros. Allez à Setting → Visibility Rules, activez B2B customer. Résultat : ce menu entier s’‘affiche uniquement pour les visiteurs connectés avec des comptes B2B ; les clients au détail (même s’‘ils sont connectés) ne verront pas ce menu en naviguant.
2. Banner de promotion à durée limitée, affichage uniquement pendant l’‘achat (niveau élément)
Vous voulez un banner « Livraison gratuite à partir de 50€ » s’‘affichant uniquement pendant la vente, et uniquement pour les clients qui ont ajouté au moins un produit à leur panier (éviter de distraire les nouveaux visitants à l’‘arrivée).
Comment faire : Sur l’‘élément banner, cliquez sur Setup the Visibility rules → activez Cart contents = 1, et Schedule = dates de début/fin de vente.
3. Lien d’‘offre exclusif pour les clients VIP (niveau élément)
Vous voulez un élément de menu “Offres VIP” visible uniquement pour les clients marqués VIP, tandis que les clients réguliers ne savent même pas qu’‘il existe.
Comment faire : Marquez le groupe de clients VIP via Shopify Flow/Customer Segment (Segment → Flow “Customer enters segment” → appliquer l’‘étiquette). Sur l’‘élément, cliquez sur Setup the Visibility rules → activez Customer tag = vip.
4. Tab Bar Premium pour les clients VIP (niveau menu)
Votre boutique souhaite que les clients VIP aient une expérience de navigation différente — fond sombre, effets brillants, sensation premium — au lieu de partager l’‘interface standard avec tout le monde.
Comment faire : Construisez une Tab Bar séparée avec un modèle sombre premium, publiez-la à la même position de Tab Bar que votre boutique utilise par défaut. Allez à Setting → Visibility Rules, activez Customer tag = vip (marquer via Shopify Flow/Customer Segment comme dans l’‘exemple 3). Résultat : les clients marqués VIP voient la Tab Bar premium ; les clients réguliers voient toujours votre Tab Bar standard. (Mobile Menu utilise la même approche.)
5. FAB incite à la vente additionnelle juste quand le client ajoute le premier article (niveau menu)
Le client vient d’‘ajouter son premier produit au panier — le moment décisif — et vous voulez qu’‘un bouton flottant (FAB) avec des infos de promotion s’‘affiche (“achetez plus pour débloquer la livraison gratuite”, cadeau gratuit…) pour le pousser plus vite vers le paiement, au lieu que le FAB soit toujours affiché et désordonne la vue dès le départ.
Comment faire : Construisez un FAB (Floating Button) avec du contenu promotionnel. Allez à Setting → Visibility Rules, activez Cart contents = 1 (affichage uniquement quand le panier a 1+ produits). Résultat : le FAB reste masqué jusqu’‘à ce qu’‘un client ajoute le premier produit à son panier. Note : la condition vérifie uniquement le NOMBRE de produits dans le panier, pas la valeur de la commande — “50€+ débloque la livraison gratuite” est le texte marketing que vous écrivez dans le FAB lui-même, pas une Visibility Rule qui calcule selon le prix.