Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
Coupe WPB
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Comment intégrer des formulaires dans WordPress (Guide ultime pour les débutants)

Les formulaires WordPress sont essentiels pour se connecter avec les internautes et développer votre audience. Que vous ajoutiez un formulaire de contact, un sondage ou un formulaire de commentaires, l’intégrer à votre site est un moyen rapide et facile de collecter des informations auprès des internautes.

Nous utilisons des formulaires dans tous nos projets, qu’il s’agisse de pages de contact, d’abonnements à des newsletters ou même de formulaires de paiement. En cours de route, nous avons appris toutes les étapes nécessaires pour intégrer un formulaire WordPress, et nous sommes là pour vous accompagner du début à la fin du processus.

Dans ce guide, nous vous montrerons comment intégrer des formulaires en utilisant les constructeurs de formulaires WordPress les plus populaires.

How to Embed Forms in WordPress

Qu’est-ce qu’un formulaire WordPress et pourquoi est-il important ?

Un formulaire WordPress est un outil permettant de recueillir des informations et des renseignements précieux sur votre site. Il permet aux internautes de saisir leurs coordonnées, telles que leur nom, leur adresse e-mail et leurs commentaires.

Les formulaires ont de nombreux cas d’utilisation. Par exemple, vous pouvez créer un formulaire de contact pour permettre aux utilisateurs de vous joindre et constituer une liste d’e-mails, une enquête pour recueillir des avis ou un formulaire d’inscription à des événements.

Vous pouvez également utiliser des formulaires pour la prise de rendez-vous ou la collecte de dons. Certaines entreprises utilisent également des formulaires pour traiter les demandes de support client.

Sans formulaires, vous pourriez manquer des chances d’engager avec les internautes. Ainsi, l’ajout de formulaires à votre site WordPress est une décision intelligente pour tout propriétaire de site.

Comment intégrer des formulaires dans WordPress

Dans les sections suivantes, nous vous guiderons à travers chaque étape pour ajouter des formulaires à votre site WordPress. Si vous êtes intéressé par un type de formulaire en particulier, vous pouvez cliquer sur le lien pour passer à l’article suivant :

Vous êtes prêts ? Commençons.

1. Comment intégrer WPForms dans votre site WordPress

WPForms est le meilleur constructeur de formulaires polyvalent du marché. C’est aussi l’un des plus populaires, avec plus de 6 millions d’utilisateurs actifs.

Avec cet outil, vous pouvez utiliser n’importe lequel de ses plus de 2000 modèles prêts à l’emploi et personnalisables pour créer n’importe quel formulaire.

WPForms' homepage

En plus des formulaires de contact, WPForms peut vous aider à construire facilement des formulaires simples ou plus avancés, comme :

Lorsqu’il s’agit d’intégrer des WPForms, vous pouvez soit utiliser un bloc WPForms, soit un shortcode.

Alors, installons et activons WPForms et essayons cela ensemble. Si vous avez besoin d’aide, alors vous pouvez vous référer à notre guide sur l’installation d’une extension WordPress.

Ensuite, vous pouvez suivre notre guide étape par étape sur la création d’un formulaire de contact sur WordPress.

Intégrer des formulaires WPForms en utilisant le bloc WPForms

Une fois que le formulaire est prêt à être publié, il suffit de cliquer sur le bouton « Embed » à l’intérieur du constructeur de formulaires pour ajouter le formulaire à votre page web en utilisant un bloc WPForms.

The Embed button in WPForms form builder

Une fenêtre contextuelle s’ouvre, dans laquelle vous pouvez choisir une page existante ou créer une nouvelle page pour le formulaire.

Si vous cliquez sur le bouton « Sélectionner une page existante », vous verrez apparaître un menu déroulant contenant toutes les pages disponibles sur votre site. Si vous cliquez sur « Créer une nouvelle page », vous verrez apparaître un champ « Nom de votre page » à remplir.

Une fois que vous avez choisi une page ou nommé votre nouvelle page, vous pouvez cliquer sur le bouton « Let’s Go ».

Embed contact form WPForms

Vous serez alors redirigé vers l’éditeur de blocs de la page.

À partir de là, vous pouvez cliquer sur le bouton « + » et rechercher le bloc WPForms.

Adding WPForms block

L’étape suivante consiste à ouvrir le menu déroulant du bloc WPForms et à choisir le formulaire que vous souhaitez intégrer.

Une fois que vous avez sélectionné un formulaire, WPForms le charge dans l’éditeur de blocs.

Ensuite, vous pouvez jouer avec les « Paramètres du formulaire » dans le panneau de droite.

Par défaut, WPForms ne charge pas le titre de votre formulaire. Donc, vous pourriez vouloir activer l’option ‘Titre du formulaire’ pour ajouter le titre du formulaire et donner aux internautes plus de contexte. Si vous écrivez une description du formulaire, vous pouvez également activer cette option.

Mieux encore, vous pouvez donner à votre formulaire un thème qui s’harmonise avec l’aspect général de votre site.

WPForms form settings in block editor

Lorsque vous êtes satisfait de l’aspect du formulaire, vous pouvez cliquer sur « Enregistrer ».

Voilà comment intégrer WPForms en utilisant un bloc WPForms.

WPForms embedded on a live website

Intégrer des formulaires WPForms à l’aide d’un shortcode

Une autre façon d’intégrer WPForms est d’utiliser un shortcode.

Pour ce faire, vous devez vous rendre dans WPForms  » All Forms pour trouver la colonne ‘Shortcode’ pour chaque formulaire.

The shortcode column in WPForms page

À partir de là, il suffit de copier le code court du formulaire que vous souhaitez intégrer. Par exemple, nous allons copier le shortcode de notre formulaire « Avis des clients ».

L’étape suivante consiste à ouvrir la page ou la publication dans laquelle vous souhaitez intégrer le formulaire. Pour ce faire, allez dans  » Pages  » ou  » Publications « . Survolez ensuite l’un d’entre eux et cliquez sur « Modifier » lorsqu’il apparaît.

Vous accéderez ainsi à l’éditeur de la page ou de la publication.

Pour intégrer le formulaire, cliquez sur le bouton « + » et recherchez le bloc « Shortcode ».

