Comment masquer et supprimer facilement les champs de paiement WooCommerce (plugins et PHP)

Publié: 2019-10-14

Le paiement est l'une des étapes les plus importantes de toute boutique de commerce électronique. Si vous voulez réussir et augmenter vos ventes, vous devez rester maigre. C'est pourquoi nous allons vous montrer aujourd'hui comment masquer et supprimer les champs de paiement WooCommerce .

Il y a quelques jours, nous vous donnions quelques conseils pour optimiser votre site. Cependant, la dernière étape de l'entonnoir de vente est cruciale pour conclure la vente et nécessite donc une attention particulière.

Pourquoi désactiver les champs de paiement WooCommerce ?

Saviez-vous que plus de 75 % des utilisateurs ajoutent un produit au panier mais quittent ensuite le site Web sans rien acheter ? L'une des principales raisons de l'abandon du panier est que le paiement est trop long ou compliqué .

Pour éviter cela, la page de paiement doit être simple et ne comporter que les champs nécessaires. Ceci est particulièrement important si vous vendez des produits numériques ou virtuels tels que des logiciels, de la musique, des livres électroniques, etc. Comme ce type de produit n'a pas besoin d'être expédié, ils doivent avoir une page de paiement spécifique où vous ne demandez pas de détails tels que l'adresse ou le code postal par exemple.

Pour en savoir plus sur la façon d'améliorer le paiement des produits numériques, vous pouvez consulter cet article. Ainsi, pour augmenter les conversions, vous devez masquer les champs qui ajoutent simplement des distractions et des frictions à la page de paiement.

Voyons comment supprimer les champs de paiement dans WooCommerce et accélérer le processus de paiement.

Comment supprimer les champs de paiement dans WooCommerce ?

Comme il n'est pas possible de supprimer les champs de paiement par défaut de WooCommerce du tableau de bord WordPress, dans ce tutoriel, nous allons vous montrer comment masquer et supprimer les champs de paiement de deux manières différentes :

  1. Utilisation d'un plug-in
  2. Avec un script PHP

L'utilisation d'un plugin est le moyen le plus simple si vous n'êtes pas développeur. Le script PHP, d'autre part, vous permet de masquer tous les champs de paiement existants et de personnaliser votre boutique WooCommerce avec un peu de codage. Il n'y a pas de méthode meilleure ou pire. Vous obtiendrez le même résultat avec les deux, donc en fonction de vos compétences, vous pourrez choisir celui qui vous convient le mieux.

1) Supprimer les champs de paiement WooCommerce à l'aide d'un plugin

Il existe de nombreux outils pour désactiver et masquer les champs sur la page de paiement. Ici, nous allons vous montrer comment le faire en utilisant deux plugins gratuits :

  1. Gestionnaire de paiement WooCommerce
  2. Paiement direct pour WooCommerce

Ces outils fonctionnent de manière similaire mais présentent quelques différences. Examinons de plus près comment ces plugins peuvent vous aider à supprimer certains champs de paiement.

1.1 – Supprimer les champs de paiement avec WooCommerce Checkout Manager

WooCommerce Checkout Manager est l'un des meilleurs outils pour supprimer les champs de paiement. Ce plugin freemium a une version gratuite et 3 plans premium qui commencent à 19 USD (paiement unique).

Pour désactiver l'un des champs de paiement WooCommerce, suivez simplement ces étapes :

    1. Installez et activez WooCommerce Checkout Manager. Vous pouvez soit aller dans Plugins > Ajouter un nouveau et rechercher « WooCommerce Checkout Manager » ou le télécharger gratuitement à partir de ce lien. L'outil a une version pro avec des fonctionnalités plus avancées mais pour cette tâche, la version gratuite suffit.
    2. Accédez à l'onglet WooCommerce dans votre tableau de bord WordPress
    3. Cliquez sur Paiement puis sur l'onglet Facturation .
    4. Vous verrez une liste de tous les champs que vous pouvez masquer, alors activez simplement l'option de désactivation sur le champ que vous souhaitez supprimer.
    5. Après cela, vous pouvez accéder aux onglets Expédition et Supplémentaire et désactiver les champs que vous souhaitez supprimer.
    6. Après avoir masqué tous les champs que vous ne voulez pas sur la page de paiement WooCommerce, n'oubliez pas d'enregistrer les modifications et c'est tout !

