Comment masquer ou désactiver le bouton Ajouter au panier de WooCommerce

WooCommerce est une plate-forme de commerce électronique populaire qui permet aux entreprises de créer et de gérer facilement des boutiques en ligne. Alors, qu’est-ce que WooCommerce exactement ? c’est un plugin polyvalent pour WordPress qui vous permet de vendre une variété de produits en ligne, y compris des articles physiques et des téléchargements numériques. Une fonctionnalité clé de WooCommerce est le bouton « Ajouter au panier », qui permet aux clients d’ajouter des produits à leur panier pour passer à la caisse.

Bien qu’il soit essentiel pour la plupart des magasins en ligne, il existe des situations où les propriétaires d’entreprise peuvent préférer masquer ou désactiver ce bouton. Cela peut être utile pour faire passer votre boutique en mode catalogue, proposer des prix personnalisés ou transformer une liste de produits en un affichage de demande uniquement.

Dans ce guide, nous vous guiderons tout au long du processus de masquage ou de désactivation du bouton Ajouter au panier de WooCommerce. Nous aborderons également les différentes méthodes de mise en œuvre de cette fonctionnalité et les avantages de chacune, en vous aidant à personnaliser votre boutique pour l’aligner sur vos besoins et objectifs commerciaux spécifiques.

Pourquoi vous voudrez peut-être masquer ou désactiver le bouton d’ajout au panier de WooCommerce

Avant de pouvoir masquer ou désactiver le bouton d’ajout au panier de WooCommerce, il est important de savoir d’abord comment ajouter et configurer WooCommerce sur WordPress. Une fois le plugin installé et configuré, vous pouvez personnaliser le design et les fonctionnalités de votre boutique. Cela inclut la possibilité de supprimer le bouton « Ajouter au panier ».

Masquer ou désactiver le bouton « Ajouter au panier » de WooCommerce peut servir plusieurs objectifs stratégiques. La suppression du bouton pour les articles en rupture de stock empêche les clients de tenter d’acheter des produits indisponibles. Cela réduit la confusion et garantit une expérience d’achat plus fluide. Masquer le bouton en mode catalogue transforme la page de la boutique en une vitrine de produits sans achats directs.

Pour les magasins proposant des prix exclusifs ou variables, la suppression du bouton permet aux entreprises de garder les détails privés, encourageant les clients enregistrés à demander des devis. Cette approche est particulièrement efficace pour les produits coûteux ou personnalisés qui nécessitent une communication plus personnalisée. En incitant les clients à les contacter, les entreprises peuvent fournir des informations personnalisées et renforcer leurs relations avec les clients.

La désactivation du bouton sur les produits en rupture de stock ou personnalisables permet de gérer efficacement les stocks. Cela empêche les clients d’essayer d’acheter des articles indisponibles.

Comprendre la différence entre masquer et supprimer

Dans WooCommerce, masquer et supprimer complètement le bouton « Ajouter au panier » sont deux actions différentes. Chaque méthode a un impact unique sur la fonctionnalité et les performances de votre site Web.

Lorsque vous masquez le bouton « Ajouter au panier », il reste dans le code HTML de la page mais est rendu invisible pour les utilisateurs. Cela se fait généralement via CSS ou JavaScript, où les commandes de style rendent le bouton caché. Masquer le bouton est parfait pour les situations temporaires, comme lorsque les produits sont en rupture de stock. Il vous permet de tester différentes configurations sans modifier le code sous-jacent.

Étant donné que le code du bouton est toujours chargé, cette méthode n’affecte généralement pas de manière significative la vitesse de chargement de la page. Cependant, cela signifie que les utilisateurs ayant des connaissances techniques spécifiques pourraient toujours accéder au bouton dans le HTML, bien qu’il ne soit pas visible ou accessible au visiteur typique.