The shortcode block in block editor

Une fois le bloc ajouté, vous pouvez coller le shortcode de votre formulaire WPForms dans le champ de texte.

Voici à quoi cela pourrait ressembler :

Adding WPForms shortcode

L’Éditeur de blocs ne charge pas le formulaire dans la zone d’édition directe.

Commencez donc par enregistrer les modifications, puis cliquez sur le bouton « Voir la page » lorsqu’il apparaît dans le coin inférieur gauche.

WPForms embedded using shortcode on a live website

2. Comment intégrer des formulaires de don dans WordPress

L’ajout d’un formulaire de don à votre site permet aux internautes de soutenir facilement votre cause. Les internautes sont plus enclins à faire un don lorsqu’ils voient un moyen clair et simple de le faire.

La façon la plus simple d’intégrer des formulaires de don dans WordPress est d’utiliser l’extension Charitable. Cet outil populaire vous permet de créer et de personnaliser plusieurs campagnes de collecte de fonds avec plus de 100 modèles prêts à l’emploi.

Charitable's homepage

Installons et activons donc Charitable pour créer votre formulaire de don. Si vous avez besoin d’aide, alors vous pouvez consulter notre guide sur l’installation d’une extension WordPress.

Après l’activation, dirigeons-nous vers Charitable  » Paramètres pour activer la licence Pro. Il suffit de coller votre clé de licence et de cliquer sur  » Vérifier la clé  » pour lancer le processus.

Adding the WP Charitable license key

Ceci fait, vous êtes prêt à créer votre formulaire de don. Pour des instructions détaillées, vous pouvez consulter notre guide sur la création d’un formulaire de don récurrent sur WordPress.

Lorsque vous êtes satisfait de l’aspect du formulaire, vous pouvez l’intégrer dans une publication ou une page WordPress.

Dans l’outil de création de campagne, commencez par cliquer sur le menu déroulant « Brouillon » pour ouvrir les options. Ensuite, cliquez sur « Publier » et Charitable créera automatiquement une nouvelle page pour votre campagne.

Publishing a campaign in WP Charitable

Et c’est tout – vous avez créé et publié avec succès votre première campagne Charitable !

Maintenant, si vous visitez votre site, vous pouvez voir votre formulaire de don en action.

WP Charitable crowdfunding campaign on a live website

Cela dit, vous remarquerez peut-être aussi le lien « Assistant d’intégration » dans la fenêtre contextuelle ou le bouton « Intégrer » dans l’éditeur Charitable.

Vous pouvez également utiliser l’une ou l’autre de ces fonctions pour ajouter votre formulaire de don à d’autres publications ou pages.

Pour ce faire, il suffit de cliquer sur le lien « Assistant d’intégration » ou sur le bouton « Intégrer », ce qui déclenchera l’invite d’intégration.

Charitable's embed wizard

Dans la fenêtre qui s’affiche, vous devez choisir entre sélectionner une page existante ou en créer une nouvelle.

Comme nous disposons déjà d’une page dédiée au formulaire de don, il est préférable de sélectionner « Sélectionner une page existante ». Cliquez sur le bouton.

Select existing page for embedding Charitable campaign

Vous verrez alors apparaître une liste déroulante de toutes les pages de votre site WordPress.

Vous pouvez développer le menu déroulant, choisir une page et cliquer sur le bouton « Let’s Go ».

The Let's Go button

Cela vous redirigera vers l’éditeur de blocs de la page.

À partir de là, vous pouvez cliquer sur le bouton  » +  » et rechercher le bloc  » Campagne Charitable « . Ensuite, il suffit de cliquer sur le résultat de la recherche pour l’ajouter à l’éditeur de contenu.

Charitable Campaign block

Ensuite, vous pourrez choisir un formulaire de don à intégrer dans le menu déroulant du bloc « Campagne Charitable ».

Développez le menu déroulant. Cliquez ensuite sur la campagne que vous souhaitez ajouter.

Choosing a campaign

Ne vous inquiétez pas si vous ne voyez pas l’aperçu dans l’éditeur de contenu. Le bloc fonctionne parfaitement.

Cliquez donc sur le bouton « Enregistrer », « Mettre à jour » ou « Publier » pour que l’En direct.

Et voilà ! Vous pouvez maintenant visiter la page pour voir le formulaire de don en action :

Charitable donation form on a live website

3. Comment intégrer les formulaires HubSpot dans WordPress

HubSpot est une excellente plateforme pour développer votre entreprise, avec des outils tels qu’une plateforme de gestion de la relation client (CRM) où vous pouvez gérer les infos clients, un constructeur de site web, et plus encore.

La bonne nouvelle, c’est qu’ils ont également un Constructeur de formulaires qui fonctionne parfaitement avec WordPress. Lorsque quelqu’un remplit un formulaire, ses informations vont directement dans le CRM de HubSpot, de sorte que vous pouvez facilement faire un suivi avec eux à l’aide d’e-mails et de messages.

Vous pouvez même connecter HubSpot avec d’autres outils de formulaires, notamment WPForms. Cela rend la plateforme très pratique car elle fonctionne avec de nombreux autres outils que vous utilisez peut-être déjà.

Pour ce tutoriel, nous allons vous montrer comment intégrer des formulaires HubSpot en utilisant le module Constructeur de formulaires HubSpot et l’addon HubSpot de WPForms.

Intégrer des formulaires HubSpot à l’aide de l’extension HubSpot

Pour intégrer HubSpot Forms à l’aide de l’extension, vous devez d’abord installer le plugin HubSpot. Si vous avez besoin d’aide, vous pouvez lire notre guide sur l ‘installation d’une extension WordPress.

Après l’activation, vous devez cliquer sur le menu  » HubSpot  » dans votre tableau de bord WordPress. Dans ce panneau, vous verrez plusieurs façons de connecter votre site avec HubSpot :

  • Si vous disposez d’un compte HubSpot, il vous suffit de cliquer sur  » Se connecter « .
  • Si ce n’est pas le cas, vous continuez avec votre compte Google, Microsoft ou Apple.
  • Si vous le souhaitez, vous pouvez utiliser le même e-mail que celui que vous avez utilisé pour enregistrer votre site.