Court et doux, n'est-ce pas ? Outre la suppression de champs, ce plugin vous permet également d'ajouter de nouveaux champs, de rendre les champs facultatifs ou obligatoires, de modifier l'ordre dans lequel vous affichez les champs, d'appliquer une logique conditionnelle, et bien plus encore. Donc, si vous voulez un outil pour personnaliser le paiement, WooCommerce Checkout Manager est une excellente option.

1.2 – Supprimer les champs de paiement avec Direct Checkout pour WooCommerce

WooCommerce Direct Checkout est un excellent plugin conçu pour simplifier à la fois le processus de paiement et la page de paiement. Cet outil vise à accélérer le paiement pour offrir aux utilisateurs une meilleure expérience d'achat. Contrairement à WooCommerce Checkout Manager qui vous permet à la fois d'activer et de désactiver les champs, Direct Checkout vous aide à supprimer les champs inutiles et à augmenter les taux de conversion .

Ceci est un outil freemium. Il a une version gratuite avec des fonctionnalités de base et 3 plans premium qui commencent à 19 USD (paiement unique). Pour supprimer des champs de la page de paiement WooCommerce avec Direct Checkout, vous devez :

  1. Installez et activez WooCommerce Direct Checkout. Dans votre tableau de bord WP, ​​vous pouvez accéder à Plugins > Ajouter un nouveau et rechercher « WooCommerce Direct Checkout » ou le télécharger gratuitement à partir de ce lien.
  2. Accédez à l'onglet WooCommerce dans votre tableau de bord WordPress.
  3. Appuyez sur Paiement direct , puis accédez à l'onglet Paiement .
  4. Ici, vous verrez une liste de tous les champs que vous pouvez supprimer, tels que le pays, l'état, les commentaires de commande, le texte de la politique, les colonnes, etc. À partir de l'onglet Général , vous pouvez également diriger les utilisateurs de la page du produit directement vers la caisse à partir de l'option Ajouter au panier rediriger vers .
  5. Une fois que vous avez supprimé les champs que vous ne voulez pas sur la page de paiement, enregistrez simplement les modifications.

En conclusion, si vous voulez une solution simple et rapide, ces deux plugins sont un excellent choix. Ils vous permettent de supprimer les champs de paiement WooCommerce en quelques clics et d'optimiser votre boutique.

En plus d'être très faciles à utiliser, ces outils ont d'excellentes performances et sont deux des meilleurs plugins de paiement pour WooCommerce. Le principal inconvénient de cette méthode est que lorsque vous installez un plugin, vous modifiez le code de votre site Web. Cela augmente sa complexité et les chances de casser quelque chose. Par conséquent, un script personnalisé peut être une bonne méthode si vous êtes à l'aise avec l'écriture de quelques lignes de code.

2) Supprimer les champs de paiement WooCommerce avec le script PHP

NOTE : Avant de commencer, nous vous recommandons de créer un thème enfant. De cette façon, au lieu de personnaliser les fichiers du thème parent, vous modifierez le thème enfant afin que vos personnalisations ne soient pas remplacées lorsque vous mettez à jour le thème parent. Si vous ne souhaitez pas créer de thème enfant, vous pouvez générer une sauvegarde complète de votre site en cas de problème.

Dans cette section, nous montrerons comment vous pouvez supprimer les champs de paiement de la caisse WooCommerce en codant votre propre solution. Si vous avez consulté notre didacticiel sur la modification des champs de paiement, vous serez familiarisé avec les crochets WooCommerce. Dans ce cas, nous utiliserons le crochet woocommerce_checkout_fields et nous l'appellerons quadlayers_remove_checkout_fields comme suit :

 add_filter( 'woocommerce_checkout_fields' , 'quadlayers_remove_checkout_fields' );

