Toutes les collections
Créateur de sites web
Boutique en ligne
Créateur de sites Web : Comment changer la couleur du texte dans la boutique en ligne
Créateur de sites Web : Comment changer la couleur du texte dans la boutique en ligne

Découvrez comment changer la couleur du texte dans la boutique en ligne en utilisant le Créateur de sites Web Hostinger

Mis à jour il y a plus d’une semaine

Découvrez comment changer la couleur du texte dans les zones suivantes de votre boutique en ligne :

    • Couleur du Ruban

    • Couleur du Bouton "Ajouter au panier

    • Changez la Couleur du Titre du Produit Individuellement

    • Changez la Couleur de la Pagination Individuellement

    • Couleur de la Description du Produit

    • Couleur du Bouton "Ajouter au Panier"

    • Changez la Couleur du Titre du Produit Individuellement

    • Changez la Couleur du Sous-Titre du Produit Individuellement


Section Liste de Produits

Cliquez sur la section de la liste de produits, sélectionnez Modifier la section et modifiez la couleur du texte dans l'onglet Style :

La modification de la couleur du texte dans les paramètres de style aura une incidence sur le titre du produit, le prix et les boutons de pagination. S'il y a un prix de vente, le prix original sera toujours un peu plus clair.

Couleur du Ruban

Cliquez sur la section de la liste de produits, sélectionnez Modifier la section et modifiez la couleur du ruban dans l'onglet Rubans :

REMARQUE : Vous pouvez ajouter un ruban dans la zone de gestion des produits

Couleur du Bouton "Ajouter au panier

Cliquez sur la section de la liste de produits, sélectionnez Modifier la section et changez la couleur du bouton dans l'onglet Bouton Ajouter au panier :

Changez la Couleur du Titre du Produit Individuellement

Copiez le code ci-dessous, remplacez le code HEX par le code souhaité et collez-le dans le champ " Code Personnalisé " des paramètres d'intégration de votre site Web :

<style>
/*Product list: Product title*/
.product-list-item__title {
color: #FF0000 !important;
}
</style>

Changez la Couleur de la Pagination Individuellement

Copiez le code ci-dessous, remplacez le code HEX par le code souhaité et collez-le dans le champ " Code Personnalisé " des paramètres d'intégration de votre site Web :

<style>
/*Product list: Pagination color*/
.pagination__button{
color: #FF0000 !important;
}
/*Product list: Current page number color*/
.pagination__trigger--current{
color: #00FF00 !important;
}
/*Product list: Pagination hover color*/
.pagination__button:hover, .pagination__button:active{
color: #0000FF !important;
}
</style>

Section de Produit Unique et/ou Page de Produit

Cliquez sur la section de la liste de produits, sélectionnez Modifier la section, puis modifiez la couleur dans l'onglet Style :

  • Couleur du texte

  • Couleur des flèches sur les images des produits

  • Couleur des flèches dans la galerie de produits

  • Couleur de l'arrière-plan de la section (ou de l'image d'arrière-plan)

La modification de la couleur du texte dans les paramètres de style aura une incidence sur le titre, le sous-titre, le prix, les options et la description des produits. S'il y a un prix soldé, le prix original sera toujours plus clair.

Couleur de la Description du Produit

Dans la zone de gestion des produits, recherchez le champ de description et modifiez la couleur à l'aide des outils d'édition de texte :

Couleur du Bouton "Ajouter au Panier"

Cliquez sur la section de la liste de produits, sélectionnez Modifier la section et changez la couleur du bouton dans l'onglet Bouton :

Changez la Couleur du Titre du Produit Individuellement

Copiez le code ci-dessous, remplacez le code HEX par le code souhaité et collez-le dans le champ " Code Personnalisé " des paramètres d'intégration de votre site Web :

<style>
/*Single product: Product title*/
.block-product__title {
color: #FF0000 !important;
}
</style>

Changez la Couleur du Sous-Titre du Produit Individuellement

Copiez le code ci-dessous, remplacez le code HEX par le code souhaité et collez-le dans le champ " Code Personnalisé " des paramètres d'intégration de votre site Web :

<style>
/*Single product: Product title*/
.block-product__subtitle {
color: #FF0000 !important;
}
</style>

Avez-vous trouvé la réponse à votre question ?