Faire tenir un mot sur 1 seule ligne fiche produit

Store Design
, ,

Topic summary

Problème central: sur la fiche produit en version mobile, le mot « Rechargeable » sous la 3e icône passe sur deux lignes. L’auteur souhaite qu’il tienne sur une seule ligne.

Solution proposée: ajouter un style CSS mobile dans le fichier theme.liquid.

  • Chemin: Boutique en ligne > Modifier le code > theme.liquid.
  • Emplacement: insérer le bloc avant la balise .
  • Code: @media screen and (max-width: 767px) { span.h4.inline-richtext { font-size: 12px !important; } }

Résultat: l’auteur confirme que, après ajout du code à la fin de theme.liquid, l’affichage fonctionne correctement sur mobile.

Éléments visuels: des captures d’écran ont été partagées pour illustrer le rendu.

Statut: problème résolu. Aucune autre action requise, avec proposition d’assistance supplémentaire si besoin.

Summarized with AI on November 25. AI used: gpt-5.
1

Bonjour,
Sur la fiche produit de mon site, il y a 3 petites icônes et chacune à un texte en dessous, sauf que sur la dernière le mot “Rechargeable” est sur 2 lignes sur la version mobile, et j’aimerai faire en sorte que le mot ne tienne que sur une seule ligne.
Voici une capture d’écran.

Capture
Capture1172×796 74 KB

**
**
Auriez-vous une solution ?

Merci !
Bipperly,

1 Like
2

Bonjour @Bipperly

Suivez ces étapes :

  1. Accédez à la boutique en ligne
  2. Modifiez le code
  3. Trouvez le fichier theme.liquid
  4. Ajoutez le code suivant à la fin du fichier, avant la balise 
<style>
@media screen and (max-width: 767px) {
span.h4.inline-richtext {
    font-size: 12px !important;
}
}
</style>

RÉSULTAT:

image
image368×661 21.4 KB

Si vous avez besoin d’aide supplémentaire, n’hésitez pas à me contacter. Si mon message vous a été utile, un « J’aime » serait vraiment apprécié.

Cordialement,
Moeed

3

Merci beaucoup pour votre aide ! j’ai ajouté le code à la toute fin du code theme.liquid et ca a l’air de bien fonctionner maintenant !

1 Like
4

Merci pour votre réponse. Je suis ravi que la solution ait fonctionné pour vous. Si vous avez besoin d’aide supplémentaire, n’hésitez pas à me contacter. Si vous avez trouvé ces informations utiles, un « J’aime » serait très apprécié.

1 Like