La suppression complète du bouton « Ajouter au panier » implique de le supprimer du code de la page, ce qui peut être fait à l’aide de code PHP personnalisé ou d’un plugin. Cette approche fournit une solution plus propre et plus efficace en supprimant complètement le code du bouton. L’élimination du bouton peut légèrement améliorer les temps de chargement et créer une expérience utilisateur plus rationalisée. C’est une bonne option lorsque vous êtes certain que le bouton n’est pas nécessaire sur des pages de produits spécifiques. Par exemple, il fonctionne bien sur les sites de catalogue uniquement ou pour les produits disponibles uniquement sur demande. Cette méthode garantit une expérience de navigation plus simple et plus ciblée pour les utilisateurs.

En fin de compte, le masquage est une solution rapide et réversible, tandis que la suppression offre un changement plus permanent avec des avantages en termes de performances. Votre choix dépend des besoins de votre site web, de l’expérience utilisateur souhaitée et de l’importance de l’efficacité du site.

Différentes méthodes pour masquer ou désactiver le bouton d’ajout au panier de WooCommerce

Il existe plusieurs méthodes efficaces pour masquer ou désactiver le bouton « Ajouter au panier » dans votre boutique WooCommerce, chacune offrant différents niveaux de personnalisation et nécessitant divers degrés de compétence technique. Que vous recherchiez une solution rapide et sans code à l’aide de plug-ins ou que vous préfériez plus de contrôle avec du code personnalisé, vous avez des options pour répondre aux besoins de votre entreprise. Ci-dessous, nous allons explorer trois méthodes populaires qui vont de l’utilisation des paramètres et des plugins WooCommerce à l’ajout de code personnalisé ou de CSS.

Choisissez la méthode qui correspond le mieux aux exigences de votre magasin et à son niveau de confort technique.

Méthode 1 : Utilisation des paramètres et des plugins WooCommerce

Le moyen le plus simple de masquer le bouton « Ajouter au panier » est d’utiliser un plugin WooCommerce. Cette méthode ne nécessite aucun codage et offre la possibilité de masquer le bouton de manière globale ou sur des produits spécifiques.

Escalier:

1. Installer un plugin : Allez dans Plugins > Add New dans votre tableau de bord WordPress. Recherchez des plugins tels que « WooCommerce Catalog Mode » ou « YITH WooCommerce Catalog Mode ». Cliquez sur Installer et activer.

2. Configurer les paramètres du plugin : Après l’activation, allez dans les paramètres WooCommerce>. Trouvez l’onglet des paramètres du plugin et ajustez les options pour masquer le bouton « Ajouter au panier » ou activer le mode catalogue.

3. Enregistrer et tester : enregistrez vos modifications et rendez-vous dans votre boutique pour confirmer que le bouton est masqué.

Méthode 2 : Code personnalisé dans functions.php fichier

Si vous préférez plus de contrôle sur votre boutique WooCommerce et que vous souhaitez désactiver le bouton « Ajouter au panier » à un niveau plus profond, l’ajout de code personnalisé à votre fichier functions.php est une solution fiable. Cette approche supprime entièrement la fonctionnalité du bouton, garantissant que les clients ne peuvent pas ajouter de produits à leur panier.

Voici un guide étape par étape pour ajouter du code personnalisé en toute sécurité :

Étape 1 : Accéder au fichier functions.php

1. Connectez-vous à votre tableau de bord WordPress.

2. Allez dans l’éditeur de thème d’apparence>.

3. Sur le côté droit, localisez et cliquez sur le fichier functions.php (généralement répertorié comme Fonctions de thème).

Remarque : Si vous ne voyez pas l’option Éditeur de thème, vous pouvez également accéder au fichier functions.php via FTP ou le gestionnaire de fichiers de votre panneau de configuration d’hébergement.

Étape 2 : Ajouter le code personnalisé

Copiez et collez le code suivant à la fin de votre fichier functions.php :

Désactiver le bouton « Ajouter au panier » sur les pages de produits

remove_action(woocommerce_single_product_summary, woocommerce_template_single_add_to_cart, 30) ;

Désactiver le bouton « Ajouter au panier » sur les pages d’archives (comme les pages de catégorie ou de boutique)

remove_action(woocommerce_after_shop_loop_item, woocommerce_template_loop_add_to_cart, 10) ;

Explication du Code :

• La première ligne supprime le bouton « Ajouter au panier » des pages de produits individuelles.

