Comment modifier les passerelles de paiement dans WooCommerce

Publié: 2022-08-04

La configuration de vos passerelles de paiement est l'une des premières choses que vous devez complètement comprendre lorsque vous créez votre boutique WooCommerce. Lorsque vos clients doivent payer leurs achats, le virement bancaire n'est pas toujours une option fiable ou pratique. C'est pourquoi, chez QuadLayers , nous vous proposons notre guide sur la façon de modifier les passerelles de paiement WooCommerce dans WooCommerce.

Pourquoi modifier les passerelles de paiement WooCommerce ?

Avoir des passerelles de paiement faciles à utiliser pour vous aider à faciliter le processus de paiement est très important lorsqu'il s'agit de maintenir vos conversions. Non seulement vous voulez des passerelles de paiement accessibles pour vos produits, mais vous voulez également que vos clients fassent confiance à vos systèmes de paiement. De nos jours, les paiements en ligne peuvent comporter de nombreux risques et les clients sont plus prudents lorsqu'ils achètent s'ils ne font pas confiance à 100 % à votre magasin.

C'est pourquoi notre guide couvrira toutes les façons dont vous pouvez modifier vos passerelles de paiement dans WooCommerce pour apporter plus de clarté et accumuler la confiance de vos clients. Que vous ajoutiez de nouvelles méthodes de paiement ou que vous les personnalisiez, vous devez également vous assurer que vos clients obtiennent la meilleure expérience utilisateur de votre boutique. Ainsi, vous pouvez également choisir d'ajouter des icônes et des badges de passerelle de paiement si nécessaire.

Nous couvrirons tout cela aujourd'hui et plus encore. Mais avant cela, examinons les options par défaut de WooCommerce pour modifier les passerelles de paiement.

Comment modifier les passerelles de paiement dans WooCommerce

Vous pouvez modifier vos passerelles de paiement WooCommerce de 3 manières principales :

  1. Tableau de bord WooCommerce par défaut
  2. Par programme
  3. Utiliser des plugins

Voyons d'abord comment vous pouvez gérer vos passerelles de paiement à l'aide du tableau de bord WooCommerce par défaut.

1. Modifier les passerelles de paiement dans WooCommerce à l'aide des options par défaut

Pour commencer à utiliser les options par défaut pour vos passerelles de paiement WooCommerce, vous devez d'abord les configurer.

1.1. Configurer des passerelles de paiement

Ouvrez votre tableau de bord WP Admin et cliquez sur WooCommerce > Paramètres > Paiements . Ici, vous verrez toutes vos passerelles de paiement activées pour votre site Web. Par défaut, vous devriez voir des options telles que Chèque, Virement bancaire et Paiement à la livraison.

modifier les passerelles de paiement dans woocommerce - paramètres de paiement woocommerce 1

Vous pouvez activer/désactiver l'une de ces options en cliquant sur l'option de basculement Activé . Cliquez dessus et la passerelle de paiement correspondante sera désactivée. Vous pouvez également faire glisser l'une des passerelles de paiement pour réorganiser également leur position. De cette façon, vous pouvez également modifier l'ordre dans lequel ces passerelles sont fournies à vos clients sur le front-end.

modifier les passerelles de paiement dans woocommerce - ordre des paramètres de paiement woocommerce 2

Bien sûr, vous pouvez également utiliser ce tableau de bord pour configurer des méthodes de paiement supplémentaires telles que PayPal et Stripe. Si vous le souhaitez, vous pouvez consulter ces guides pour obtenir de meilleures instructions sur leur configuration :

  • Configurer WooCommerce avec Stripe
  • Configurer WooCommerce avec PayPal

1.2. Gérer les passerelles de paiement à l'aide des options WooCommerce par défaut

Par défaut, WooCommerce vous permet de personnaliser quelques détails concernant vos passerelles de paiement. Par exemple, si nous cliquons sur Gérer le paiement à la livraison , vous pourrez accéder à des options telles que :

  • Titre : utilisez le champ de titre pour modifier le titre/le texte de la passerelle de paiement que les utilisateurs voient lors de leur paiement.
  • Description : à l'aide de ce champ, vous pouvez ajouter une description courte mais claire du fonctionnement de l'escapade de paiement et de la manière dont vous traiterez les paiements.
  • Instructions : instructions supplémentaires concernant la manière de gérer les paiements et de transférer/payer l'argent en fonction de la passerelle de paiement.

modifier les passerelles de paiement dans woocommerce - paiement woocommerce activé