Signing up for HubSpot in WordPress

Une fois que vous vous êtes connecté ou que vous avez créé un compte HubSpot, il vous sera demandé de le connecter à votre site WordPress.

Il vous suffit de cliquer sur le bouton  » Connecter le site « , et HubSpot lancera le processus.

Connecting HubSpot with WordPress website

Une fois connecté, vous êtes prêt à créer votre formulaire HubSpot à l’aide de l’extension HubSpot.

Allez-y et naviguez vers HubSpot  » Formulaires. Ensuite, vous pouvez cliquer sur le bouton « Créer un formulaire ».

Creating HubSpot forms

A partir de là, vous pouvez choisir un type de formulaire et un modèle. Ensuite, vous serez redirigé vers un nouvel onglet où vous pourrez utiliser le Constructeur de formulaires pour personnaliser votre formulaire HubSpot.

Pour des instructions détaillées, vous pouvez consulter la première méthode de notre guide sur la création d’un formulaire HubSpot dans WordPress.

Lorsque vous êtes satisfait de l’apparence de votre formulaire, l’étape suivante consiste à l’intégrer à votre site. Naturellement, vous voudrez utiliser le bouton « Intégrer » dans le Constructeur de formulaires.

Embed button in HubSpot's form builder

Cependant, cette méthode est un peu confuse.

Il vous permet uniquement de partager le lien du formulaire et d’utiliser un extrait HTML sur votre publication ou page WordPress.

Embed methods in HubSpot form builder

Au lieu de cela, vous pouvez cliquer sur le bouton  » Retour à WordPress  » et intégrer vos formulaires à partir du tableau de bord HubSpot dans votre zone d’administration.

Cliquez sur le bouton dans le coin supérieur gauche.

Back to WordPress button in HubSpot form builder

À partir de là, il vous suffit de passer la souris sur le formulaire que vous souhaitez intégrer.

Ensuite, il suffit de cliquer sur le bouton « Embed » lorsqu’il apparaît.

HubSpot embed button in the WP admin area

Vous verrez alors une fenêtre contextuelle dans laquelle HubSpot propose plusieurs façons d’intégrer votre formulaire.

Ici, vous pouvez choisir d’intégrer votre formulaire HubSpot à une publication ou une page en utilisant le bloc HubSpot. Et si vous passez à l’autre onglet, vous trouverez le shortcode du formulaire.

Pour ce tutoriel, nous cliquerons sur le bouton « Publication WordPress ».

HubSpot's Your Form Is Ready popup window

Cela ouvrira la page « Publications » dans un nouvel onglet. Allez-y et ouvrez une publication pour y intégrer le formulaire en survolant une publication et en cliquant sur « Modifier » lorsqu’elle apparaît.

Vous pourrez ensuite ajouter le bloc de formulaire HubSpot à la page par l’intermédiaire de l’éditeur de contenu.

À partir de là, vous pouvez cliquer sur le bouton  » +  » et utiliser la barre de recherche pour rechercher le bloc de formulaire HubSpot. Cliquez dessus lorsque vous le voyez.

Adding a HubSpot form block to a post

Cela ajoutera le bloc HubSpot Form à la zone de contenu.

Cliquez ensuite sur le menu déroulant pour ouvrir les options disponibles. Ensuite, vous pouvez choisir le formulaire HubSpot que vous souhaitez intégrer.

HubSpot form embedded

Et c’est tout ! Vous pouvez maintenant cliquer sur le bouton « Enregistrer » pour stocker vos modifications.

Voici ce que cela donne sur notre site de démonstration :

HubSpot form on a live website

Intégrer des formulaires HubSpot en utilisant l’addon HubSpot de WPForms

Utiliser WPForms pour créer un formulaire HubSpot est un moyen plus facile et plus efficace de gérer les formulaires et les contacts sans avoir à jongler avec plusieurs extensions.

WPForms gère à la fois la création de formulaires et l’intégration à HubSpot en un seul endroit. Cela simplifie le processus car il vous donne accès au constructeur et aux modèles par glisser-déposer de WPForms tout en synchronisant automatiquement les données de vos formulaires avec HubSpot.

Note : Pour utiliser l’addon HubSpot dans WPForms, vous aurez besoin du plan Elite. En plus de l’addon HubSpot et de tout ce qui se trouve dans le plan Pro, vous pouvez utiliser l’extension pour un nombre illimité de sites WordPress et déverrouiller le support premium. Il est donc parfait si vous dirigez une agence de marketing.

La première chose à faire est d’installer et d’activer l’extension WPForms. Consultez notre guide détaillé sur l ‘installation d’une extension WordPress.

Lors de l’activation, vous devrez vérifier votre clé de licence dans WPForms  » Settings.

Vous pouvez trouver votre clé de licence dans votre compte WPForms. Cliquez simplement sur l’icône du presse-papier pour la copier. Ensuite, vous pouvez retourner dans votre onglet WordPress et remplir le champ ‘License Key’.

Cliquez sur le bouton « Vérifier la clé » pour activer votre plan.

Activating license key to WPForms

Maintenant, allons dans WPForms  » Addons depuis le tableau de bord d’administration pour installer l’addon HubSpot.

À partir de là, faites défiler vers le bas et localisez le module complémentaire HubSpot. Cliquez ensuite sur le bouton « Installer le module complémentaire ».

Installing the HubSpot Addon in WPForms

Après avoir activé l’addon, vous devez vous rendre dans le panneau  » Réglages  » de WPForms depuis le tableau de bord de WordPress, puis basculer vers l’onglet  » Intégration « .

Ici, vous pouvez connecter votre compte CRM HubSpot à WPForms. Il suffit de cliquer sur  » + Ajouter un nouveau compte  » et de saisir les détails de votre compte.

Adding HubSpott account to WPForms

Une fois cela fait, il est temps de créer et d’intégrer un formulaire HubSpot depuis WPForms.

Tout d’abord, vous devrez créer votre formulaire en naviguant vers WPForms  » Add New. Sur l’écran suivant, vous nommerez le formulaire et sélectionnerez un modèle de formulaire.

Ensuite, vous pouvez personnaliser le modèle à l’aide du Constructeur de formulaires.