• La deuxième ligne supprime le bouton des pages de liste de produits, telles que les pages de boutique ou de catégorie.

Étape 3 : Enregistrez les modifications

1. Après avoir ajouté le code, cliquez sur Mettre à jour le fichier.

2. Videz le cache de votre site (et le cache de votre navigateur, si nécessaire) pour vous assurer que les modifications prennent effet.

Étape 4 : Testez votre site

Rendez-vous dans votre boutique et vérifiez que le bouton « Ajouter au panier » n’est plus visible sur les pages de produits ou les listes de catégories.

En utilisant du code personnalisé dans le fichier functions.php, vous obtenez un contrôle total sur les fonctionnalités de votre boutique, en vous assurant que le bouton n’est pas seulement masqué, mais entièrement désactivé, empêchant ainsi les clients d’ajouter des articles à leur panier.

Méthode 3 : Utiliser CSS pour masquer le bouton

Si vous cherchez un moyen rapide et non invasif de masquer le bouton « Ajouter au panier » sur votre boutique WooCommerce, l’utilisation de CSS peut être une solution simple. Cette méthode est idéale si vous souhaitez une modification temporaire sans modifier les fichiers de base de votre boutique ou utiliser des plugins. Voici comment vous pouvez procéder :

1. Accédez au personnalisateur :

Allez sur votre tableau de bord WordPress et accédez à Personnaliser l’apparence>. À partir de là, sélectionnez CSS supplémentaire. C’est là que vous pouvez ajouter en toute sécurité des styles personnalisés sans affecter le code d’origine de votre thème.

2. Ajoutez le code CSS :

Copiez et collez l’extrait de code CSS suivant dans la section CSS supplémentaire :

.add_to_cart_button, .single_add_to_cart_button {

affichage : aucun !important ;

} 

Ce code cible à la fois le bouton « Ajouter au panier » sur les listes de produits (.add_to_cart_button) et la page unique du produit (.single_add_to_cart_button). L’affichage : aucun !important ; masque ces boutons à la vue de l’utilisateur.

3. Enregistrer et publier :

Après avoir ajouté le code, cliquez sur Publier pour appliquer les modifications. Le bouton « Ajouter au panier » devrait maintenant être masqué sur votre site.

Bien que CSS soit rapide, cette méthode ne masque le bouton que visuellement. Les clients peuvent toujours y accéder dans certains cas, ce qui le rend mieux adapté aux besoins temporaires.

Meilleurs plugins pour masquer ou désactiver le bouton d’ajout au panier de WooCommerce

Il existe de nombreux plugins disponibles qui aident les propriétaires de boutiques WooCommerce à masquer ou à désactiver facilement le bouton « Ajouter au panier ». Ces plugins offrent flexibilité et personnalisation pour répondre aux divers besoins de l’entreprise. Vous pouvez convertir votre boutique en catalogue, gérer les demandes de produits de grande valeur ou restreindre la visibilité des prix pour les articles exclusifs.

Voici un aperçu de certains des meilleurs plugins pour masquer ou désactiver le bouton « Ajouter au panier ».

Mode catalogue WooCommerce

Le mode catalogue WooCommerce est un plugin polyvalent conçu pour transformer votre boutique WooCommerce en catalogue en masquant le bouton « Ajouter au panier ». Ce plugin vous permet de présenter vos produits sans l’option d’achat direct, idéal pour les entreprises axées sur les demandes ou pour les articles qui ne sont pas encore disponibles à la vente. Il offre des options de personnalisation supplémentaires, telles que le masquage des prix ou l’affichage d’appels à l’action alternatifs, ce qui le rend très adaptable aux divers besoins du magasin. Avec ses paramètres conviviaux, il convient aux utilisateurs de tous niveaux techniques.

Mode catalogue YITH WooCommerce

Le mode catalogue YITH WooCommerce est connu pour sa flexibilité, permettant aux propriétaires de magasins de basculer facilement entre les modes catalogue et eCommerce complet. Ce plugin vous permet de masquer le bouton « Ajouter au panier » et l’affichage des prix, ce qui le rend idéal pour les catalogues en gros, les articles saisonniers ou les produits restreints. Avec ce plugin, vous pouvez appliquer de manière sélective le mode catalogue à des rôles d’utilisateur spécifiques, ce qui en fait une excellente option pour les entreprises avec différents segments d’utilisateurs. Il s’intègre également bien avec d’autres plugins YITH, élargissant ses fonctionnalités pour des besoins plus avancés.

