Jump to content

Changer la couleur "disponibilité" fiche produit


Recommended Posts

bonsoir, voila j'essaye de changer la couleur du message affiché sur la fiche produit correspondant a la disponibilité de l'article.

voir photo. Je ne souhaite pas changer la couleur des autres champs.
merci pour votre aide.

Meme avec firebug pour m'aider je n'y arrive pas...
je débute !

27236_qMAZm91vEuCD4En9cmuC_t

Link to comment
Share on other sites

Bonjour,

1. Ouvrez votre fichier global.css(/themes/votre_theme/css/)

2. Recherchez l'endroit où se trouve ces lignes

#primary_block form#buy_block span#availability_label{...}



3. Après ces dernières, ajoutez:

#primary_block form#buy_block span#availability_value{color:#hex_couleur;}

Link to comment
Share on other sites

Merci !

et si on veux mettre le texte de couleur vert quand c'est dispo et rouge quand c'est en rupture? parce que la en fait ça reste tout le temps de la meme couleur peu importe l'état de la disponibilté.

Alex

Link to comment
Share on other sites

Rebonjour,

Couleur lorsque le produit est disponible:

#primary_block form#buy_block span#availability_value{
color:#hex_couleur;
}


Couleur lorsque le produit est en rupture:
#primary_block form#buy_block p#availability_status span.warning-inline{
color:#hex_couleur;
}


Ça devrait fonctionner,
Bonne journée
Link to comment
Share on other sites

Rebonjour,

Couleur lorsque le produit est disponible:
#primary_block form#buy_block span#availability_value{
color:#hex_couleur;
}


Couleur lorsque le produit est en rupture:
#primary_block form#buy_block p#availability_status span.warning-inline{
color:#hex_couleur;
}


Ça devrait fonctionner,
Bonne journée


re!

je ne trouve pas la ligne "warning" dans le global.css alors j'ai tenté de la rajouter = sans succès.
Link to comment
Share on other sites

Bonjour,

Je viens d'apercevoir que j'ai fais une erreur de frappe dans le deuxième bloc; où le texte doit être rouge.

p#availability_status deviens p#availability_statut


Ça devrait marcher si vous avez le thème par défaut. Si ça ne marche toujours pas, pouvez vous m'indiquer à l'aide de firebug les attributs de la balise entourant le texte lorsque le produit est en rupture de stock? De cette façon, nous pourrons lui attribuer un style.
Link to comment
Share on other sites

Bonjour,

Je viens d'apercevoir que j'ai fais une erreur de frappe dans le deuxième bloc; où le texte doit être rouge.

p#availability_status deviens p#availability_statut


Ça devrait marcher si vous avez le thème par défaut. Si ça ne marche toujours pas, pouvez vous m'indiquer à l'aide de firebug les attributs de la balise entourant le texte lorsque le produit est en rupture de stock? De cette façon, nous pourrons lui attribuer un style.


je ne trouve pas la deuxieme ligne dans le global css.... voici la balise pour le produit en rupture: En rupture de stock

Merci pour votre aide, je suis un newbie dans presta !!
Link to comment
Share on other sites

  • 2 years later...

Bonjour,

 

J'essaie de modifier le "background" de la disponibilité produit afin que celui-ci n'apparaisse pas en rouge lorsque le produit est en stock comme c'est le cas sur le thème de base de la version 1.5.2.

 

J'ai donc modifié mon fichier product.css comme ceci :

 

/*changement de couleur lorsque le produit est en stock*/
#availability_statut span#availability_value {
   display:inline-block;
   padding:1px 5px;
   font-weight:bold;
   font-size:10px;
   color:#fff;
   text-transform:uppercase;
   background:#009999 /*ancienne couleur : #9b0000 */
}
/*ajout de code pour changer la couleur lorsque le produit est hors stock*/
#availability_statut span.warning-inline{
   background:#9b0000
}

 

Avec cette modif, la couleur change bien mais pour les deux statuts : "hors stock" et "en stock".

Je n'arrive donc pas à avoir une couleur différente pour les produits "hors stock".

 

Est-ce que quelqu'un pourrait me dire ce qui ne va pas dans ma deuxième partie de code ?

 

Merci d'avance

Link to comment
Share on other sites

  • 4 weeks later...
  • 1 year later...
  • 3 weeks later...

Salut à tous, voila une solution plutôt simple mais radicale, en tout cas sa marche pour moi :) (PS 1.5.6.2)

 

Ouvrir le fichier  " product.css "  (de votre thème)

 

ajouter ces ligne à la fin du css :

/* PERSONNALISATION Couleur BG disponibilité en stock */
    #availability_value {
    background: green !important;
}
 
#availability_value.warning_inline {
    background: red !important;
}
Edited by Tigger (see edit history)
Link to comment
Share on other sites

Bonsoir en ce qui me concerne j'ai trouvé, j'ai une version 1.5.3

 

voici avec votre FTP

themes/default/css/product.css (recherchez la ligne #availability_statut #availability_value.warning_inline {

Nous avons paramétré la valeur « 000000 » pour le background.

 

Enregistrer ce fichier sur votre bureau, puis ouvrez le avec Dream ou un logicile de language HTML et modifié votre couleur.

Puis enregistré et avec le FTP vous le remettez en place sur votre serveur.

 

Voila

 

Bonsoir

Link to comment
Share on other sites

  • 11 months later...
  • 1 year later...

Bonjour,

 

ma boutique est version 1.6.1.1 et j'ai pas mal de clients qui me disent être surpris que les produits soient en réapprovisionnement après commande alors qu'il le voient en stock.

 

Je voudrais clarifier cela pour eux.

Pour les produits en stock le message est : En stock (fond vert OK)

J'affiche bien un message différent si le produit n'est pas en stock mais commande possible : "disponible sous X jours" (fond vert actuellement).

 

Je voudrais configurer 3 couleurs sur la fiche produit.

  • Vert : en stock
  • Orange : non en stock mais commande acceptée
  • Rouge : rupture (non en stock et commande refusée)

Au niveau du panier, je voudrais aussi que l'info de disponibilité apparaissent clairement avant commande avec le message avec fond de couleur vert ou orange suivant le cas

 

Merci d'avance.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...