Créer des champs personnalisés dans WooCommerce Checkout et les pages de produits

WooCommerce standard ne vous permet pas de créer des champs personnalisés sans écrire votre code. Cependant, il existe des situations où vous avez besoin des champs de produit ou de paiement personnalisés pour gérer efficacement une commande WooCommerce ! Ne t'inquiète pas. 2 plugins gratuits vous aideront à ajouter des champs personnalisés dans votre boutique.

Vous savez qu'il peut être nécessaire d'avoir des informations précises sur le produit ou la commande que WooCommerce ne vous donne pas !

Obtenez plus de détails sur une commande en ajoutant un champ personnalisé dans WooCommerce. Laissez-moi vous montrer deux plugins gratuits pour le faire facilement !

Table des matières

• Que sont les champs personnalisés dans WooCommerce ?
• Champs personnalisés du produit WooCommerce
• Champs personnalisés de WooCommerce Checkout

Que sont les champs personnalisés dans WooCommerce ?

Vous pouvez considérer les champs personnalisés comme des informations supplémentaires décrivant, par exemple, un produit ou une commande. Ils vous aideront à mieux montrer les produits et à obtenir plus de détails pour traiter efficacement les commandes WooCommerce !

Quelques exemples de champs personnalisés

• cases à cocher
• champs de texte
• boutons radio
• sélecteurs de date
• sélecteurs de couleurs
• etc.

Voici à quoi ils ressemblent dans le formulaire de commande :

Autre exemple, vous pouvez laisser vos clients télécharger des fichiers dans les commandes ou saisir le numéro de TVA intracommunautaire à des fins comptables. Il serait également intéressant de changer le type de champ de paiement ou d'en masquer certains !

Ajoutons des champs personnalisés

Vous souhaiterez probablement créer deux types de champs personnalisés dans WooCommerce, par exemple :

• des champs personnalisés dans la page de paiement WooCommerce pour obtenir plus de détails sur une commande,
• et de nouveaux champs pour personnaliser la page produit WooCommerce afin que les produits aient plus d'options.

Je vais vous montrer les deux.

Champs personnalisés du produit WooCommerce

Tout d'abord, vous aurez besoin d'un plugin pour cela. Regarde:

Télécharger les ici:

Tout d'abord, jetez un coup d'œil à l'ensemble exemplaire de nouveaux champs personnalisés sur la page du produit que vous pouvez ajouter avec le plug-in gratuit Flexible Product Fields for WooCommerce :

Comme vous le voyez, vous pouvez créer un assistant complet. Les clients peuvent ainsi personnaliser leurs ordinateurs. De plus, certaines options nécessitent des frais supplémentaires. Le plugin ajoute les frais supplémentaires au prix total (disponible dans PRO). Les clients peuvent passer des commandes pour leurs ordinateurs personnalisés et vous payer la totalité du prix à l'avance.

Revenons au look. C'est la configuration de base. Je n'ai utilisé aucun style CSS et j'ai utilisé un thème WooCommerce par défaut : Storefront. Vous pouvez bien sûr personnaliser l'apparence des champs comme vous le souhaitez. Il existe une option à cet effet dans le plugin.

Champs de produit flexibles

En bref, ce plugin vous permet de créer des add-ons de produits. Vous pouvez ajouter de nouveaux champs personnalisés aux produits de votre boutique WooCommerce. Vous avez déjà vu un exemple.

Les types de champs que vous pouvez ajouter à vos produits WooCommerce

• Texte
• Zone de texte
• Nombre
• E-mail
• URL
• Case à cocher multiple
• Radio avec des couleurs
• Temps
• Couleur
• Titre
• Paragraphe
• Image
• HTML
• Case à cocher
• Bouton radio
• Sélectionner
• Sélection multiple
• Radio avec images
• Gros titre
• Date (PRO)
• Téléchargement de fichiers (PRO)

Vous devriez consulter ce guide ! Vous constaterez qu'il existe de nombreux cas d'utilisation. Nous guidons les utilisateurs étape par étape dans la configuration pour mettre en œuvre :

• Système de réservation simple,
• Fonction emballage cadeau,
• Assistant diététique traiteur,
• Assistant informatique etc.

Champs personnalisés de WooCommerce Checkout

Maintenant, laissez-moi vous montrer comment ajouter des champs personnalisés à la commande WooCommerce à partir de la page de paiement !

Vous aurez besoin de ce plugin :

Télécharger les ici:

Voyons l'exemple d'une page de paiement personnalisée avec le plugin gratuit Flexible Checkout Fields for WooCommerce :

Le plugin vous permet d'ajouter, de supprimer, de réorganiser et de personnaliser efficacement la page de paiement WooCommerce !

Champs de paiement flexibles

Donc, en bref, les champs de paiement flexibles vous permettent de créer des champs personnalisés dans le paiement WooCommerce→

De plus, avec ce plugin, vous pouvez modifier ou réorganiser les champs de paiement WooCommerce par défaut !

Par exemple, vous pouvez désactiver certains champs d'adresse de facturation pour un paiement plus rapide.

Plus de 80 000 magasins dans le monde utilisent ce plugin quotidiennement.

Types de champs de paiement dans la version gratuite

• Texte
• Zone de texte
• Nombre
• E-mail
• Téléphone
• URL
• Case à cocher
• Couleur
• Gros titre
• Paragraphe
• Image
• HTML

Champs dans la version PRO

• Case à cocher multiple
• Bouton radio
• Sélectionnez (liste déroulante)
• Sélection multiple
• Radio avec images
• Date
• Radio avec des couleurs
• Temps
• Téléchargement de fichiers

Téléchargez cette extension WooCommerce gratuite pour personnaliser votre page de paiement.

Résumé

Ajouter des champs de produit et de paiement personnalisés dans WooCommerce

Dans cet article, je vous ai montré les plugins que vous pouvez utiliser pour créer des champs personnalisés dans WooCommerce.

Il existe deux plugins que vous pouvez utiliser pour créer des champs personnalisés dans WooCommerce :

• Télécharger les champs de paiement flexibles →
• Télécharger les champs de produit flexibles →

Les deux plugins sont disponibles en téléchargement gratuit. Cependant, la version gratuite ne prend pas en charge toutes les fonctionnalités.

Faites-nous savoir si vous avez des questions sur les plugins et la création de champs personnalisés !

En savoir plus sur nos plugins