Admin UI

Sélecteurs de thème

La section Sélecteurs de thème vous permet de contrôler la manière dont Cart Reserve détecte et interagit avec les éléments de votre thème. Particulièrement utile si vous utilisez un thème personnalisé, un thème fortement modifié ou une implémentation de panier tierce.

Dans la plupart des cas, les sélecteurs par défaut fonctionnent immédiatement et aucune modification n'est nécessaire. Ne modifiez ces paramètres que si les réservations ne se mettent pas à jour correctement ou si la structure de votre thème diffère des thèmes Shopify standard.

Accéder aux sélecteurs de thème

Allez dans ParamètresSélecteurs de thèmeConfigurer les sélecteurs.

Détection automatique du thème

Cart Reserve inclut une prise en charge intégrée pour plus de 30 thèmes Shopify. Le système détecte automatiquement votre thème et applique les sélecteurs appropriés.

La détection s'effectue dans le navigateur de votre client et essaie plusieurs signaux dans l'ordre :

  1. Sélection manuelle — le paramètre Theme adapter dans l'app embed (voir ci-dessous), si vous avez choisi explicitement un thème
  2. Identifiant Theme Store — les thèmes installés depuis le Shopify Theme Store sont reconnus instantanément, même s'ils ont été renommés
  3. Nom du thème — un nom contenant un thème pris en charge (par ex. « My Dawn Copy ») correspond à ce thème
  4. Structure de la page — pour les thèmes renommés ou téléchargés manuellement, Cart Reserve reconnaît le thème grâce à ses éléments de page distinctifs

Une fois un thème confirmé, le résultat est mémorisé dans le navigateur du visiteur afin que chaque page suivante se charge immédiatement avec la bonne intégration. Si vous changez de thème, la détection se relance automatiquement — aucune action de nettoyage n'est nécessaire.

Sélection manuelle du thème

Si votre thème est fortement personnalisé et que la détection automatique sélectionne l'intégration générique, vous pouvez choisir manuellement l'intégration du thème : Boutique en ligne → Thèmes → Personnaliser → App embeds → CartReserve → Theme adapter Choisissez votre thème de base dans la liste (Dawn, Horizon, Impact, Palo Alto, Turbo, Eurus, Focal, Wokiee) ou laissez-le sur Auto-detect (recommandé pour la plupart des boutiques).

Astuce : utilisez les outils de développement de votre navigateur (clic droit → Inspecter) pour trouver les sélecteurs CSS corrects pour les éléments de votre thème si nécessaire.

Cliquez sur Voir la documentation complète pour des conseils détaillés sur la configuration des sélecteurs.

Comment les modifications de paramètres atteignent votre storefront

La configuration du storefront (sélecteurs, style du minuteur, couleurs) est mise en cache dans le navigateur de chaque visiteur afin que les pages s'affichent instantanément sans attendre le réseau :

  • Les paramètres de sélecteurs s'appliquent immédiatement depuis le cache et sont vérifiés en arrière-plan auprès du serveur à chaque chargement de page — les modifications enregistrées parviennent aux visiteurs dès le prochain chargement de page
  • Le style du minuteur et les couleurs s'appliquent depuis le cache avant la fin du chargement de la page (sans « flash » de couleur), et se rafraîchissent en arrière-plan de la même manière

Après avoir enregistré des modifications dans l'administration, rafraîchissez votre storefront une fois pour les voir.

Sections de sélecteurs

Les sélecteurs de thème sont organisés en sections repliables. Chaque section affiche un compteur indiquant les sélecteurs personnalisés (par ex. « 0/2 personnalisés »).

Modèles storefront

Lien rapide pour personnaliser l'apparence des minuteurs, avertissements et états expirés.

Cliquez sur Personnaliser les modèles pour ouvrir l'éditeur de modèles storefront.

Modifications d'articles du panier

Sélecteurs pour détecter et gérer les changements de quantité dans le panier.

Configurez-les si Cart Reserve ne détecte pas les modifications de quantité dans le panier.

Champs : 2 sélecteurs disponibles

Détail du produit

Sélecteurs pour le formulaire produit et la fonctionnalité d'ajout au panier.

Configurez-les si les réservations ne sont pas créées lorsque les clients ajoutent des articles depuis les pages produit.

Champs : 6 sélecteurs disponibles

Contexte du minuteur

Paramètres pour l'affichage du minuteur et la détection du tiroir de panier.

Configurez-les si le minuteur n'apparaît pas au bon endroit ou si votre thème utilise un tiroir de panier non standard.

Champs : 3 sélecteurs disponibles

Sélecteurs universels

Sélecteurs CSS pour les contrôles de quantité qui fonctionnent dans le tiroir, la page panier et la page produit.

Utilisez-les pour les thèmes personnalisés non couverts par des préréglages spécifiques. Ces sélecteurs fonctionnent universellement dans différents contextes de panier.

Champs : 6 sélecteurs disponibles

Traductions des libellés

Les libellés des boutons et du minuteur sont configurés dans l'éditeur de thème et peuvent être traduits via l'application « Translate & Adapt » de Shopify.

Cliquez sur Ouvrir l'éditeur de thème pour accéder à la configuration des libellés.

Chemin : Boutique en ligne → Thèmes → Personnaliser → App embeds → CartReserve

Déplier les sections

Cliquez sur Déplier sur n'importe quelle section pour afficher et modifier les sélecteurs individuels.

Chaque champ de sélecteur accepte la syntaxe CSS standard (par ex. .cart-item, #product-form, [data-cart-drawer]).

Dépannage

Si Cart Reserve ne fonctionne pas correctement avec votre thème :

  1. Vérifiez la détection automatique — le système devrait gérer la plupart des thèmes automatiquement
  2. Inspectez les éléments — utilisez les outils de développement du navigateur pour identifier les sélecteurs corrects
  3. Testez progressivement — modifiez un sélecteur à la fois et testez
  4. Enregistrez et actualisez — les modifications nécessitent un rafraîchissement de la page pour prendre effet

Quand personnaliser les sélecteurs

Personnalisez les sélecteurs uniquement si vous rencontrez :

  • Des réservations qui ne se mettent pas à jour lors des changements de quantité
  • Un minuteur qui n'apparaît pas dans le tiroir ou la page panier
  • Des ajouts au panier qui ne déclenchent pas de réservations
  • Des contrôles de quantité non détectés

Pour les thèmes Shopify standard, les valeurs par défaut devraient fonctionner sans modification.