Si tout semble déjà en ordre, n’hésitez pas à passer au panneau « Marketing ». De là, ouvrons l’option ‘HubSpot’ pour connecter le formulaire à la plateforme.

Adding new HubSpot connection in WPForms

Saisissez les détails de votre compte HubSpot et suivez les instructions de configuration.

Une fois cela fait, vous pouvez publier le formulaire en utilisant le bloc WPForms ou le shortcode du formulaire. Pour plus de détails, vous pouvez consulter notre guide sur la création d’un formulaire HubSpot dans Wordpress.

4. Comment intégrer Google Forms dans WordPress

WPForms et d’autres constructeurs de formulaires WordPress sont vraiment faciles à utiliser. Ils fonctionnent directement sur votre site WordPress et vous permettent de faire beaucoup de choses comme construire des formulaires qui acceptent les paiements, créer des formulaires de connexion, faire des formulaires d’enregistrement d’utilisateur personnalisés, et plus encore.

Mais il peut arriver que vous ayez besoin de partager un formulaire sur différents sites ou plateformes.

Dans ce cas, les formulaires Google peuvent s’avérer très pratiques. Ils sont faciles à partager, fonctionnent très bien sur les téléphones portables et permettent de conserver toutes les réponses en un seul endroit. De plus, vous pouvez ajouter des collaborateurs pour vous aider à rédiger les réponses, le tout étant stocké dans Google Drive.

Pour intégrer un formulaire Google dans WordPress, vous pouvez commencer par créer un formulaire sur le site de Google Forms. Cliquez simplement sur le bouton « Aller aux formulaires ».

The Go to Forms button in Google Forms

Sur l’écran suivant, vous verrez différents modèles de formulaires. Cliquez sur l’un d’entre eux pour commencer la construction.

Vous pouvez également partir de zéro en cliquant sur « Formulaire vierge ».

Google Forms' templates

Une fois que vous avez choisi un modèle, vous pouvez commencer à personnaliser le formulaire. Voici quelques exemples de ce que vous pourriez avoir à faire :

  • Créez le titre du formulaire.
  • Fournir la description du formulaire.
  • Personnalisez les champs en fonction de vos objectifs.
Adding fields to Google Forms

Vous pouvez également utiliser des outils d’intelligence artificielle pour choisir les champs les plus adaptés à vos questions.

Lorsque vous êtes satisfait de l’aspect du formulaire, cliquez sur le bouton « Envoyer ». Cela ouvrira une fenêtre pop-up dans laquelle vous pourrez obtenir le code d’intégration du formulaire.

Copying Google Forms' embed code

Après avoir copié ce code, vous pouvez ouvrir une page ou une publication dans WordPress où vous souhaitez afficher le formulaire.

Dans l’éditeur de contenu de la page ou de la publication, cliquez sur le bouton « + » et recherchez le bloc « HTML personnalisé ». Cliquez dessus pour l’ajouter à votre page.

Adding custom HTML block in WordPress

Ensuite, il suffit de coller le code d’intégration des formulaires Google dans le bloc HTML personnalisé.

Une fois que vous avez terminé, n’oubliez pas de cliquer sur le bouton « Mettre à jour » ou « Publier ». Maintenant, si vous visitez votre site, vous devriez voir le formulaire Google en action.

Google Form preview on a live WordPress site

Pour des instructions détaillées étape par étape, vous pouvez consulter notre guide sur l’intégration d’un formulaire Google dans WordPress.

5. Comment intégrer Zoho Forms dans WordPress

Zoho Forms est un outil formidable qui vous permet de créer facilement toutes sortes de formulaires. Qu’il s’agisse d’un formulaire de contact, d’un sondage, d’un formulaire d’inscription ou d’un formulaire de commande, Zoho Forms a tout ce qu’il vous faut.

De plus, il est facile d’intégrer un formulaire Zoho à votre site WordPress. Mais avant d’en arriver là, créons d’abord le formulaire.

Pour commencer, vous devez créer un compte sur le site de Zoho Forms. Cliquez simplement sur « S’inscrire gratuitement ».

Zoho Forms' homepage

Une fois que vous avez créé un compte, vous pouvez commencer à créer votre formulaire.

Tout d’abord, vous devez cliquer sur le bouton « Nouveau formulaire » dans le Constructeur de formulaires.

The New Form button in Zoho Forms

Vous verrez alors que Zoho Forms offre trois façons de créer des formulaires :

  • Créer des formulaires à partir de zéro en utilisant le type de formulaire standard ou de carte.
  • Utiliser des modèles de formulaires prêts à l’emploi.
  • Créer des formulaires CRM, une fonctionnalité qui n’est disponible que si vous passez au plan Pro.
Three ways to create Zoho Forms

Pour ce guide, nous choisirons le modèle « Commentaires sur le site ».

Cliquez donc sur le bouton « Utiliser ce modèle ».

Zoho Forms' Use this template button

Vous arrivez alors dans le Constructeur de formulaires de Zoho Forms.

Le panneau de gauche contient toutes les options de personnalisation, et l’aperçu du formulaire se trouve à droite. Vous pouvez ajouter des éléments à votre formulaire en les faisant simplement glisser et en les déposant.

Avec Zoho Forms, vous pouvez également changer le thème du formulaire pour qu’il corresponde à celui de votre site.

Pour ce faire, vous pouvez aller dans l’onglet « Thèmes ». Il vous suffit ensuite de survoler le thème que vous souhaitez utiliser et de cliquer sur « Appliquer ».

Applying Zoho Forms theme

Si tout semble déjà en ordre, vous pouvez passer à l’onglet « Partager ».

Dans cet onglet, vous pouvez voir que Zoho Forms offre de nombreuses options pour intégrer des formulaires.

Puisque nous allons l’intégrer dans un site WordPress, dirigeons-nous vers Embed  » Website Builders. Ensuite, cliquez sur le bouton « Go to WordPress ».

The Go to WordPress button in Zoho Forms

Vous serez alors redirigé vers la page Zoho Forms dans le répertoire des extensions WordPress.

Il vous suffit d’installer l’extension. Si vous avez besoin d’aide, vous pouvez consulter notre guide sur l’installation d’une extension WordPress.

