[Résolu] Modifier les smiley en stock &Rupture de stock (Créer un compte)

Bonjour,

Essayez déjà le code ci-dessous dans les CSS additionnelles:

.stock.in-stock::before {
	font-size:10px;
  content: "✔️" !important;
}
.stock.in-stock{
	font-size:0px;
}
.stock.in-stock::after {
	font-size:10px;
  content: "Disponible";
}

.stock.out-of-stock::before {
	font-size:10px;
  content: "❌" !important;
}
.stock.out-of-stock{
	font-size:0px;
}
.stock.out-of-stock::after {
	font-size:10px!important;
  content: "Non disponible";
}

Pour  » ⚠ plus qu’1 disponible « , il faudrait donner un exemple de produit dans ce cas pour voir si c’est faisable simplement.

C’est possible  (voir pj) mais assez compliqué. Si vous voulez essayer ça peut se faire.

Comme je vous le disais, c’est plus compliqué car il faut différencier à l’intérieur d’une même classe (.stock.in-stock) selon le texte qu’elle contient. Les CSS ne peuvent pas faire cette différence et c’est pour cela que votre message  est le même qu’il y ait plusieurs produits ou un seul en stock. Il faut donc utiliser un peu de jQuery en plus des CSS. J’avais oublié que vous l’aviez déjà fait (voir ICI) donc cela ne devrait pas poser de problème

Le code jQuery à ajouter sera:

<script>
$= jQuery; 
$(function() { 
  $('.stock.in-stock').each(function() {
     var text = $(this).text();
    switch (text) {
      case 'Plus que 1 en stock':
        className = 'reste-un';
        break;
     case 'En stock':
        className = 'disponible';  
    }
    $(this).addClass(className);
  });
});
</script>

Si vous êtes curieuse, le code est inspiré par CECI.

Et les CSS deviennent:

.disponible::before {
	font-size:10px;
  content: "✔️" !important;
}
.disponible{
	font-size:0px;
}
.disponible::after {
	font-size:10px;
  content: "Disponible";
}
.reste-un::before {
	font-size:10px;
  content: "⚠" !important ;
	color:orange
}
.reste-un{
	font-size:0px;
}
.reste-un::after {
	font-size:10px;
  content: "Plus qu'1 disponible";
	color:orange
}

.stock.out-of-stock::before {
	font-size:10px;
  content: "❌" !important;
}
.stock.out-of-stock{
	font-size:0px;
}
.stock.out-of-stock::after {
	font-size:10px!important;
  content: "Non disponible";
}

Si je n’ai pas fait d’erreur en recopiant les codes, ça devrait fonctionner.

• Cette réponse a été modifiée le il y a 2 semaines par ferman.
• Cette réponse a été modifiée le il y a 2 semaines par ferman.
• Cette réponse a été modifiée le il y a 2 semaines par ferman.

Ce n’est pas dans fonction.php mais dans le plugin « headers  and footers » qu’il faut placer le code jQuery;  comme l’autre fois  (voir  ICI.) Désolé, dans ma réponse précédente le lien n’avait pas été pris.

D’autre part, dans functions.php du thème enfant vous pouvez voir le message selon lequel vous ne devez pas ajouter de code dans ce fichier. C’est parce que le thème « boutique » n’est pas un thème enfant habituel: il est régulièrement mis à jour si bien que les modifications sont effacées à chaque fois.  Il faut obligatoirement utiliser une extension pour ajouter du code.

• Cette réponse a été modifiée le il y a 2 semaines par ferman.
• Cette réponse a été modifiée le il y a 2 semaines par ferman.

Vous avez bien mis les balises <script> </script>?  Pouvez-vous faire une copie d’écran de ce que vous avez mis dans la fenêtre « footer »? Je regarderai demain sur mon site.