Barre de fonctionnalités

Liens en vedette

1. Documentation Shopify sur les sections et les blocs
2. Documentation de Company XYZ sur les paramètres de couleurs
3. Documentation de Company XYZ sur le bloc Feature
4. Documentation Shopify sur la personnalisation des sections
5. Documentation de Company XYZ sur les paramètres d’espacement de section
6. Documentation de Company XYZ sur les paramètres d’arrière-plan de section
7. Documentation de Company XYZ sur les paramètres de séparateurs
8. Documentation de Company XYZ sur les paramètres de visibilité
9. Documentation de Company XYZ sur les paramètres de largeur de mise en page

Vidéos utiles

Vidéo Shopify Academy : Personnaliser votre boutique

Vidéo Shopify Academy : Personnaliser votre boutique

Utilisez cette section pour mettre en avant des messages courts à forte valeur ajoutée, comme des avantages d’expédition, des promesses d’assistance, des politiques de boutique ou des annonces ponctuelles. Elle peut suivre le comportement partagé du thème par défaut, ou vous pouvez ajouter des blocs Feature pour contrôler entièrement le contenu affiché ici.

Paramètres de base

Ces paramètres déterminent la disposition générale et la présentation de la barre avant que vous ne personnalisiez des éléments individuels.

1. Alignement du texte contrôle la façon dont le texte de fonctionnalité se place dans chaque élément. Faites-le correspondre aux sections proches pour conserver une apparence cohérente de la page.
2. Position de l’icône modifie la relation entre les icônes et le texte. À gauche ou à droite convient généralement aux mises en page horizontales compactes, tandis qu’en haut ou en bas fonctionne mieux lorsque chaque fonctionnalité a besoin d’une séparation visuelle plus marquée.
3. Afficher la bordure de l’icône ajoute une mise en avant supplémentaire autour des icônes. Cela peut aider les icônes simples à ressortir, mais cela peut paraître trop chargé si la section utilise déjà des séparateurs marqués ou un arrière-plan audacieux.

Si vous souhaitez que cette section affiche du contenu de fonctionnalité personnalisé, ajoutez au moins un bloc Feature. Une fois les blocs ajoutés, ils remplacent le comportement de contenu partagé par défaut pour cette section.

Pour des indications plus générales sur le fonctionnement des blocs dans l’éditeur, voir documentation Shopify sur les sections et les blocs

Paramètres de couleur

Ces paramètres remplacent les couleurs par défaut de cette section. Utilisez-les lorsque la barre de fonctionnalités a besoin d’un contraste plus fort, d’un accent de marque ou d’une priorité visuelle différente de celle de la mise en page environnante. En savoir plus dans documentation Company XYZ sur les paramètres de couleur.

Ajustez les couleurs de l’icône, du texte et de la bordure de l’icône ensemble afin que la section paraisse intentionnelle. Si vous utilisez un arrière-plan personnalisé, vérifiez soigneusement la lisibilité avant de publier.

Types de blocs pris en charge

1. Feature

Bloc Feature

Utilisez le bloc Feature pour ajouter une icône, un titre, un texte d’accompagnement facultatif et un lien facultatif. En savoir plus dans Caractéristique.

1. Icône peut être un emoji ou un nom d’icône. Laissez-le vide pour une présentation plus simple, centrée d’abord sur le texte.
2. Titre et sous-titre donnent de meilleurs résultats lorsqu’ils restent courts. Un texte bref aide plusieurs fonctionnalités à rester équilibrées sur une même ligne.
3. Lien est utile pour des destinations associées comme des politiques, des FAQ ou des collections. Ajoutez des liens uniquement lorsque la destination correspond clairement au message.
4. Visibilité du bloc vous permet de masquer des fonctionnalités individuelles sur ordinateur ou sur mobile, ce qui est utile lorsqu’une version mobile plus courte est plus lisible.

Note

Cette section prend en charge jusqu’à 4 blocs Feature, alors concentrez-vous sur les messages que les clients doivent remarquer en premier.

Pour les détails de configuration de l’éditeur, voir documentation Shopify sur la personnalisation des sections

Paramètres standard de section

Paramètres d’espacement