Dès l’activation, vous pouvez ouvrir une publication ou une page dans laquelle vous souhaitez intégrer Zoho Forms. À partir de là, vous cliquerez sur le bouton  » +  » et sélectionnerez le bloc Zoho Forms.

Adding the Zoho Forms block to WP content editor

Une fois le bloc ajouté, vous pouvez cliquer sur le bouton « Accéder aux publicités Zoho ».

Il existe également le lien « Embed with permalink », mais nous ne recommandons pas cette méthode car elle n’est pas aussi conviviale pour les débutants.

The Access Zoho Forms button in Zoho Forms block

Ensuite, vous serez invité à choisir le domaine dans lequel vous avez enregistré votre compte Zoho.

Dans ce cas, nous choisirons"zoho.com » dans le menu déroulant et cliquerons sur « Connecter ».

Connecting Zoho account

Ensuite, vous pouvez choisir le formulaire que vous souhaitez intégrer.

Il vous suffit de cliquer sur le menu déroulant et de sélectionner l’une des options disponibles. Ensuite, faites défiler la page et cliquez sur le bouton « Intégrer ».

Embedding the Website Feedback form

Votre éditeur de contenu chargera alors votre formulaire Zoho.

Si vous aimez ce que vous voyez, cliquez sur le bouton « Enregistrer ».

Saving the post with Zoho Forms

Maintenant, si vous visitez la page, vous verrez votre formulaire Zoho en action.

Voici à quoi cela pourrait ressembler :

Zoho Forms on a live website

Dans l’image ci-dessus, vous pouvez également voir que le thème de Zoho Forms facilite l’harmonisation du formulaire avec le design de votre site.

6. Comment intégrer des formulaires d’inscription par e-mail dans WordPress

OptinMonster, bien qu’il ne s’agisse pas d’un constructeur de formulaires typique, est un excellent outil pour créer des formulaires d’inscription d’utilisateurs et construire une liste d’e-mails.

Chez WPBeginner, nous avons vu d’excellents résultats en utilisant cet outil de génération de prospects. Par exemple, avec OptinMonster, nous avons augmenté nos abonnés aux e-mails de 600%.

Lors de la mise en place de formulaires d’inscription par e-mail, vous pouvez utiliser différents types de campagne, tels que les slide-ins et les pop-ups lightbox. Avant de parler de l’intégration du formulaire d’inscription par e-mail d’OptinMonster, assurons-nous que ce formulaire est prêt.

Tout d’abord, vous devez créer un compte OptinMonster sur leur site en cliquant sur le bouton « Get OptinMonster Now ».

OptinMonster's homepage

Vous accéderez ainsi à la page des prix.

Nous recommandons le plan Pro parce qu’il est populaire et qu’il inclut la fonctionnalité ‘Exit Intent’. Vous pouvez également utiliser notre code promo exclusif WPBeginner OptinMonster pour obtenir 10% de réduction.

Pour finaliser votre achat, il vous suffit de saisir vos coordonnées de paiement et de procéder au paiement.

Ceci fait, installons et activons l’extension WordPress OptinMonster. Si vous avez besoin d’aide, consultez notre guide étape par étape sur l’installation d’une extension WordPress.

Cette extension permet de connecter votre site WordPress à OptinMonster. Il vous suffit de naviguer vers OptinMonster  » Paramètres à partir de votre panneau d’administration WordPress. Ensuite, cliquez sur « Connecter votre compte existant ».

Connect your existing account

Une fois connecté, vous êtes prêt à créer votre formulaire d’inscription par e-mail OptinMonster. Pour des instructions détaillées, vous pouvez lire notre guide sur la façon de construire votre liste d’e-mails dans WordPress avec OptinMonster.

Les règles d’affichage détaillées d’OptinMonster vous permettent de montrer la bonne campagne à la bonne personne au bon moment, ce qui contribue à augmenter les taux de conversion. Vous pouvez trouver ces paramètres en allant dans Règles d’affichage dans le générateur de campagne.

The Display Rules tab in OptinMonster

Ici, vous pouvez contrôler quand et où vos campagnes apparaissent en fonction du comportement des clients.

Vous pouvez également personnaliser les campagnes en fonction des différents publics, par exemple en affichant des mises en page différentes pour les utilisateurs de mobiles et d’ordinateurs de bureau.

Adding display rules to a marketing or advertising campaign

OptinMonster vous permet de définir des règles basées sur des jours ou des lieux spécifiques, de sorte que vous pouvez lancer des campagnes ciblées comme des offres pour le vendredi noir ou des popups sur le thème des vacances pour différents pays.

De plus, la technologie exit-intent d’OptinMonster permet de récupérer les internautes qui sont sur le point de quitter votre site. Cette fonctionnalité suit le comportement des utilisateurs et déclenche un message ciblé juste avant qu’ils ne quittent le site, ce qui vous permet de capturer plus d’abonnés à l’e-mail et d’augmenter les conversions.

Exit intent display rules

Lorsque vous êtes satisfait de tout, il est temps d’intégrer le formulaire de génération de prospects à votre site.

Il suffit de cliquer sur le bouton « Enregistrer » du constructeur pour lancer le processus.

OptinMonster's Save button

Après vous être assuré que vous avez enregistré vos modifications, vous pouvez passer à l’onglet « Publier ».

À partir de là, passez de l’état « Brouillon » à l’état « Publier ». Vous verrez alors que l’onglet « Publier » est devenu « Publié » et que l’icône de pause s’est transformée en coche.

Publishing OptinMonster popup

Vous pouvez maintenant fermer l’éditeur de campagne et naviguer vers OptinMonster  » Campagnes.

L’étape suivante consiste à changer le statut « En attente » en « Publier » pour votre pop-up d’inscription par e-mail. Il vous suffit de cliquer sur le lien « En attente » pour ouvrir le menu déroulant et sélectionner l’option « Publier ».

Changing OptinMonster campaign's status

Et voilà !

Maintenant, si vous visitez votre site, vous verrez le popup d’inscription à l’e-mail en action.

OptinMonsters' email sign up on a live website

7. Comment intégrer des formulaires de paiement dans WordPress