Avec la passerelle de paiement contre remboursement, vous ne pouvez activer la passerelle de paiement que pour des méthodes d'expédition spécifiques . Par exemple, nous définirons ce champ pour les enlèvements locaux uniquement, de sorte que le paiement contre remboursement ne s'affichera que lorsque les clients choisiront l'enlèvement local comme méthode d'expédition.

Une fois que vous avez rempli ces détails comme bon vous semble et cliquez sur Enregistrer les modifications. Ensuite, votre passerelle de paiement sera mise à jour avec succès. Maintenant, vous pourrez voir le résultat de nos personnalisations :

modifier les passerelles de paiement dans woocommerce - 5 capture d'écran de démonstration

Bien que cela soit suffisant pour personnaliser vos passerelles de paiement dans une certaine mesure, vous pouvez également obtenir de meilleures options d'édition avec quelques étapes supplémentaires. Ils peuvent être modifiés ultérieurement soit par programmation, soit à l'aide d'un plugin.

2. Modifier les passerelles de paiement dans WooCommerce par programmation

Si vous avez une idée technique de base de la programmation, vous pouvez également modifier les passerelles de paiement WooCommerce par programmation. Mais pour personnaliser vos passerelles de paiement, vous devrez utiliser des crochets WooCommerce en utilisant votre identifiant de paiement . Ensuite, nous pouvons utiliser l'ID de paiement pour modifier vos passerelles de paiement.

Alors d'abord, regardons comment vous pouvez trouver votre identifiant de passerelle de paiement.

2.1. Comment afficher votre identifiant de passerelle de paiement

Pour cela, vous devrez accéder à votre fichier de thème functions.php . Cependant, nous vous recommandons d'utiliser un thème enfant à la place, car il est plus sûr et vos fichiers de thème ne changeront pas ou ne seront pas rétablis lorsque vous mettrez à jour votre thème principal. Alors, allez-y et passez à votre thème enfant. Vous pouvez même utiliser l'un des plugins de thème enfant pour WordPress si vous avez besoin d'aide supplémentaire.

Nous aimerions également vous rappeler de sauvegarder votre site Web avant de commencer, car nous allons modifier les fichiers principaux de votre boutique. Ainsi, toute modification non désirée sur ceux-ci peut entraîner d'autres problèmes sur votre site Web.

Ensuite, ouvrez votre éditeur de thème en cliquant sur Apparence > Éditeur de fichier de thème depuis votre tableau de bord WordPress.

Maintenant, cliquez sur functions.php à partir des fichiers de thème en haut à droite de votre écran.

Utilisez l'éditeur de fichiers au milieu et copiez le script suivant dans l'éditeur :

 add_filter( 'woocommerce_payment_gateways_setting_columns', 'QL_add_payment_method_column' );

function QL_add_payment_method_column( $default_columns ) {

$default_columns = array_slice( $default_columns, 0, 2 ) + array( 'id' => 'ID' ) + array_slice( $default_columns, 2, 3 );
retourne $colonnes_par_défaut ;

}

// woocommerce_payment_gateways_setting_column_{COLUMN ID}
add_action( 'woocommerce_payment_gateways_setting_column_id', 'QL_populate_gateway_column' );

function QL_populate_gateway_column( $gateway ) {

echo '<td>' . $gateway->id . '</td>' ;

} 

modifier les passerelles de paiement dans woocommerce - ajouter une colonne d'ID de paiement

Collez-le dans l'éditeur et cliquez sur Mettre à jour le fichier . Cela ajoutera une colonne à votre liste de paiements qui vous montrera votre identifiant de passerelle de paiement. Pour afficher cette liste, cliquez sur WooCommerce > Paramètres > Paiements.

2.2. Modifier le titre de la passerelle de paiement par programme

Vous pouvez désormais utiliser cet identifiant pour personnaliser le titre et la description de vos passerelles de paiement. Vous pouvez utiliser le script suivant pour changer le titre de votre passerelle de paiement :

 add_filter( 'woocommerce_gateway_title', 'QL_change_payment_gateway_title', 25, 2 );

fonction QL_change_payment_gateway_title( $title, $gateway_id ){

if( 'code' === $gateway_id ) {
$title = 'Insérer-Texte-ici';
}

retourne $titre ;
}

Ici, tout ce que vous avez à faire est de remplacer 'cod' dans l'instruction if par l' identifiant de la passerelle de paiement que vous souhaitez personnaliser. Ensuite, remplacez la section Insert-Text-Here dans l'argument $title pour utiliser votre texte personnalisé pour le titre.

