Skip to main content

​
Aperçu

Le module d’en-tête vous permet de personnaliser la section supérieure de votre tiroir Upcart avec le logo de votre marque, le texte du titre, la mise en page, la couleur d’arrière-plan et le bouton de fermeture. Des contrôles visuels facilitent la mise en forme de votre en-tête sans avoir à définir des tailles exactes en pixels.

​
Paramètres du module d’en-tête

​
Général

Vous pouvez choisir entre les hauteurs d’en-tête Slim et Tall pour contrôler l’espace vertical. Une fine bordure inférieure peut être ajoutée ou désactivée selon vos besoins. La couleur d’arrière-plan peut être définie à l’aide d’un code hexadécimal ou du sélecteur de couleurs intégré.

​
Titre

Il existe trois façons de définir le titre de l’en-tête de votre tiroir de panier : hériter du style de titre par défaut de votre thème, afficher le logo de votre boutique, ou créer des styles de texte entièrement personnalisés. Chaque méthode offre de la flexibilité selon vos besoins de design.

​
Hériter des titres du thème

Cette option utilise les styles de titre par défaut de votre thème, vous aidant à conserver un design visuellement cohérent avec le reste de votre site. Vous pouvez ajouter votre propre titre à l’aide du champ Text et inclure dynamiquement le nombre d’articles du panier avec {{cart_quantity}}. L’alignement du texte peut être défini sur Side ou Center, et vous pouvez sélectionner le niveau de titre approprié H2, H3 ou H4, en fonction de la structure de contenu de votre boutique. Si vous préférez utiliser un logo de marque à la place du texte, vous pouvez téléverser le logo de votre boutique directement dans cette section. Choisissez d’aligner le logo sur Side ou Center, et redimensionnez-le à l’aide du curseur de taille visuel. Bien qu’il n’y ait pas de limite de taille d’image imposée, l’utilisation d’un fichier PNG est recommandée pour une transparence propre et des bords nets. Les JPEG sont également pris en charge mais peuvent inclure du bruit d’arrière-plan ou dégrader les détails du logo. Pour les performances, veillez à garder des tailles de fichier optimisées.
  • Nous recommandons d’utiliser un fichier PNG pour une qualité optimale et la prise en charge des arrière-plans transparents.
  • Les JPEG fonctionnent aussi, mais peuvent ne pas être aussi nets, surtout si votre logo a un arrière-plan ou des détails fins.

​
Définir des styles de texte

Sélectionner l’option Text vous donne un contrôle total sur le style du titre, indépendamment du thème de votre boutique. Vous pouvez saisir n’importe quel titre personnalisé et inclure {{cart_quantity}} pour des mises à jour dynamiques. L’alignement du texte peut être défini sur Side ou Center, avec des options pour changer la graisse de la police en Normal, Semibold ou Bold. La taille de police est réglable de 14 px à 48 px à l’aide d’un curseur visuel, et vous pouvez éventuellement appliquer un remplacement de couleur de texte.

​
Bouton de fermeture

Le bouton de fermeture est personnalisable pour correspondre au design de votre boutique. Vous pouvez le positionner à gauche ou à droite du tiroir. Définissez les états d’arrière-plan et de survol avec des couleurs personnalisées, ajustez la taille de l’icône (Small, Medium ou Large) et choisissez entre une épaisseur de trait d’icône Normal ou Thick. La couleur de l’icône peut être définie via un code hexadécimal ou le sélecteur de couleurs. Vous pouvez également ajouter une bordure autour de l’icône, en choisissant parmi None, Thin, Normal ou Thick, et définir une couleur de bordure de survol distincte si nécessaire.
  • Vous souhaitez un espacement ou un dimensionnement précis ? Utilisez le CSS personnalisé pour un contrôle total au-delà des curseurs, idéal pour des marges, des espacements internes ou une mise à l’échelle du logo exacts.
  • Testez sur ordinateur et mobile. Les éléments d’en-tête comme le texte, le logo et les boutons peuvent s’afficher différemment selon les tailles d’écran
  • Utilisez les bons niveaux de titre. Choisir le bon titre (H2, H3, H4) contribue à l’accessibilité et au SEO. Respectez la structure du contenu de votre boutique.
Pour plus de façons de personnaliser votre panier, explorez notre documentation d’aide Upcart. Si vous avez besoin de modifications personnalisées, nous vous recommandons de contacter un Shopify Expert.