Il s'agit d'un type de hook de filtre, ce qui signifie qu'il doit renvoyer quelque chose lorsque vous l'exécutez. Et que va-t-il revenir ? Les données avec les champs que vous souhaitez supprimer.

Supprimer le nom de famille

Par exemple, si vous souhaitez supprimer le champ du nom de famille, vous pouvez utiliser ce qui suit :

 unset($fields['billing']['billing_last_name']);

Après cela, vous devez l'insérer dans une fonction portant le même nom que vous avez utilisé dans le crochet de filtre à la première étape ( quadlayers_remove_checkout_fields ):

 function quadlayers_remove_checkout_fields( $fields ) {

unset($fields['billing']['billing_last_name']); 

renvoie $champs ; 

}

Enfin, insérez le script complet pour supprimer le nom du champ WooCommerce dans le fichier functions.php d'un thème enfant comme indiqué ci-dessous :

 add_filter( 'woocommerce_checkout_fields' , 'quadlayers_remove_checkout_fields' ); 

function quadlayers_remove_checkout_fields( $fields ) { 

unset($fields['billing']['billing_last_name']); 

renvoie $champs ; 

}

Supprimer tous les autres champs

Ainsi, si vous souhaitez supprimer un autre champ, vous devez ajouter la ligne correspondante. Vous trouverez ci-dessous les noms de champs disponibles que vous pouvez supprimer :

 unset($fields['billing']['billing_first_name']);
unset($fields['billing']['billing_last_name']);
unset($fields['billing']['billing_company']);
unset($fields['billing']['billing_address_1']);
unset($fields['billing']['billing_address_2']);
unset($fields['billing']['billing_city']);
unset($fields['billing']['billing_postcode']);
unset($fields['billing']['billing_country']);
unset($fields['billing']['billing_state']);
unset($fields['billing']['billing_phone']);
unset($fields['order']['order_comments']);
unset($fields['billing']['billing_email']);
unset($fields['account']['account_username']);
unset($fields['account']['account_password']);
unset($fields['account']['account_password-2']);

Comment afficher les champs de paiement que vous avez précédemment supprimés ?

Que pouvez-vous faire si vous avez supprimé certains champs de paiement que vous souhaitez afficher à nouveau ? Supprimez simplement la ligne de code qui masque le champ spécifique que vous souhaitez afficher. Par exemple, si vous avez désactivé le champ code postal de la section facturation et que vous souhaitez maintenant le rajouter, vous devez supprimer la ligne suivante du fichier functions.php de votre thème enfant :

 unset($fields['billing']['billing_postcode']);

De même, si vous souhaitez afficher plusieurs champs en même temps, vous pouvez supprimer plusieurs lignes à la fois.

Bonus : Comment supprimer l'onglet Informations supplémentaires dans WooCommerce ?

L'onglet Informations supplémentaires est fourni par défaut dans WooCommerce. Comme cet onglet n'est affiché que lorsque le produit a un poids, des dimensions ou des attributs, il n'est parfois pas très utile. Il existe deux manières de désactiver l'onglet Informations supplémentaires :

  1. Via PHP : Edition du fichier functions.php .
  2. Via CSS : Modification du fichier style.css .

En termes de performances, la méthode PHP est meilleure car elle empêche le chargement de l'onglet (au lieu de le charger puis de le masquer). Nous allons donc ici vous montrer comment supprimer l'onglet Informations supplémentaires avec un script PHP .

