Skip to main content
Le bloc Header est la zone supérieure épinglée du tiroir de panier, donnant au tiroir un titre clair et un moyen évident de le fermer. Vous contrôlez sa mise en page en attribuant Title, Logo et Close button aux sections gauche et droite. Comme le Header est épinglé en haut, il reste visible pendant que le reste du panier défile.
Bloc Header avec le titre du panier, le nombre d'articles et le contrôle de fermeture en haut du tiroir

Comportement

  • Le Header est épinglé en haut du tiroir et ne défile pas avec le corps du panier.
  • Le contrôle de fermeture est toujours disponible et ferme le tiroir.

Paramètres

Le titre est traduisible. Si votre titre se résout en une valeur vide (par exemple, une traduction non définie), le panier affiche par défaut Cart afin que l’en-tête ne soit jamais vide. Les éléments apparaissent dans l’ordre dans lequel vous les sélectionnez, de gauche à droite, et chaque élément ne peut être attribué qu’à une seule section à la fois.

Placement et limites

  • Région : haut uniquement.
  • Maximum : 1 par état de panier.
  • État : panier rempli et vide (chaque état a sa propre instance de Header).
  • Ajouté aux nouveaux paniers par défaut dans les deux états. Non verrouillé, vous pouvez donc le supprimer ou le masquer avec l’interrupteur en forme d’œil.

Modèle personnalisé

Prend en charge un modèle personnalisé depuis son onglet Code, qui remplace le balisage intégré de ce bloc par votre JSX. Voici les props qu’il reçoit.
logoUrl est la seule prop sans équivalent intégré : l’image téléversée du Header n’est jamais rendue que par un modèle personnalisé. Si un marchand a défini un logo et qu’il ne s’affiche pas, c’est la raison.
Si vous ne connectez pas onClose à quelque chose, les acheteurs pourront toujours fermer le tiroir en cliquant sur l’overlay ou en appuyant sur Échap, mais votre en-tête n’aura pas de bouton de fermeture. Incluez-en toujours un.

Design

Stylisez ce bloc avec sa section Design dans le panneau de paramètres. Il s’agit de surcharges par bloc qui se superposent à votre design global et y reviennent lorsqu’elles sont vides.

Text

La section Text dans Design vous permet de contrôler la typographie du titre du panier. Le gras et la couleur du texte se règlent dans l’éditeur de texte enrichi ci-dessus (dans l’onglet Settings), pas ici. Que sont les paramètres de design ? Apprenez-en plus ici : Paramètres de design.