Si vous ne souhaitez vendre qu’un seul produit ou ne voulez pas mettre en place un panier d’achat complet, l’utilisation d’extensions eCommerce complètes comme Easy Digital Downloads ou WooCommerce peut s’avérer superflue. La création d’un simple formulaire de paiement est souvent une meilleure option pour accepter des montants personnalisés ou vendre quelques articles.

C’est là que WP Simple Pay peut vous aider.

WP Simple Pay

WP Simple Pay est le meilleur choix pour accepter les paiements Stripe sans avoir besoin d’une extension eCommerce complète.

Il vous permet également d’accepter d’autres modes de paiement, tels que les paiements par carte bancaire, Apple Pay, Google Pay, et plus encore. Il est idéal pour les organisations à but non lucratif, les petites entreprises et les bénévoles qui ont besoin d’une solution simple pour collecter des paiements.

Pour intégrer un formulaire de paiement, vous devez d’abord installer l’extension WP Simple Pay. Si vous avez besoin d’aide, vous pouvez consulter notre guide étape par étape sur l’installation d’une extension WordPress.

Lors de l’activation, il suffit de suivre l’assistant de configuration pour se connecter à Stripe.

Connecting your WordPress website to Stripe

Une fois connecté, vous êtes prêt à créer votre formulaire de paiement en utilisant WP Simple Pay.

Pour des instructions détaillées, vous pouvez suivre la première méthode de notre guide sur la création d’un formulaire WordPress avec des options de paiement.

Lorsque vous êtes satisfait de votre formulaire de paiement, cliquez sur le bouton « Publier ». Ensuite, vous pouvez copier le shortcode du formulaire pour l’intégrer dans votre publication ou votre page.

WP Simple Pay's shortcode

Dans l’éditeur de contenu de WordPress, il vous suffit de cliquer sur le bouton  » +  » et de sélectionner le bloc  » Shortcode « .

Ensuite, vous pouvez coller le shortcode du formulaire dans la zone de texte.

Adding a shortcode block in Gutenberg

Notez que WP Simple Pay crée votre formulaire de paiement en mode test par défaut. Cela signifie que vous ne pouvez pas encore accepter les paiements des internautes.

Pour y remédier, naviguons vers WP Simple Pay  » Formulaires de paiement dans le tableau de bord de WordPress. Ensuite, vous pouvez survoler le formulaire que vous venez de créer et cliquer sur « Modifier » lorsqu’il apparaît.

Editing WP Simple Pay form

Dans ce panneau, vous devez vous rendre dans la section « Paiements ».

Enfin, vous pouvez cliquer sur le bouton radio « Mode direct », puis sur « Mise à jour ».

Setting WP Simple Pay form to live mode

Et voilà comment vous intégrez un formulaire WP Simple Pay et commencez à accepter les paiements de votre public.

Voici ce que cela donne sur notre site de démonstration :

Buy Me a Coffee WP Simple Pay button on a live website

8. Comment intégrer les formulaires Formidable dans WordPress

Formidable Forms est un excellent outil pour créer des formulaires avancés, tels qu’un calculateur d’hypothèque, de paiement de voiture ou d’assurance-vie. Il propose 225+ modèles de formulaires que vous pouvez utiliser pour votre site WordPress.

Pour plus de détails sur la façon de créer un formulaire avec Formidable Forms, vous pouvez consulter notre revue complète de Formidable Forms.

Formidable Forms rend super facile de mettre vos formulaires sur n’importe quelle publication ou page. Une fois que vous avez fini de créer votre formulaire, vous pouvez cliquer sur le bouton  » Embed  » dans le constructeur de formulaires.

Formidable Forms' Embed button

Une fenêtre pop-up s’ouvre, dans laquelle vous pouvez sélectionner l’endroit où ajouter le formulaire. Il y a 3 options : ‘Sélectionner une page existante’, ‘Créer une nouvelle page’ et ‘Insérer manuellement’.

Si vous sélectionnez l’option « Insérer manuellement », vous devrez utiliser un peu de code. Cela peut être un peu intimidant pour les débutants, c’est pourquoi nous ne le recommandons pas.

Pour ce tutoriel, nous allons sélectionner « Sélectionner une page existante ».

Formidable Forms' Embed form options

Ensuite, une autre fenêtre contextuelle apparaît.

Ouvrez le menu déroulant et choisissez une page. Par exemple, nous avons choisi d’intégrer le formulaire à la page d’accueil de notre site de démonstration.

Choosing a page to embed Formidable Forms

Après avoir choisi la page, cliquez sur le bouton « Insérer un formulaire ».

Cela ouvrira l’éditeur de blocs de la page et vous devriez voir que le formulaire est déjà intégré à la page.

Formidable Forms embedded in the block editor

Vous êtes maintenant prêt à mettre à jour la page.

Allez-y et cliquez sur le bouton « Enregistrer ».

Voici ce que cela donne sur notre site de démonstration :

Formidable Forms on a live website

9. Comment intégrer Gravity Forms dans WordPress

Gravity Forms est une puissante extension de construction de formulaires pour WordPress, mais voici le hic : elle est uniquement premium.

Ce constructeur de formulaires dispose d’un large éventail de fonctionnalités et d’options de personnalisation. Il vous permet de créer de nombreux types de formulaires, tels que des enquêtes, des quiz, des inscriptions et des formulaires de commande.

Pour créer un formulaire à l’aide de Gravity Forms, vous devrez acheter l’extension sur le site de Gravity Forms.

Gravity Forms homepage

Ensuite, vous pouvez l’installer et l’activer sur votre site. Si vous avez besoin d’aide, consultez notre guide sur l’installation d’une extension WordPress.

Une fois l’activation effectuée, vous devrez vous rendre dans Gravity Forms  » Nouveau formulaire dans votre tableau de bord WordPress et cliquer sur  » Ajouter un nouveau « .

Creating a new form with Gravity Forms

Dans l’écran suivant, vous choisirez un modèle de formulaire.

Vous pouvez explorer cette fenêtre contextuelle pour trouver le modèle que vous souhaitez utiliser. Une fois le modèle trouvé, il vous suffit de le survoler et de cliquer sur le bouton « Utiliser le modèle ».