NOTE : Pour éviter de perdre vos personnalisations lors de la mise à jour de votre thème, nous vous recommandons d'appliquer ces modifications à votre thème enfant.

  1. Accédez à votre FTP et ouvrez le dossier wp-content . Ensuite, allez dans le thème et ouvrez votre dossier child_theme .
  2. Là, ouvrez le fichier functions.php .
  3. Allez tout en bas et insérez le code suivant :
 add_filter( 'woocommerce_product_tabs' , 'quadlayers_remove_product_tabs' );
function quadlayers_remove_product_tabs ( $tabs ) {
unset( $tabs['informations_supplémentaires'] );
retourner $tabs ;
}

N'oubliez pas d'enregistrer les modifications, puis de rafraîchir la page. C'est ça! Vous avez supprimé l'onglet Informations supplémentaires !

Supprimer l'onglet de description et les avis

De plus, vous pouvez vous débarrasser de l'onglet description et de l'onglet avis avec le code suivant :

 add_filter( 'woocommerce_product_tabs' , 'quadlayers_remove_product_tabs' );
function quadlayers_remove_product_tabs( $tabs ) {
unset( $tabs['description'] );
unset( $tabs['avis'] );
retourner $tabs ;
}

Quels champs de paiement WooCommerce devez-vous supprimer ?

Alors, quels champs de paiement devez-vous supprimer ? Cela dépend si vous vendez des produits physiques ou numériques et de la quantité d'informations que vous souhaitez obtenir de vos clients. Cependant, gardez à l'esprit que les formulaires de paiement plus longs ont généralement des conversions plus faibles. Les clients ont tendance à éviter les longs paiements. Voici donc quelques conseils pour que la page de paiement reste courte :

  • Si vous vendez des produits numériques, masquez tous les champs liés à l'expédition tels que l'adresse, le code postal, la ville, etc.
  • Afficher uniquement les champs obligatoires. Vous pouvez masquer ou réduire les champs facultatifs tels que le nom de l'entreprise.
  • Désactivez la validation du code postal pour réduire les frictions sur la page de paiement.
  • Si vous vendez des produits physiques, faites des détails de facturation les détails d'expédition par défaut pour masquer les champs inutiles.
  • Lorsque cela est possible, utilisez la saisie automatique pour réduire le temps que les utilisateurs passent à remplir le formulaire.
  • Utilisez un seul champ pour le nom. Au lieu d'afficher 3 champs (prénom, deuxième prénom et nom de famille), vous pouvez utiliser un champ Nom complet .

Une autre option pour réduire les étapes sur la page de paiement et augmenter les conversions consiste à utiliser un bouton d'achat rapide pour WooCommerce. La plupart des grands joueurs de commerce électronique utilisent car c'est un moyen très efficace d'accélérer le processus d'achat et de permettre aux acheteurs d'acheter en un clic.

Conclusion

En conclusion, votre page de paiement peut avoir un impact énorme sur votre entreprise et vous donner un avantage concurrentiel. Par conséquent, il est essentiel de l'optimiser et de l'améliorer autant que possible.

Dans ce didacticiel, nous avons vu deux manières différentes de supprimer et de désactiver les champs de paiement WooCommerce . Chacun d'eux a ses avantages et ses inconvénients, vous devez donc choisir celui qui correspond le mieux à vos compétences et à vos besoins.

WooCommerce Checkout Manager et Direct Checkout sont d'excellents plugins qui vous permettent de désactiver les champs de manière simple et rapide. Cependant, ils complexifient le code du magasin. La fonction PHP, en revanche, nécessite un peu de codage, mais elle est plus propre et ne consommera aucune ressource. Outre la suppression des champs de paiement, vous pouvez également améliorer le processus d'achat sur votre site en créant des entonnoirs de vente.

Enfin, si vous souhaitez améliorer votre page de paiement, nous vous recommandons de consulter notre tutoriel pour personnaliser le paiement dans WooCommerce et notre guide sur la façon de modifier les champs de paiement .

Quelle méthode as-tu choisi ? Connaissez-vous un autre moyen de supprimer les champs de paiement WooCommerce ? Laissez un commentaire ci-dessous et partagez vos expériences avec nous.