Par exemple, nous avons les bacs d'identification pour notre paiement direct par virement bancaire. Donc, nous prenons les lignes de code ci-dessus et remplaçons la morue par bacs. Ensuite, nous pouvons ajouter le texte personnalisé " Virement sur notre compte Bank of America (uniquement pour les résidents américains.). ' Maintenant, le code devrait ressembler à ceci :

 add_filter( 'woocommerce_gateway_title', 'QL_change_payment_gateway_title', 25, 2 );

fonction QL_change_payment_gateway_title( $title, $gateway_id ){

if( 'bacs' === $gateway_id ) {
$title = 'Transfert sur notre compte Bank of America (uniquement pour les résidents américains)' ;
}

retourne $titre ;
} 

Avec cela, notre paiement frontal devrait ressembler à ceci :

modifier les passerelles de paiement dans woocommerce - texte de démonstration pour le code

2.2. Modifier la description de la passerelle de paiement par programme

Vous pouvez également ajouter des textes de description personnalisés avec une fonction similaire qui utilise le gateway_id . Remplacez simplement la section ' Insert-text-here ' dans le script suivant pour ce faire :

 add_filter( 'woocommerce_gateway_description', 'QL_change_payment_gateway_description', 25, 2 );

function QL_change_payment_gateway_description( $description, $gateway_id ) {

if( 'bacs' === $gateway_id ) {
// vous pouvez utiliser des balises HTML ici
$description = 'Texte de démonstration ici pour un paiement personnalisé ;)';
}

retourne $description ;
} 

Ici, vous pouvez voir notre texte personnalisé dans notre caisse de démonstration :

2.2.1. Utilisation de balises HTML dans la description de vos passerelles de paiement

Vous pouvez même utiliser des balises HTML pour ajouter des images ou même des liens vers des pages spécifiques à l'aide de ce code. Cela modifiera simplement le texte à l'aide de balises HTML. Cependant, nous demandons aux utilisateurs d'utiliser les balises HTML uniquement s'ils sont à l'aise avec cela. Par exemple, pour diriger nos clients vers notre page TOS, nous pouvons utiliser le code comme celui-ci :

 add_filter( 'woocommerce_gateway_description', 'QL_change_payment_gateway_description', 25, 2 );

function QL_change_payment_gateway_description( $description, $gateway_id ) {

if( 'bacs' === $gateway_id ) {
// vous pouvez utiliser des balises HTML ici
$description = '<a href = "http://localhost/wpsite/terms-and-conditions/">Texte de démonstration ici pour un paiement personnalisé</a>' ;
}

retourne $description ;
} 

modifier les passerelles de paiement dans woocommerce - lien de test de démonstration

Avec ce code, notre texte de description sera également lié à notre page Conditions générales, qui peut être utilisée pour fournir aux clients plus de détails sur le paiement ainsi que sur les remboursements ou remises disponibles.

modifier les passerelles de paiement dans woocommerce - démonstration du lien du texte de description

Cela explique comment vous pouvez modifier par programme les passerelles de paiement dans WooCommerce . Comme vous pouvez le voir, il peut encore être un peu délicat de modifier et de personnaliser votre passerelle de paiement à l'aide des codes. Cela peut être particulièrement difficile si vous n'êtes pas à l'aise d'ajouter des fonctions personnalisées à votre thème.

C'est pourquoi nous vous avons également apporté le guide sur l'édition des passerelles de paiement à l'aide de plugins.

3. Modifier les passerelles de paiement dans WooCommerce à l'aide de plugins

Avec les plugins , le processus d'édition des passerelles de paiement devient beaucoup plus simple et convivial. Vous obtenez un certain nombre de fonctionnalités avancées en utilisant des plugins spécifiques. Certains d'entre eux incluent même la possibilité d'afficher/masquer les méthodes de paiement en fonction des produits ou des catégories de produits.

Mais pour notre démo d'aujourd'hui, nous utiliserons les passerelles de paiement par produits/catégories/tags pour le plugin WooCommerce . Le plugin est assez simple et, comme son nom l'indique, il vous permet d'activer ou de désactiver des passerelles de paiement spécifiques pour des produits, des catégories ou des balises spécifiques.

3.1. Installer et activer le plugin

Commençons par installer et activer le plugin. Tout d'abord, ouvrez votre tableau de bord WP Admin et cliquez sur Plugins > Add New .