The Use Template button in Gravity Forms

Ensuite, vous serez invité à donner un nom à votre formulaire et à en rédiger une brève description.

Vous pouvez utiliser l’image suivante comme exemple :

Form name and description examples

Cliquez à nouveau sur « Utiliser le modèle » pour commencer à construire le formulaire.

Cela ouvrira le constructeur drag-and-drop de Gravity Forms, où vous pourrez personnaliser votre formulaire à l’aide des champs sur la droite.

Gravity Forms' form builder

Une fois que votre formulaire est prêt, vous pouvez cliquer sur le bouton « Enregistrer le formulaire » pour vous assurer que vous avez stocké toutes les modifications.

Ensuite, cliquez sur « Incorporer ».

Cela ouvrira 3 options pour intégrer votre formulaire Gravity Forms – dans une page existante, une nouvelle page, ou une méthode de shortcode pour les personnes utilisant l’éditeur classique.

Embedding Gravity Forms

Pour ce tutoriel, nous allons vous montrer comment intégrer Gravity Forms dans une page web existante.

À partir de là, sélectionnons le bouton radio  » Publication « . Ensuite, vous pouvez ouvrir le menu déroulant pour choisir une publication publiée sur votre site WordPress.

Embedding Gravity Forms into an existing post

Cliquez sur le bouton « Insérer un formulaire ».

Vous serez alors redirigé vers l’éditeur de contenu de la page, où vous serez invité à ajouter le bloc  » Formulaire « . Cliquez dessus.

The Gravity Forms block to add to content editor

Gravity Forms ajoutera alors le formulaire que vous venez de créer à la publication.

Vous remarquerez peut-être aussi qu’il inclut par défaut le « Titre du formulaire » et la « Description du formulaire ».

Gravity Forms includes title and descriptions by default

Si vous pensez que tout est prêt, il est temps de Gagner du temps.

Et voilà, vous avez créé et intégré un formulaire Gravity Forms à votre site.

Gravity Forms on a live website

10. Comment intégrer des formulaires Microsoft dans WordPress

Certaines personnes pourraient vouloir utiliser Microsoft Forms pour créer des formulaires parce que c’est un outil qu’elles connaissent déjà grâce à leur compte Office 365. De plus, il s’intègre automatiquement à d’autres produits Microsoft comme Excel, ce qui facilite la collecte et la gestion des données.

Microsoft Forms offre des options intégrées pour créer des enquêtes, des quiz et des sondages. Vous pouvez ensuite facilement intégrer les formulaires Microsoft 365 dans WordPress en copiant le code d’intégration du formulaire et en l’ajoutant à votre site WordPress.

Tout d’abord, vous allez créer votre formulaire à l’aide de Microsoft Forms dans votre compte Office 365.

Depuis la page d’accueil d’Office 365, cliquons sur  » Se connecter  » pour commencer.

Signing in to Ms 365

Une fois connecté, vous pouvez cliquer sur l’icône de menu dans le coin supérieur gauche de la page.

Recherchez ensuite la rubrique « Formulaires » et cliquez dessus.

Ms Forms

Cela ouvrira la galerie de modèles dans un nouvel onglet. Vous pouvez alors choisir les formulaires que vous souhaitez créer.

Microsoft Forms propose 4 formulaires : enquête, quiz, invitation et inscription. Pour ce tutoriel, nous choisirons l’option « Invitation ». Cliquez sur cette option.

Choosing form type

L’éditeur de Microsoft Forms s’ouvre dans un nouvel onglet. La première chose à faire est de choisir un modèle.

Vous pouvez explorer les options du modèle dans le panneau de gauche. Comme nous créons un formulaire d’invitation, nous disposons de 7 modèles prêts à l’emploi pour différents usages.

Pour ce tutoriel, nous utiliserons le modèle d’invitation de mariage. Voici à quoi ressemble le modèle par défaut dans l’éditeur :

Wedding invitation form

Si vous faites défiler le panneau de droite, vous trouverez les champs par défaut proposés par ce modèle.

Ce modèle comporte 4 champs prédéfinis pour les noms des utilisateurs, le nombre d’invités, les allergies alimentaires et les adresses e-mail.

Imaginons que vous souhaitiez ajouter d’autres questions. Dans ce cas, vous pouvez cliquer sur le bouton « + Insérer une nouvelle question » et choisir le type de question, comme « Date », « Classement », « Texte » ou autres.

Si vous souhaitez modifier celles qui existent déjà, il vous suffit de cliquer sur l’une d’entre elles, et les options de personnalisation apparaîtront.

Editing a field

Pour modifier l’aspect et la convivialité, vous pouvez cliquer sur l’icône de la palette.

À partir de là, vous pouvez modifier la mise en page du formulaire et l’image de fond.

Styling wedding invitation form

Vous pouvez ensuite passer à l’onglet des paramètres en cliquant sur l’icône de l’engrenage.

Microsoft Forms a déjà configuré certains paramètres de base.

Cependant, vous pouvez activer l’option « Date de fin » pour vous aider à planifier stratégiquement le jour de votre mariage en fonction des réponses et l’option « Recevoir une notification par e-mail pour chaque réponse » pour disposer de données de sauvegarde afin d’éviter que la réponse ne se perde.

Si vous le souhaitez, vous pouvez également modifier le message de confirmation prédéfini.

Configuring wedding invitation form

Une fois le formulaire prêt, il est temps de le lancer.

Dans le Constructeur de formulaires, cliquons sur le bouton « Collecter les réponses ».

Collect responses button

Dans la fenêtre qui s’affiche, vous pouvez cliquer sur l’icône « </> » ou « embed ».

Vous devriez maintenant voir le shortcode que vous avez ajouté à votre site. Cliquez sur « Copier ».

Copying MS Forms shortcode

Vous pouvez maintenant coller ce code dans une publication ou une page à l’aide du bloc « HTML personnalisé ».

Dans l’éditeur de contenu de WordPress, il suffit de cliquer sur le bouton  » +  » pour ajouter le bloc. Ensuite, vous pouvez utiliser la barre de recherche pour rechercher le bloc  » HTML personnalisé « .

Allez-y et cliquez dessus pour ajouter le bloc à l’éditeur de contenu.

