Modifier la taille du badge

Utilisez la section Size de l’éditeur de badge pour redimensionner un badge partout ou définir une taille différente pour chaque appareil et type de page.

Ouvrir la section Size

1. Ouvrir Badges & Labels

   Dans l’admin Shopify, ouvrez Sami Product Labels > Badges & Labels.

2. Sélectionner un badge

   Trouvez le badge que vous voulez redimensionner, puis cliquez sur Edit badge/label dans sa ligne.

   Pour redimensionner plutôt un nouveau badge, cliquez sur Create badge et choisissez Text badge ou Image badge.

3. Développer Size

   Dans l’éditeur de badge, restez sur l’onglet Design, faites défiler jusqu’à Size et développez la section.

   

   Ouvrez un badge, restez sur Design et développez Size.

Utiliser une seule taille sur ordinateur et sur mobile

Sous Responsive size, laissez Use same size on desktop and mobile sélectionné lorsque le badge doit utiliser un seul jeu de dimensions sur tous les appareils et tous les aperçus de pages pris en charge.

• Pour un badge texte, définissez Width et Height séparément.
• Pour un badge image avec Lock aspect ratio activé, utilisez le curseur Size ou le champ Width. La hauteur change automatiquement pour préserver les proportions de l’image.

Utilisez un seul jeu de dimensions pour l’ordinateur et le mobile.

Personnaliser chaque appareil et chaque type de page

Sélectionnez Customize desktop and mobile separately lorsque le badge nécessite des dimensions différentes selon le contexte.

1. Choisissez Desktop ou Mobile.
2. Choisissez Product page size ou Listing pages size.
3. Définissez les dimensions pour cette combinaison.
4. Répétez l’opération pour les autres combinaisons d’appareil et de page selon vos besoins.

Sélection	Où la taille s’applique
Desktop > Product page size	Pages produit sur ordinateur
Desktop > Listing pages size	Pages de liste, y compris les pages de collection, sur ordinateur
Mobile > Product page size	Pages produit sur mobile
Mobile > Listing pages size	Pages de liste, y compris les pages de collection, sur mobile

Note

L’éditeur utilise le libellé Listing pages size. Utilisez cet onglet pour les aperçus de pages de collection et d’autres listes de produits.

Sélectionnez un appareil et un type de page, puis définissez la taille pour cette combinaison.

Choisir une unité de taille

Chaque dimension peut utiliser l’une de ces unités :

Unité	À utiliser quand
px	Vous avez besoin d’une dimension exacte en pixels.
%	Vous voulez que le badge s’adapte proportionnellement à la zone d’image du produit disponible. Prévisualisez le résultat sur chaque type de page et chaque appareil.

Pour un badge texte, Width et Height ont chacun leur propre sélecteur d’unité. Elles ne doivent pas nécessairement utiliser la même unité.

Ajuster la taille d’un badge texte

Les badges texte offrent des commandes supplémentaires sous Width et Height :

• Auto-fit text to badge désactivé : définissez Text size comme une taille de police fixe en pixels.
• Auto-fit text to badge activé : l’application redimensionne automatiquement le texte pour qu’il tienne dans l’arrière-plan du badge, et Text size devient une commande en pourcentage.
• Letter spacing : augmentez ou réduisez l’espace entre les caractères en pixels.

Note

Activez Auto-fit text to badge lorsque la longueur du texte du badge peut changer, par exemple un texte contenant {inventory} ou une autre variable dynamique.

Activez Auto-fit text to badge pour que le texte changeant reste dans l’arrière-plan du badge.

Conserver ou modifier les proportions d’un badge image

Pour les badges image, Lock aspect ratio est activé par défaut.

• Laissez-le activé pour redimensionner l’image avec une seule commande Size ou Width tout en préservant les proportions d’origine.
• Désactivez-le uniquement si vous devez définir Width et Height indépendamment. Les modifier vers un rapport différent peut étirer ou écraser l’image.

Laissez Lock aspect ratio activé pour redimensionner un badge image sans le déformer.

Prévisualiser et enregistrer

Utilisez la barre d’outils d’aperçu pour basculer entre Product page et Collection page, puis vérifiez Desktop view et Mobile view. Lorsque le badge s’affiche correctement dans tous les aperçus nécessaires, cliquez sur Save.

Attention

Si vous utilisez des tailles adaptatives distinctes, prévisualisez les quatre combinaisons d’appareil et de page avant d’enregistrer.

Étapes suivantes

• Modifier la position du badge : placez votre badge au bon endroit sur les images de produits ou les éléments de la page.
• Modifier le style du badge : personnalisez les polices, les couleurs, les bordures et les effets visuels.

Astuce

Besoin d’aide ?

Si vous rencontrez des difficultés en suivant ces étapes, contactez-nous à [email protected].