modifier les passerelles de paiement dans WooCommerce - plugins 1

Ensuite, utilisez la barre de recherche en haut à droite et recherchez les mots-clés du plugin. Cliquez sur Installer maintenant dans l'onglet du plugin pour installer le plugin.

modifier les passerelles de paiement dans woocommerce - installer le plugin 2

Pour activer le plugin, vous pouvez cliquer sur Activer lorsque le bouton passe à Activer. Alternativement, vous pouvez cliquer sur Plusieurs plugins dans votre barre latérale et cliquer manuellement sur Activer sous la liste des plugins.

modifier les passerelles de paiement dans WooCommerce - activer les plugins

Cependant, si vous souhaitez utiliser l'un des plugins premium, vous devrez installer le plugin manuellement.

3.2. Configurer les paramètres du plug-in

Pour utiliser le plugin, vous devez ouvrir les options du plugin en cliquant sur WooCommerce > Paramètres > Passerelles de paiement par produit . Ici, vous avez trois onglets différents que vous pouvez utiliser : Par catégories de produits, Par étiquette de produit et Par produits.

modifier les passerelles de paiement dans woocommerce - plugin de paramètres de paiement

Toutes ces fonctionnalités nécessitent des étapes similaires. Faisons d'abord une démonstration en utilisant l'onglet Par catégories de produits . Cliquez sur Par catégories de produits, et vous recevrez une liste de toutes vos passerelles de paiement disponibles.

Ici, vous pouvez utiliser le champ Inclure et Exclure pour masquer/afficher les passerelles de paiement pour des catégories de produits spécifiques. Vous pouvez choisir les produits pour lesquels la passerelle de paiement correspondante sera affichée à l'aide du champ Inclure. Inversement, l'utilisation de l'exclusion nous permet de masquer la passerelle de paiement pour des produits spécifiques.

Cela fonctionne très bien si vous souhaitez désactiver certaines passerelles de paiement pour des produits avec des marges bénéficiaires ou des coûts différents. Ainsi, par exemple, si nous voulons désactiver le paiement à la livraison pour des produits virtuels spécifiques , nous pouvons simplement saisir le nom de la catégorie de produits dans le champ Exclure pour le paiement à la livraison. Une fois que vous avez terminé, cliquez sur Enregistrer les modifications.

Pour une démo, nous pouvons voir que la passerelle de paiement en espèces à la livraison est désactivée pour notre paiement puisque nous avons un produit virtuel dans notre panier.

De même, vous pouvez utiliser la balise Inclure dans un fichier similaire pour afficher également une passerelle de paiement pour des catégories spécifiques. Pour l'option d'inclusion, nous pouvons ajouter la catégorie Meubles , de sorte que l'option s'affiche si nous avons un produit correspondant dans notre panier.

Maintenant, si nous ajoutons notre produit de mobilier de démonstration, la passerelle de paiement sera activée pour nous lors du paiement :

Désactiver les méthodes de paiement dans WooCommerce

WooCommerce vous permet également de désactiver facilement les méthodes de paiement. De plus, vous pouvez même choisir d'utiliser des méthodes intelligentes pour les désactiver en utilisant les conditions du panier, l'adresse de facturation, etc. Voyons d'abord comment vous pouvez désactiver les méthodes de paiement dans WooCommerce.

Pour cela, rendez-vous d'abord dans WooCommere > Paramètres > Paiements . Ici, vous pouvez voir la colonne Activé à côté de chaque passerelle de paiement. Cliquez sur le bouton activer/désactiver à côté du mode de paiement pour le désactiver. Ensuite, cliquez sur Enregistrer les modifications.

C'est un moyen extrêmement simple de désactiver les passerelles de paiement. Cependant, supposons que vous souhaitiez désactiver les passerelles de paiement en utilisant des cas et des conditions encore plus détaillés. Dans ce cas, vous pouvez le faire en utilisant des fonctions et des plugins WooCommerce personnalisés.

Par exemple, si vous souhaitez désactiver une passerelle de paiement en utilisant la valeur totale du panier , vous pouvez le faire avec une simple fonction WooCommerce. Le code vérifie si le total de votre panier est supérieur à 200, et si c'est le cas, il désactive le paiement à la livraison pour cette commande spécifique. C'est un excellent moyen d'arrêter les paiements volumineux pour des passerelles de paiement spécifiques que vous ne pouvez pas gérer.