Adding custom HTML block

A partir de là, vous allez coller le shortcode de Microsoft Forms dans la zone de texte.

Ne vous inquiétez pas si vous ne voyez pas d’aperçu dans votre éditeur ; le shortcode fonctionne parfaitement.

Embedding Ms Forms shortcode

Vous pouvez maintenant cliquer sur le bouton « Publier » ou « Mettre à jour » pour l’En direct.

Voici ce que cela donne sur notre site de démonstration :

Microsoft Forms on a live website

11. Comment intégrer des formulaires HTML dans WordPress

Les formulaires HTML sont généralement codés à la main. Vous ne disposez donc pas d’un éditeur de type « glisser-déposer » pour modifier votre formulaire.

Heureusement, il existe des extensions de formulaires qui rendent la configuration des formulaires HTML plus infaillible. L’une des meilleures options est l’extension HTML Forms. Cette extension est idéale pour mettre en place des formulaires de contact simples qui vous aident à recueillir des informations auprès des internautes.

The form code editor in HTML Forms

L’avantage est qu’il n’est pas nécessaire de savoir coder pour utiliser les formulaires HTML.

Il est facile d’ajouter un nouveau champ. Il suffit de choisir une des options disponibles, et HTML Forms vous demandera d’ajuster les données du champ.

Adding a dropdown field in HTML Forms

Après avoir cliqué sur le bouton « Ajouter un champ au formulaire », HTML Forms convertit les données en extrait de code HTML et le place dans la zone « Code du formulaire ».

Et c’est tout ! N’oubliez pas de cliquer sur le bouton « Enregistrer les modifications » pour enregistrer vos progrès.

Il est maintenant temps de publier le formulaire.

Les formulaires HTML vous permettent d’intégrer facilement votre formulaire dans n’importe quelle publication, page ou zone de widget. Pour ce faire, vous aurez besoin du shortcode du formulaire. Vous pouvez trouver le shortcode de votre formulaire dans la partie supérieure du panneau « Editer le formulaire ».

HTML Forms' shortcode

Copions ce shortcode dans le presse-papiers.

Vous pouvez ensuite ouvrir une page ou une publication dans laquelle vous souhaitez afficher le formulaire HTML. Pour ce tutoriel, nous ajouterons le formulaire à notre page « Contact ».

Une fois dans l’éditeur de blocs, il vous suffit de cliquer sur le bouton « + » et de rechercher « HTML personnalisé », puis de cliquer dessus pour l’ajouter à votre page.

The custom HTML block

Vous pouvez ensuite coller le shortcode dans le bloc « HTML personnalisé ».

L’Éditeur de blocs de WordPress ne vous montrera pas le formulaire. Mais ne vous inquiétez pas. Il apparaîtra sur la page lorsque vous l’enregistrerez.

Adding HTML Forms shortcode

Appuyons donc sur le bouton « Enregistrer » pour le voir à l’œuvre.

Voici à quoi cela pourrait ressembler sur votre site :

HTML Forms on a live website

Pour des instructions détaillées, vous pouvez consulter notre guide sur l’ajout de formulaires HTML sur WordPress.

Questions fréquemment posées sur l’intégration de formulaires WordPress

Vous avez des questions sur l’intégration de formulaires dans WordPress ? Voici quelques réponses rapides pour vous aider à démarrer.

Peut-on intégrer des formulaires dans WordPress ?

Oui. Vous pouvez facilement intégrer des formulaires dans WordPress à l’aide de diverses extensions, notamment WPForms, qui est le meilleur constructeur de formulaires polyvalent.

Comment installer un formulaire dans WordPress ?

Tout d’abord, vous devez vous rendre dans la section «  Plugins  » «  Ajouter une nouvelle «  de l’interface d’administration de WordPress. L’étape suivante consiste à trouver une extension de formulaire de votre choix, puis à l’installer et à l’activer. Une fois cela fait, vous utiliserez l’extension pour créer un formulaire et l’intégrer sur votre site à l’aide d’un shortcode ou d’un bloc.

Comment configurer WPForms dans WordPress ?

Pour configurer WPForms, vous devez d’abord installer et activer l’extension WPForms. Ensuite, vous pouvez créer un nouveau formulaire à l’aide du constructeur par glisser-déposer et intégrer le formulaire sur votre site à l’aide d’un shortcode ou du bloc de l’extension.

Comment créer un formulaire dans WordPress sans extension ?

La création d’un formulaire dans WordPress sans extension nécessite du HTML et du PHP personnalisés. Vous pouvez ajouter manuellement le formulaire HTML à votre page et gérer les soumissions avec un PHP personnalisé dans le fichier functions.php de votre thème. Comme cette méthode n’est pas adaptée aux débutants, nous vous recommandons d’utiliser un constructeur de formulaires à la place.

Nous espérons que cet article vous a aidé à apprendre comment intégrer des formulaires dans WordPress. Ensuite, vous pouvez consulter nos autres guides sur la façon de configurer le suivi des formulaires WordPress dans Google Analytics et sur la façon de suivre et de réduire l’abandon des formulaires.

Si vous avez aimé cet article, veuillez alors vous abonner à notre chaîne YouTube pour obtenir des tutoriels vidéo sur WordPress. Vous pouvez également nous trouver sur Twitter et Facebook.

Divulgation : Notre contenu est soutenu par les lecteurs. Cela signifie que si vous cliquez sur certains de nos liens, nous pouvons gagner une commission. Consultez comment WPBeginner est financé, pourquoi cela compte et comment vous pouvez nous soutenir. Voici notre processus éditorial.

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

L'ultime WordPress Toolkit

Accédez GRATUITEMENT à notre boîte à outils - une collection de produits et de ressources liés à WordPress que tous les professionnels devraient avoir !

Reader Interactions

Un commentaireLaisser une réponse

  1. Syed Balkhi

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

Laisser une réponse

Merci d'avoir choisi de laisser un commentaire. Veuillez garder à l'esprit que tous les commentaires sont modérés selon notre politique de commentaires, et votre adresse e-mail ne sera PAS publiée. Veuillez NE PAS utiliser de mots-clés dans le champ du nom. Ayons une conversation personnelle et significative.