Paramètres d’espacement contrôlent l’espace au-dessus et en dessous de la barre de fonctionnalités. Un espacement plus réduit convient bien aux messages de type utilitaire, tandis qu’un espacement plus grand donne à la section l’impression d’être une zone de contenu autonome. Des valeurs distinctes pour ordinateur et mobile sont utiles lorsque la barre paraît à l’étroit sur les petits écrans.

Paramètres d’arrière-plan de section

Paramètres d’arrière-plan de section vous permettent d’ajouter une couleur, un dégradé, une image ou une vidéo derrière la barre de fonctionnalités. C’est utile lorsque la section a besoin d’une séparation visuelle plus marquée ou d’un aspect plus promotionnel. Les paramètres d’overlay aident à préserver la lisibilité, et les overlays en dégradé sont prioritaires sur les couleurs d’overlay unies.

Attention

Les arrière-plans d’image et de vidéo peuvent réduire rapidement la clarté du texte dans une petite section comme celle-ci. Vérifiez les vues ordinateur et mobile pour vous assurer que le texte reste facile à lire.

Paramètres de séparateur

Paramètres de séparateur ajoutent une ligne en haut ou en bas de la section. Utilisez-les lorsque la barre se situe entre de plus grandes sections et a besoin d’une limite subtile sans ajouter plus d’espace. Si la couleur du séparateur est laissée transparente, la couleur de bordure partagée est utilisée.

Paramètres de visibilité

Paramètres de visibilité contrôlent si la section entière apparaît sur ordinateur, sur mobile ou sur les deux. C’est utile lorsque vous souhaitez une mise en page mobile simplifiée ou une disposition différente selon l’appareil. Lorsque vous utilisez aussi la visibilité au niveau du bloc, vérifiez bien qu’au moins une fonctionnalité reste visible là où vous en avez besoin.

Paramètres de largeur

Paramètres de largeur contrôlent à la fois la largeur maximale du contenu et la largeur extérieure de la section. Des largeurs de contenu plus étroites peuvent rendre le court texte de fonctionnalité plus facile à parcourir, tandis que des paramètres plus larges peuvent aider la barre à s’intégrer davantage dans des mises en page de page étendues. Prévisualisez les changements de largeur sur la page en direct lorsque c’est possible, car l’encadrement de l’éditeur peut donner une impression trompeuse de l’espacement.

Notes d’utilisation

1. Gardez un texte bref. Cette section fonctionne mieux avec de courtes affirmations que les clients peuvent comprendre en un coup d’œil.
   1. Les messages courts sont plus faciles à parcourir dans une barre étroite.
   2. Si un message nécessite plus de contexte, liez vers la destination complète au lieu d’ajouter davantage de texte.
2. Utilisez les blocs de manière intentionnelle. Ajoutez des blocs Feature lorsque cette barre doit afficher des icônes, du texte ou des liens spécifiques à la section au lieu du comportement de contenu partagé.
   1. L’ajout de blocs peut modifier de façon importante ce qui s’affiche ici.
   2. Passez en revue la section après avoir ajouté ou supprimé des blocs pour confirmer que le message final reste équilibré.
3. Vérifiez les deux tailles de zone d’affichage. Les contrôles pour ordinateur et mobile peuvent affecter différemment la disposition, l’alignement, la visibilité et le comportement des médias.
   1. Vérifiez que les icônes et le texte restent bien alignés sur les petits écrans.
   2. Assurez-vous que les choix réservés au mobile ou à l’ordinateur laissent toujours la barre lisible et utile.
4. Utilisez les remplacements de couleur et de média avec prudence. Les valeurs de style par défaut préservent généralement le style de repli, tandis que des couleurs, dégradés ou choix de média explicites rendent la section plus indépendante.
   1. Un style local marqué peut renforcer la mise en avant, mais il augmente aussi la nécessité de vérifier le contraste.
   2. Des médias distincts pour ordinateur et mobile peuvent affecter le recadrage et la lisibilité, alors confirmez les deux versions avant de publier.
5. Gardez les messages de type formulaire faciles à lire. Si la barre est utilisée pour la saisie client, la validation ou des messages de succès et d’erreur, laissez suffisamment de contraste et d’espacement pour que ces états ressortent clairement.