ℹ️ Note: Cet article a été traduit automatiquement en utilisant l'IA et peut contenir des inexactitudes. Si quelque chose ne va pas, veuillez contacter notre équipe de soutien.

Le sélectionneur de fentes devrait se sentir comme une partie naturelle de votre magasin — et la couleur est le moyen le plus rapide de faire que cela arrive 🎨

Avec Couleurs de l'application Widget paramètres dans Hoppy Delivery Dates, vous pouvez faire correspondre les boutons, les points forts et le texte du sélectionneur à votre thème — séparément pour Bureau et Mobile.

📌 Avant de commencer

• Hoppy Delivery Dates est installé et l'intégration de l'application est activée dans votre thème
• Le sélectionneur de fentes est visible sur votre page de panier
• Vous êtes connecté à votre Shopify administrateur

Étape 1 — Ouvrir la page d'apparence

Dans la navigation de l'application, allez à:

Hoppy Delivery Dates → Apparence

Trouvez la Couleurs de l'application Widget carte.

La carte a Bureau et Mobile onglets — les couleurs sont configurées séparément pour chaque appareil.

Étape 2 — Comprendre les quatre paramètres de couleur

Il y a quatre couleurs à travailler avec:

• Couleur primaire → la couleur de l'accent principal. Utilisé pour des choses comme les états sélectionnés, les boutons et la barre supérieure du sélecteur
• Couleur secondaire → la couleur de fond utilisée derrière les éléments de sélection
• Couleur de la police primaire → la couleur du texte utilisée sur les fonds secondaires/légers
• Couleur de la police secondaire → la couleur de texte utilisée sur les fonds primaires/accent

Couleurs par défaut

• Couleur primaire → #3D3D3D (gris foncé)
• Couleur secondaire → #ffffff (blanc)
• Couleur de la police primaire → #3D3D3D
• Couleur de police secondaire → #ffffff

Étape 3 — Définissez vos couleurs

Chaque couleur a deux façons de la définir:

• Saisissez un code hexagonal directement dans le champ de texte (p. ex. #1a73e8)
• Ou cliquez sur montre couleur à côté du champ pour ouvrir le sélectionneur de couleurs et choisir visuellement 🌈

Les deux restent synchronisés: choisir à partir du swatch met à jour le champ hex, et taper un hex met à jour le swatch.

Exemple

• Couleur primaire → #2c6ecb (le bouton bleu de votre thème)
• Couleur secondaire → #ffffff
• Couleur de la police primaire → #212121
• Couleur de police secondaire → #ffffff

💡 La meilleure façon d'obtenir une correspondance parfaite : copiez le code hexagonal de la couleur du bouton de votre thème Boutique en ligne → Thèmes → Personnaliser → Paramètres des thèmes → Couleurs.

Étape 4 — Répéter pour mobile (facultatif)

Passez au Mobile onglet et définir des couleurs là aussi si vous voulez un look différent sur des écrans plus petits. Sinon, configurez les deux onglets avec les mêmes valeurs pour une apparence cohérente.

Étape 5 — Enregistrer et revoir

Cliquez sur Enregistrer en haut de la page.

Utilisez le panneau de prévisualisation sur le côté droit de la page Apparence pour une vérification rapide, puis ouvrez votre page Panier pour voir les couleurs live 👀

⚠️ Remarques importantes

⚠️ Assurez-vous que vos couleurs de police contrastent bien avec leurs arrière-plans — un texte léger sur un arrière-plan léger sera difficile à lire pour les clients.

ℹ️ Les couleurs bureau et mobile sont indépendantes — n'oubliez pas de vérifier les deux onglets après l'enregistrement.

🎉 Résultat final

Une fois configuré avec succès :

✅ La machine à sous correspond aux couleurs de votre thème ✅ Boutons, points forts et texte utilisent tous votre palette choisie ✅ Bureau et Mobile chaque look exactement comme vous voulez ✨

Mis à jour le : 10/09/2026