Trouver le sélecteur CSS

Vous utilisez Shopify ? Cette page n’est peut-être pas nécessaire. Navi+ connaît déjà les bons sélecteurs pour 331 thèmes Shopify (hamburger, en-tête, logo, menu principal, icônes recherche et panier). Choisissez simplement votre thème à l’étape Publish — ou à l’étape « Where should this menu go? » lors de la création d’un menu — et les champs CSS Selector sont remplis automatiquement. Liste complète avec captures d’écran : naviplus.io/shopify-themes. Les étapes ci-dessous ne servent que pour les thèmes personnalisés ou non listés, ou les sites hors Shopify.

CSS Selector est un concept très intéressant en CSS — il définit quelle partie de votre site web peut être remplacée ou avoir un menu Navi+ inséré (soit avant soit après elle).

Voici quelques exemples de sélecteurs CSS que vous pouvez utiliser :

#header           /* The header area */
.navbar           /* The main navigation bar */
.footer           /* The footer section */
.main-content     /* The main content container */
.product-gallery  /* The product image section */
div#menu-wrapper  /* A specific div with ID “menu-wrapper” */
section.hero      /* The hero section at the top of the page */

Suivez les instructions ci-dessous pour trouver le sélecteur CSS correct sur votre site web.