Saviez-vous que le fait d’ajouter la catégorie produit aux classes CSS dans la balise body dans WooCommerce s’avère intéressant ? C’est justement ce que nous allons vous expliquer dans les lignes suivantes. Après lecture de ce billet, vous saurez parfaitement utiliser un remarquable snippet qui vous permettra de réaliser cette tâche.
À Quoi Cela Sert-il d’Ajouter la Catégorie Produit Aux Classes CSS de la Balise Body Dans WooCommerce ?
Vous n’êtes certainement pas sans savoir que la balise HTML <body></body> consiste en la balise qui comprend la majeure partie des codes HTML de votre page. En effet, le développeur rassemble dans celle-ci les données nécessaires pour pouvoir afficher le contenu à vos visiteurs.
Ici, le but de ce snippet est d’entrer dans la balise <body> afin d’y intégrer une classe CSS différente dédiée à chaque catégorie de produit. À vrai dire, cette manœuvre va vous permettre de réaliser de nombreux changements sur votre magasin en ligne WooCommerce.
Entre autres, vous aurez la possibilité de modifier la couleur des textes. De même, vous pourrez changer la police et la couleur de fond de la page. De manière générale, vous serez capable de customiser entièrement votre boutique en ligne.
Quel Snippet Dois-je Employer ?
Pour exécuter cette formidable astuce, il vous faut copier-coller le code suivant dans le fichier « functions.php » de votre thème enfant :
/* Ajouter la catégorie produit aux class CSS de la balise body */ add_filter( 'body_class', 'wpm_wc_product_cats_css_body_class' ); function wpm_wc_product_cats_css_body_class( $classes ){ // On récupère les catégorie de produits if( is_singular( 'product' ) ) { $custom_terms = get_the_terms(0, 'product_cat'); if ($custom_terms) { // On boucle sur les catégories de produits foreach ($custom_terms as $custom_term) { //On ajoute une classe par catégorie de produits de la forme product_cat_catégorieproduit $classes[] = 'product_cat_' . $custom_term->slug; } } } return $classes; }
Pour avoir la garantie que votre manipulation a bien fonctionné, choisissez une ou deux catégories d’un produit de votre site. Ensuite, vérifiez si elles apparaissent bien dans la balise <body> de votre page en cliquant droit sur votre page, puis en cliquant sur « Inspecter » (il est conseiller d’utiliser Google Chrome).
Qu’Allah vous préserve !