Icône avec texte

Liens en vedette

1. Documentation Shopify sur les sections et les blocs
2. Documentation Company XYZ sur les paramètres de couleur
3. Documentation Company XYZ sur les paramètres de visibilité

Vidéos utiles

Vidéo de Shopify Academy : personnaliser votre boutique

Vidéo de Shopify Academy : personnaliser votre boutique

Utilisez ce bloc pour mettre en avant une caractéristique, un avantage ou un signal de confiance unique avec une petite icône et une courte ligne de texte. Il fonctionne particulièrement bien pour des messages rapides et faciles à parcourir, comme des avantages liés à l’expédition, des bénéfices produit, des garanties ou des détails sur les matériaux.

Pour plus de contexte sur la façon dont ce type de contenu s’intègre dans un thème, consultez la documentation Shopify sur les sections et les blocs

Paramètres de base

Commencez par l’icône et le texte. Vous pouvez utiliser soit un emoji, soit un nom d’icône, ce qui facilite l’harmonisation avec le style du reste de votre contenu. Si vous laissez l’icône vide, le bloc affiche uniquement du texte.

Gardez le texte court et précis. Les phrases courtes fonctionnent généralement mieux que les phrases complètes, surtout lorsque vous voulez que les acheteurs comprennent le message d’un coup d’œil.

Vous pouvez également ajouter un lien si le point fort doit mener vers plus de détails, comme une politique, un guide ou une page d’appui. Ouvrir ce lien dans un nouvel onglet peut être utile lorsque vous ne voulez pas que les acheteurs perdent leur place.

Astuce

Si vous utilisez plusieurs de ces blocs ensemble, gardez la formulation et le style de l’icône cohérents afin que l’ensemble reste propre et intentionnel.

Paramètres d’alignement

Ces paramètres contrôlent l’alignement horizontal séparément pour l’ordinateur et le mobile. Ils sont utiles lorsque le bloc apparaît dans différentes mises en page selon la taille de l’écran ou lorsque vous peaufinez une mise en page mobile personnalisée.

Choisissez l’alignement en fonction du contenu environnant. L’alignement centré convient aux points forts autonomes, tandis que l’alignement à gauche paraît généralement plus naturel dans les mises en page empilées ou les zones riches en texte.

Vérifiez l’alignement sur ordinateur et sur mobile. Une position qui paraît équilibrée sur un grand écran peut sembler maladroite sur des écrans plus petits.

Paramètres standard de bloc

Paramètres de couleur

Ces paramètres permettent à ce bloc de remplacer les couleurs générales du thème pour l’icône et le texte. Utilisez-les lorsque le point fort doit être davantage mis en avant ou lorsque vous avez besoin d’un meilleur contraste dans une mise en page précise.

Évitez d’utiliser trop de couleurs de mise en avant différentes sur une même page. Une utilisation cohérente des couleurs rend les arguments de vente plus faciles à parcourir et évite de donner une impression de surcharge au design. Pour en savoir plus sur le comportement partagé des couleurs, consultez les Paramètres de couleur.

Assurez-vous que l’icône et le texte restent faciles à lire sur l’arrière-plan.

Paramètres de visibilité

Utilisez les contrôles de visibilité pour afficher ou masquer ce bloc sur ordinateur ou sur mobile. C’est utile lorsque vous souhaitez afficher des contenus d’appui différents selon la taille de l’appareil ou lorsqu’un court point fort convient mieux à une mise en page qu’à une autre.

Utilisez le masquage avec parcimonie. Cela fonctionne mieux pour des choix de mise en page intentionnels, et non comme substitut à un contenu plus concis. Pour en savoir plus sur le comportement partagé de la visibilité, consultez les Paramètres de visibilité.

Notes d’utilisation

1. Gardez un texte concis. Utilisez une phrase courte axée sur l’avantage afin que le message reste rapide à parcourir.
2. Choisissez des icônes claires. Sélectionnez des icônes qui renforcent immédiatement le texte au lieu d’ajouter une décoration sans signification.
3. Ajoutez un lien avec un objectif. N’ajoutez un lien que lorsque les acheteurs ont réellement besoin de plus de détails sur le point fort.
4. Vérifiez les deux tailles d’écran. Contrôlez l’alignement et l’espacement sur ordinateur et sur mobile avant de publier.
5. Utilisez l’emphase avec parcimonie. Réservez les couleurs personnalisées aux points forts qui méritent une attention supplémentaire.
6. Laissez les valeurs par défaut agir lorsque c’est possible. Ne définissez pas les choix de couleur et de style lorsque vous voulez que le bloc hérite du design environnant, et n’utilisez des remplacements que lorsque le point fort doit se distinguer.