Supprimer Ajouter au panier WooCommerce

WooCommerce est une solution simple pour masquer le bouton « Ajouter au panier » sur votre site WooCommerce. Ce plugin est idéal pour ceux qui recherchent un moyen simple et efficace de supprimer le bouton sans personnalisation supplémentaire ni paramètres complexes. Il est particulièrement utile pour les petites entreprises ou les magasins sur catalogue uniquement qui ont besoin d’une solution rapide pour désactiver les options d’achat. Sa simplicité en fait un choix léger, minimisant l’impact sur les performances du site.

Demande de produit WooCommerce Pro

WooCommerce Product Enquiry Pro est conçu pour les entreprises qui préfèrent les demandes de renseignements aux achats directs. Ce plugin masque le bouton « Ajouter au panier » et le remplace par un formulaire de demande, permettant aux clients de vous contacter directement au sujet des produits. Il est parfait pour les articles de grande valeur, personnalisables ou en rupture de stock, car il encourage les clients à s’engager avec votre entreprise pour plus de détails. Grâce à des formulaires personnalisables et à des notifications par e-mail, il rationalise le processus de demande et aide à convertir les visiteurs intéressés en prospects.

Masquer le prix et ajouter au panier Bouton Plugin

Le plugin Hide Price and Add to Cart Button offre une solution puissante aux entreprises qui souhaitent masquer à la fois le bouton « Ajouter au panier » et les prix des produits. Ce plugin est très utile pour les produits exclusifs ou réservés aux membres où les informations sur les prix sont limitées. Vous pouvez le configurer pour qu’il affiche un message personnalisé ou un formulaire de demande à la place, incitant les clients à vous contacter pour plus de détails. Il s’agit d’une solution flexible qui vous permet d’ajuster les paramètres par catégorie de produit ou par rôle d’utilisateur, ce qui la rend adaptée aux scénarios de vente au détail et de gros.

Ces plugins offrent des solutions efficaces pour masquer ou désactiver le bouton « Ajouter au panier », vous permettant de personnaliser votre boutique WooCommerce pour mieux répondre aux besoins de votre entreprise. Le choix du bon dépendra de vos objectifs, qu’il s’agisse de créer un catalogue, de gérer les demandes ou de limiter les options d’achat.

Dépannage des problèmes courants

Lorsque vous masquez ou désactivez le bouton « Ajouter au panier » dans WooCommerce, certains problèmes courants peuvent survenir, affectant la mise en page et les fonctionnalités de votre boutique. Voici comment les résoudre efficacement.

Mises en page cassées après le masquage/la désactivation du bouton

Masquer ou supprimer le bouton « Ajouter au panier » peut parfois perturber la mise en page de votre boutique, surtout si le thème repose sur l’emplacement du bouton. Cela peut entraîner le décalage ou le chevauchement d’éléments de page, ce qui entraîne une mauvaise expérience utilisateur.

Miracle:

Pour résoudre les problèmes de mise en page, inspectez la mise en page et utilisez un CSS personnalisé pour ajuster le positionnement et l’espacement des éléments concernés. De plus, vérifiez si votre thème est compatible avec WooCommerce et prend en charge les ajustements de mise en page pour les boutons cachés ; Si ce n’est pas le cas, il peut être utile de passer à un thème plus compatible. L’utilisation d’un plugin WooCommerce bien pris en charge à cet effet peut également réduire les perturbations de mise en page, car ces plugins sont généralement optimisés pour les thèmes populaires.

Conflits avec d’autres plugins

Certains plugins peuvent entrer en conflit lorsque vous masquez ou désactivez le bouton « Ajouter au panier », ce qui entraîne des problèmes de fonctionnalité ou un comportement imprévisible sur votre site.

Miracle:

Pour identifier les plugins en conflit, désactivez-les un par un jusqu’à ce que vous identifiiez le problème. Une fois identifiés, assurez-vous que tous les plugins sont mis à jour, car les versions obsolètes sont une source courante de problèmes de compatibilité. Si le problème persiste, consultez l’équipe d’assistance du plugin en conflit, car elle peut avoir des paramètres spécifiques ou des conseils pour activer la compatibilité avec votre configuration actuelle.

Le bouton Ajouter au panier apparaît toujours sur certaines pages

Même après avoir appliqué des paramètres ou du code pour masquer le bouton, il peut toujours s’afficher sur des pages spécifiques, telles que des catégories ou des listes de produits en vedette.

Miracle:

Commencez par examiner les paramètres du plug-in ou le code que vous avez utilisé pour confirmer que la fonctionnalité de masquage s’applique à toutes les pages prévues. Dans les cas où certaines pages affichent toujours le bouton, vous pouvez appliquer un CSS spécifique à la page en ciblant uniquement ces zones. Il est également important de vider le cache de votre site, car les pages mises en cache peuvent toujours afficher des versions obsolètes de la page, ce qui entraîne des incohérences d’affichage.

Le code personnalisé ne fonctionne pas comme prévu

Si du code personnalisé dans le fichier functions.php ou un plugin d’extrait de code est utilisé pour masquer le bouton, il peut ne pas fonctionner en raison d’erreurs de syntaxe, d’une incompatibilité de thème ou de conflits de plugins.

Miracle:

Commencez par vérifier que votre code ne contient pas d’erreurs de syntaxe ou d’éléments manquants, car de petites erreurs peuvent empêcher le code de s’exécuter correctement. Envisagez d’utiliser un plugin d’extrait de code au lieu de functions.php modifier directement, car il fournit un environnement plus sûr pour isoler et dépanner le code. Tester votre code sur un thème par défaut de WooCommerce, comme Storefront, peut également aider à confirmer si la compatibilité avec votre thème est un problème.

Tester sur un site de staging avant de mettre en ligne

Apporter des modifications directement sur un site en ligne peut affecter l’expérience utilisateur en cas de problème, il est donc recommandé de tester au préalable sur un site de test.

Miracle:

Pour créer un environnement de staging, vous pouvez utiliser les outils proposés par votre fournisseur d’hébergement ou un plugin tel que WP Staging. Testez les modifications de masquage ou de désactivation des boutons sur ce site de test pour identifier les conflits, les mises en page cassées ou d’autres problèmes. À partir de là, examinez le site du point de vue de l’utilisateur pour vous assurer que tout s’affiche et fonctionne comme prévu avant d’apporter des modifications à votre boutique en direct.

Conclusion

Dans ce guide, nous vous avons expliqué comment masquer, supprimer ou désactiver le bouton Ajouter au panier de WooCommerce, ce qui vous permet de mieux contrôler les fonctionnalités de votre boutique. Vous pouvez choisir de masquer entièrement le bouton ou de le désactiver pour des produits spécifiques, en fonction de vos besoins. Ces options permettent une meilleure gestion des catalogues et une expérience client plus fluide. L’ajustement de cette fonctionnalité permet d’adapter votre boutique pour répondre à divers objectifs commerciaux.

Ces stratégies vous permettent également de permettre la gestion des stocks, d’optimiser les stocks de produits et de gérer efficacement les produits en rupture de stock. De plus, en utilisant un thème enfant, vous pouvez effectuer ces modifications sans affecter les mises à jour de votre thème principal.

Maintenant que vous avez ces techniques à votre disposition, il est temps de les mettre en pratique. La personnalisation de la façon dont les clients interagissent avec votre boutique peut avoir un impact significatif sur votre stratégie de vente. Explorez vos paramètres WooCommerce, expérimentez ces options et faites passer votre boutique au niveau supérieur avec les solutions d’hébergement fiables de Bluehost.

Prêt à optimiser votre boutique WooCommerce ? Commencez dès aujourd’hui avec Bluehost et profitez d’une intégration transparente, d’un support expert et des outils dont vous avez besoin pour réussir. Commencez dès maintenant !

Foire aux questions