Donc pour utiliser ce code, ouvrez votre functions.php comme nous l'avons mis en évidence ci-dessus en cliquant sur Apparence > Éditeur de fichier de thème depuis votre tableau de bord WordPress.

Ensuite, collez ce script dans l'éditeur et cliquez sur Mettre à jour le fichier.

 add_filter( 'woocommerce_available_payment_gateways', 'quadlayers_disable_paypal_above_100' );

function quadlayers_disable_paypal_above_100( $available_gateways ) {
$maximum = 200 ;
if ( WC()->cart->total > $maximum ) {
unset( $available_gateways['cod'] );
}
renvoie $available_gateways ;
} 

modifier les passerelles de paiement dans WooCommerce - condition de paiement désactivé

Et ce n'est qu'un moyen de désactiver les passerelles de paiement dans WooCommerce. Si vous cherchez des moyens d'utiliser d'autres conditions comme les articles du panier, l'adresse, les rôles d'utilisateur, etc., nous vous recommandons de consulter notre guide ici sur Comment désactiver les passerelles de paiement dans WooCommerce.

Bonus : Comment ajouter un badge de confiance personnalisé pour vos passerelles de paiement

Les badges de confiance sont un excellent moyen de montrer clairement que vous prenez en charge des passerelles de paiement spécifiques et que vous êtes vérifié par ces services. De cette façon, si vous avez activé des passerelles de paiement comme Paypal ou Stripe, vous pouvez ajouter une petite image astucieuse pour cela.

Le moyen le plus rapide d'ajouter des badges Trust consiste à ajouter le petit script suivant au fichier functions.php de votre thème enfant. Donc, encore une fois, cliquez sur Apparence> Éditeur de fichiers de thème et cliquez sur functions.php dans la barre latérale des fichiers de thème à droite.

Après cela, collez le code suivant et cliquez sur Mettre à jour le fichier.

 add_action( 'woocommerce_after_cart_totals', 'add_content_on_cart' );

fonction add_content_on_cart() {
echo "<img src='https://www.nicepng.com/png/full/313-3136141_add-to-cart-checkout-trust-badges-shopify-png.png'>" ; 
}

add_action( 'woocommerce_review_order_after_payment', 'add_content_on_checkout' );

fonction add_content_on_checkout() {
echo "<img src='https://www.nicepng.com/png/full/313-3136141_add-to-cart-checkout-trust-badges-shopify-png.png'>" ;
} 

Cela devrait maintenant ajouter un badge de confiance à votre paiement comme suit :

De plus, si vous êtes à l'aise avec la modification des codes HTML, vous pouvez créer un badge personnalisé, le télécharger sur votre site Web et le lier à l'aide de l'attribut src.

Conclusion

Et cela termine notre guide sur Comment modifier les passerelles de paiement dans WooCommerce. Pour la commodité de notre lecteur, nous allons résumer rapidement tous les points que nous avons parcourus dans cet article :

  • Modifier les passerelles de paiement à l'aide du tableau de bord WooCommerce
  • Modifier le titre et la description de la passerelle de paiement par programmation
  • Utilisez des plugins pour modifier les passerelles de paiement pour des catégories de produits spécifiques
  • Désactiver les passerelles de paiement dans WooCommerce
  • Ajoutez des badges Trust à votre section de paiement WooCommerce

Bien sûr, le moyen le plus simple de modifier votre passerelle de paiement serait directement depuis le tableau de bord WooCommerce ou en utilisant un plugin. Bien que le tableau de bord WooCommerce soit le moyen le plus simple, le tableau de bord peut ne pas avoir la bonne gamme de fonctionnalités dont vous avez besoin.

Nous vous recommandons fortement d'utiliser un plugin si vous êtes plutôt un utilisateur convivial pour les débutants, et vous n'avez pas nécessairement besoin d'utiliser le plugin dont nous avons fait la démonstration. Avec notre guide comme référence et un rapide coup d'œil à la documentation de votre plugin, vous devriez être bon en un rien de temps. Mais en cas de confusion, vous pouvez nous demander notre aide dans la section des commentaires.

De plus, si vous cherchez d'autres moyens d'améliorer l'expérience de paiement de vos clients, pourquoi ne pas consulter certains de nos autres guides ici :

  • Comment ajouter une image de produit à WooCommerce Checkout
  • Comment modifier le texte Procéder au paiement dans WooCommerce
  • Guide de QuadLayers sur l'ajout et l'utilisation de classes d'expédition WooCommerce