Gravity Forms : Goûtez au meilleur plugin de formulaire

Attachez votre ceinture. Calez-vous bien au fond de votre siège. J’allume le contact et c’est parti : je vous embarque pour une balade à bord de la Rolls-Royce des extensions pour créer des formulaires.

Ce fameux bolide, c’est Gravity Forms (GF). Grâce à ce plugin éprouvé, vous allez pouvoir concevoir des formulaires plus ou moins complexes facilement, sans avoir besoin de coder.

Si on vous a déjà parlé de GF dans notre comparatif des meilleurs plugins de formulaires pour WordPress, je vais aller beaucoup plus loin aujourd’hui.

Dans cet article, vous allez découvrir l’extension en action, afin de déterminer si elle peut répondre à votre besoin.

Prise en main, champs à disposition, configuration d’un formulaire, intégration en page, ou encore aperçu des différents licences et de leurs limites : voici un bon aperçu du programme qui vous attend.

Prêt(e) à vous plonger dans les rouages de cette mécanique bien huilée ? En voiture !

Petite précision : les différents liens vers le site officiel de Gravity Forms sont des liens d’affiliation. C’est-à-dire que si vous achetez le plugin en passant par ces liens, WPMarmite touchera une commission. Et s’il n’y avait pas d’affiliation possible, je vous aurais présenté l’extension avec la même ferveur !

Initialement rédigé en avril 2020, cet article a été mis à jour en juin 2021.

Hébergez votre site chez o2switch

Faites comme WPMarmite, choisissez o2switch. Non seulement les performances sont au rendez-vous mais le support est exceptionnel.

ESSAYEZ O2SWITCH

Les champs disponibles avec Gravity Forms

Je vous le disais en introduction : les champs que proposent un formulaire représentent LE critère que vous devez regarder en premier, en particulier parce que certains plugins ne les ont pas tous, et d’autres les rendent payants.

Vous devez donc vous assurer que les usages que vous avez en tête seront possibles.

Si vous souhaitez faire un simple formulaire de contact, la plupart des extensions vous permettront de le faire facilement.

Mais dès que vous voulez avoir des champs un peu plus élaborés ou que vous voulez instaurer des logiques conditionnelles (on en parle plus loin), la sélection de plugins candidats se restreint.

Et la spécificité de Gravity Forms, étant payant, c’est qu’il propose l’intégralité des champs dès sa première licence. Il vous permettra de faire de nombreuses choses sans devoir investir pour autant dans une formule trop onéreuse.

Voici donc un aperçu de tous les champs à votre disposition quand vous aurez le plugin.

Les champs standards

Vous retrouverez dans cette partie les fonctions basiques d’un formulaire (10 au total). En gros, Gravity Forms n’a pas besoin de prémâcher le travail avec ces champs-là :

• Ligne de texte : vous laissez la possibilité à l’internaute d’entrer un peu de texte. C’est ce que l’on utiliserait normalement pour gérer le nom, le prénom, l’adresse mail, le site internet… Mais vous verrez qu’il existe de meilleures possibilités dans les champs avancés.
• Paragraphe : facile, vous laissez là une grande zone de texte. Si l’internaute venait à vous écrire un roman, il peut même étirer la zone d’édition vers le bas.
• Liste déroulante : l’internaute doit « dérouler » la liste afin de voir tous les choix possibles. À vous d’arbitrer si des boutons radio ne seraient pas plus appropriés, pour qu’on voie du premier coup toutes les options.

• Nombre : vous pouvez demander à votre utilisateur d’entrer un nombre. Vous pouvez même limiter la plage disponible (entre 30 et 50 par exemple). Si vous voulez aller plus loin, vous pouvez activer les « calculs ». Ainsi, un champ pourra se remplir en fonction de formules que vous aurez créées et qui reprennent les données d’autres champs.
• Cases à cocher : c’est le champ classique lorsque vous souhaitez laisser le choix entre plusieurs options. On le reconnaît dans la mesure où les cases à cocher sont carrées.
• Boutons radio : c’est l’alternative à la « liste déroulante ». Ici les cases sont rondes et une seule peut être sélectionnée.

• Masqué : vous vous en doutez, l’utilisateur ne verra pas ce champ. Le but est qu’au contraire ce soit un champ qui vous sera réservé, où vous pourrez mettre une valeur arbitraire, ou que vous pourrez utiliser pour récupérer des informations dont dispose Gravity Forms. Je vous parle ici de l’adresse IP de l’utilisateur par exemple. Personnellement, je ne me sers jamais de ce champ.
• HTML : là, c’est simple. Vous pouvez y écrire ce que vous voulez du moment que vous maîtrisez un tant soit peu le langage HTML. Vous pourriez ainsi écrire une introduction dans votre formulaire, ajouter une image, un fichier audio… Les possibilités sont illimités puisque vous pouvez y mettre ce que vous voulez.
• Section : c’est ce qui va vous permettre de séparer plusieurs parties d’un formulaire par des titres. Vous pourrez même écrire une petite description sous chacun des titres, permettant d’introduire au mieux la section suivante.
• Page : ce champ sera utile pour séparer votre (long) formulaire en plusieurs pages. L’internaute aura alors à cliquer sur « Suivant » pour passer à la page suivante. À utiliser avec parcimonie : n’allez pas mettre plein de pages, sinon l’internaute prendra peur en voyant que sa soumission devient interminable !

Voilà pour les champs « standards », passons maintenant aux champs avancés.

Les champs avancés

La spécificité de la plupart de ces champs est que Gravity Forms va vous faciliter la vie avec un formatage pratique.

• Nom : vous pourrez ici décomposer les champs qui composent l’identité de votre internaute. Vous pourrez demander un préfixe (Mr, Mme, Mlle, Dr. etc.), puis un prénom, un deuxième prénom, un nom de famille, et même un suffixe.
• Date : vous demanderez un jour précis au travers d’un champ à remplir ou d’un calendrier.

• Heure : ce champ vous servira à récolter une heure (au format 12h ou 24h). Cependant, si vous gérez des créneaux horaires, le mieux sera d’utiliser une liste déroulante.
• Téléphone : ici, vous pourrez récolter un numéro de téléphone et l’idée de base est bonne : Gravity Forms va vérifier que c’est bien un format valide. Mais cela ne marche que pour les numéros américains. Dès lors que l’on sélectionne le format « International », on peut même écrire des lettres et le formulaire est quand même soumis. Dommage.
• Adresse : vos visiteurs pourront entrer ici une adresse postale. Vous pouvez activer / désactiver les différents champs qui la composent : Adresse, Adresse ligne 2, Ville, État / Province / Région (inutile en France), Code postal, ou encore Pays.
• Site Web : cette fois-ci Gravity Forms va bien vérifier que le format est correct, du type https://www.wpmarmite.com par exemple.
• E-mail : il y aura là aussi une vérification du format. Mais en plus, vous pouvez activer la confirmation par e-mail. C’est-à-dire que l’internaute devra d’abord valider l’e-mail reçu pour que sa demande vous soit envoyée.
• Envoi de fichier : vous pourrez choisir ici entre un seul fichier ou plusieurs, le type d’extensions autorisées (jpg, png, pdf…), ou encore la taille limite. L’internaute pourra ainsi vous envoyer des ressources complémentaires.
• CAPTCHA : il vous faudra ici un compte ReCaptcha de Google (gratuit) afin de pouvoir l’activer et protéger vos formulaires contre le spam. Leur dernière version permet même d’identifier un utilisateur d’un robot sans avoir à entrer une suite de chiffres et de lettres, ou de cliquer sur des images.
• Liste : ce champ est particulier : c’est à l’internaute de remplir lui-même les éléments de la liste. Contrairement à la liste déroulante ou la liste multiple, pour lesquelles nous préparons les différentes options possibles en amont.
• Choix multiple : cela ressemble à une liste déjà déroulée où vous pouvez sélectionner plusieurs lignes. Je ne suis pas spécialement fan du format, je préfère encore utiliser des cases à cocher qui sont plus simples à mon avis.
• RGPD : afin d’être conforme au Règlement Général pour la Protection des Données (RGPD), ce champ permet d’ajouter une case à cocher pour laisser la possibilité à vos visiteurs d’accepter ou non votre politique de confidentialité.

Vous l’aurez compris, il y a un petit bémol quant à ces champs avancés : certains sont très spécifiques aux États-Unis et ne correspondent pas à nos besoins.

Et il est difficile de les adapter sans toucher au code. C’est là le plus grand frein de Gravity Forms, à mon sens.

Mais regardons les autres types de champs qui nous sont proposés et qui changent radicalement l’utilisation que l’on peut faire de l’extension.

Les champs d’articles

Ces champs-là sont très pratiques dès lors que l’on souhaite laisser la possibilité à nos internautes de soumettre des articles invités. En effet, on peut leur faire un formulaire complet qui se connectera parfaitement à nos articles WordPress.

Vous pourrez configurer que toutes les soumissions aillent se mettre en brouillon. Et il ne vous restera plus qu’à aller le relire et l’éditer avant de le publier.

Vous pourrez également le supprimer et prévenir l’auteur si jamais vous ne souhaitez pas le mettre en ligne sur votre blog.

Voici les champs à notre disposition :

• Titre : tout comme lorsque vous écrivez un article sous WordPress, il s’agit du tout premier champ.
• Corps : votre auteur invité pourra ici rédiger son texte. Vous pouvez spécifier un nombre maximal de caractères à ne pas dépasser. Par contre, l’auteur n’a pas accès à une interface d’édition complète (ex : il ne peut pas ajouter des médias dans le corps du texte).
• Extrait : à vous de voir si vous utilisez ce champ ou non. Mais il pourra permettre à votre internaute de préciser un extrait, tout comme vous pouvez le faire dans l’administration de vos articles.
• Étiquettes : vos internautes pourront en soumettre plusieurs en les séparant d’une virgule. Hélas il n’y a pas d’autocomplétion : on ne suggère pas les étiquettes existantes lors de la saisie.
• Catégorie : vous aurez ici la liste déroulante des catégories existantes sur votre blog. Pas de mauvaise surprise, donc : l’article invité pourra uniquement sélectionner un élément existant.
• Image d’article : vous connaissez le principe : l’internaute n’aura qu’à envoyer son fichier grâce à ce champ.

• Champ perso : alors là, c’est plus spécifique et ça va dépendre de chacun. Je sais que personnellement je n’utilise pas les champs personnalisés. Par contre, certains de mes plugins mettent des valeurs et je ne vais pas les modifier. On va réserver cette option aux développeurs, si vous le voulez bien.

Il nous reste un type de champ, ceux qui rapprochent Gravity Forms d’un petit système de e-commerce.

Les champs de prix

En effet, si vous souhaitez faire un simulateur de prix ou bien un petit formulaire de commande, vous pourrez le faire avec le plugin.

Par contre cela ne sera jamais aussi complet qu’un vrai système de e-commerce (comme WooCommerce).

• Produit : ici vous pourrez créer un produit unique ou avec variation (différentes tailles de t-shirts, par exemple) et définir le prix.
• Quantité : ce champ-là est toujours relié à un champ de produit afin de savoir auquel il doit être appliqué.
• Option : on peut imaginer que vous proposiez différents types d’impression sur vos t-shirts (transfert, sérigraphie, broderie). Ce champ sera parfait et viendra rajouter des coûts à la commande totale.
• Livraison : de la même manière que les options, vous pouvez ici proposer différentes options de livraison avec chacune un prix correspondant.

• Total : ce champ n’a qu’un but : faire la somme de tous les produits, options et modes de livraison saisis dans le formulaire. Ainsi, l’internaute verra clairement combien la commande va lui coûter.

Ces champs pourront être utilisés comme simulateurs de prix ou comme bons de commande mais pas en tant que vrai système de e-commerce si vous ne prenez pas la licence Elite.

C’est en effet grâce à elle que vous pourrez utiliser les add-ons de passerelle de paiement tels que Paypal ou Stripe.

Et voilà ! Nous venons de finir le tour des champs disponibles. J’espère que vous avez ainsi pu mesurer jusqu’où on peut aller avec Gravity Forms. Intéressons-nous maintenant à son administration.

Prise en main de Gravity Forms

Création des formulaires

Ici, Gravity Forms reprend une interface de gestion plutôt classique : vous ne serez pas dépaysé, cela ressemble à du WordPress tout craché !

Vous pourrez ajouter, modifier ou améliorer les paramètres de chacun des formulaires que vous avez. Il est même possible de dupliquer un formulaire, ce qui sera extrêmement pratique si vous voulez des versions différentes pour plusieurs emplacements sur votre site.

Regardons maintenant à quoi ressemble l’interface d’édition en elle-même.

Ajouter et ordonner les champs

Ici, il vous faudra piocher dans les éléments disponibles à droite en cliquant dessus ou en les glissant-déposant vers la zone d’édition. Ensuite, vous pouvez les réorganiser de la même manière. Depuis la version 2.5 de Gravity Forms, il est désormais possible d’agencer les champs sur plusieurs colonnes (jusqu’à 4).

Pour modifier un champ, il vous suffit de cliquer sur celui-ci pour faire apparaître les paramètres correspondants.

Vous pourrez également cliquer sur l’icône des deux feuilles pour dupliquer un champ. Le pictogramme suivant mène également aux paramètres du champ. Quant au pictogramme en forme de croix, vous l’aurez deviné : il sert à supprimer un champ. Une fenêtre pop-in apparaîtra alors pour vous demander une confirmation.

Pour finir, vous pourrez mettre à jour toutes les modifications que vous aurez faites grâce au bouton bleu (ou la couleur que vous préférez sous WordPress) en haut à droite de l’écran.

Nous allons maintenant nous attarder un peu plus sur toutes les options disponibles pour éditer un champ.

Configurer un champ précis

Lorsque vous ouvrez les paramètres d’un champ, vous aurez accès à 3 onglets différents : Général, Apparence et Avancé.

Vous aurez très souvent des options spécifiques au type de champ que vous aurez sélectionné. Ainsi les paramètres du champ Liste déroulante ne sont pas du tout les mêmes que ceux du champ Section.

Section Général

Le champ Général vous permettra de modifier le label du champ (celui qui apparaîtra à l’écran) et de rajouter une description. Celle-ci correspondra à un petit texte introductif dans lequel vous pourrez ajouter des précisions.

Vous aurez ensuite des options spécifiques à chaque type de champ. Ainsi, vous le voyez sur la capture ci-dessus, je peux préciser les éléments de ma liste déroulante. Alors que pour le champ Nom, j’aurais pu permettre à mes internautes de décliner leur identité en plusieurs parties (Prénom, Nom…).

Pour finir, c’est une case à cocher et non des moindres qui nous attend à la fin de cet onglet : la case Nécessaire. Cela permet de rendre un champ obligatoire et je peux vous dire que vous l’utiliserez souvent !

Section Apparence

Du côté de l’onglet Apparence, nous aurons également des options spécifiques. Mais il y en a deux que vous verrez très régulièrement :

• Classe CSS personnalisée, où vous pouvez agir finement sur l’affichage des différents composants de vos formulaires. Mais si vous voulez jouer avec ces options, il faudra connaître les classes CSS de Gravity Forms. Ou plutôt installer l’extension gratuite CSS Ready Classes for Gravity Forms. Cela vous évitera de regarder la documentation à chaque fois.
• La taille du champ est également un élément récurrent. Vous pourrez ici définir qu’un champ soit de petite taille, de taille moyenne (par défaut), ou encore grand. Cela fera varier la largeur qu’il prendra à l’écran.

Si vous souhaitez vous affranchir du design par défaut de vos formulaires, je vous invite à consulter cet article : Comment styliser les formulaires de Gravity Forms.

Section Avancé

Et pour finir, vous trouverez l’onglet Avancé. Je dois vous avouer que je ne vais pas souvent modifier ses différentes options. En revanche, la toute dernière mérite qu’on lui consacre la section suivante de cet article.

Les logiques conditionnelles

Les logiques conditionnelles sont le plus souvent une fonctionnalité payante dans les extensions de formulaires. Ici, on n’échappe pas à la règle puisque Gravity Forms est payant.

Ce n’est pourtant pas un add-on qu’il faudra acheter en supplément, c’est une fonction native, et elle est très pratique.

Son fonctionnement est le suivant : elle permet de n’afficher certains champs que si certaines conditions sont remplies. Voici un exemple, si jamais j’étais boulanger avec un service de livraison :

• Si l’internaute me contacte pour une livraison à domicile, je vais lui demander son adresse postale.
• Si, par contre, il vient retirer sa commande en magasin, je n’ai pas besoin de lui demander ces informations. Je ne fais alors pas apparaître le champ.

Regardez donc ce que ça donne pour l’internaute :

Autant vous dire que cette fonctionnalité est très pratique. On peut citer deux grandes raisons :

• Vous pouvez adapter le niveau de détail d’information que vous souhaitez obtenir en fonction des choix de votre visiteur ;
• Et vous pouvez avoir un formulaire pertinent, sans champ inutile, tout en restant « sobre » au premier abord. Ce n’est que si certaines conditions sont remplies que les champs complémentaires apparaissent.

Nous venons donc de voir comment créer et éditer des formulaires. Mais maintenant nous allons voir tous les autres paramètres importants afin de créer des formulaires aux petits oignons.

La gestion, formulaire par formulaire

Maintenant que tous les champs de notre formulaire sont prêts, il faut gérer le comportement de ce dernier lorsqu’on va le compléter.

Voici donc les paramètres que vous trouverez, formulaire par formulaire, qui vont vous permettre de gérer la façon dont les internautes vont interagir.

Réglages d’un formulaire

Les paramètres « généraux » d’un formulaire sont intéressants pour faire un peu de mise en forme (vraiment un peu) et pour gérer l’affichage.

Tout d’abord, on peut personnaliser l’emplacement des libellés. On peut choisir s’ils vont être au-dessus, à gauche, ou encore à droite des champs.

On peut également le faire pour les descriptions des champs (au-dessus ou au-dessous), ainsi que pour les « sous-libellés » (notamment les champs Prénom / Nom).

Un autre paramètre important est l’apparence du bouton Envoyer. Vous pouvez :

• soit le laisser en texte, soit mettre une image à la place ;
• soit changer son libellé. Un indice : « envoyer », c’est vraiment aseptisé, on peut faire mieux.

Pour tout vous dire, je préfère modifier l’apparence du bouton en CSS plutôt que de jouer avec une image. Cela demande un peu de technicité (la formation CSS Express d’Alex est là pour ça) mais cela reste plus facilement modifiable.

Apprenez le CSS une bonne fois pour toutes

Créez des sites au rendu impeccable sans y passer des heures avec CSS Express.

Découvrir la formation

On peut également créer une logique conditionnelle qui empêchera l’apparition du bouton de fin de formulaire tant que certaines conditions ne seraient pas remplies.

Vous pouvez aussi activer Enregistrer et continuer. Cette fonctionnalité permet à l’internaute de commencer à remplir son formulaire, puis d’y revenir plus tard s’il manque de temps.

On peut aussi jouer avec les restrictions, que ce soit en termes de nombres d’entrées ou de programmation horaire.

Si, par exemple, vous voulez faire un jeu-concours où les 50 premiers gagneront un lot, c’est parfait. Et si en plus vous désirez que le formulaire n’apparaisse que tel jour, à telle heure, alors là vous pouvez utiliser les deux fonctions conjointement.

Vous pouvez aussi indiquer que l’internaute doit être connecté pour pouvoir envoyer le formulaire.

En avant-dernier paramètre, vous pouvez activer « l’anti-spam honeypot » qui va empêcher les robots de vous envoyer de faux messages. Je ne sais pas si ça m’est spécifique, mais même avec l’option désactivée, je n’ai jamais eu de faux messages.

Pour finir, vous pouvez activer les transitions animées. Elles seront notamment utilisées lors de logiques conditionnelles pour faire apparaître joliment les nouveaux champs, cachés jusqu’alors (on a vu ça avec notre exemple de commande de boulanger).

Bon, tout ça c’est bien, mais lorsqu’un internaute complète un formulaire, que se passe-t-il ? C’est là le rôle du paramètre suivant.

Les confirmations

Quand un internaute clique sur le bouton Envoyer (que vous aurez renommé, pour l’adapter à la nature du formulaire), il peut se passer deux choses :

• Soit les champs disparaissent et un message de confirmation arrive à la place ;
• Soit l’internaute est redirigé vers une autre page.

Gravity Forms nous permet de le gérer au travers des confirmations et vous pouvez en avoir plusieurs.

Plusieurs ? Eh bien oui, en utilisant des logiques conditionnelles (là encore), vous pourrez définir que si un visiteur a choisi telle option, il sera redirigé sur telle page. Et s’il a choisi l’autre… (roulement de tambours), il sera redirigé sur une autre page.

Il existe 3 types de confirmations possibles :

• Texte, où vous pourrez personnaliser le message qui apparaîtra, une fois le formulaire envoyé.
• Page, où vous pourrez choisir la page de votre site où l’internaute sera redirigé.
• Redirection, où cette fois-ci vous pourrez préciser n’importe quelle URL. Même une qui ne serait pas sur votre site. À utiliser avec parcimonie tout de même : il serait bizarre d’être renvoyé sur un autre site lorsque l’on remplit un formulaire.

Je suis un très grand utilisateur du mode « Page » pour tout vous dire : j’aime pouvoir créer une page de remerciement spéciale à chaque formulaire.

Ça m’est également utile pour donner l’accès à certaines ressources (des programmes de formation par exemple) qui ne sont disponibles que pour les personnes qui m’ont laissé leurs coordonnées.

Bon, on a vu ce qu’il se passait lorsqu’un formulaire était envoyé, mais il y a encore un point important : les messages d’alerte que vous allez recevoir (et ceux que vous allez envoyer à la personne qui vient de vous contacter).

Les notifications

Cela se gère dans la partie Notifications des réglages du plugin. Et là encore, vous pouvez en avoir plusieurs. Soit pour créer des notifications doubles, soit pour utiliser des logiques conditionnelles.

C’est un cas que j’ai eu avec un client qui gère une présence nationale. Si l’internaute est localisé dans la Haute-Garonne par exemple, on va le deviner au travers de son code postal. Et pour tous les codes postaux compris entre 31000 et 31999, on enverra une notification au commercial concerné.

Je ne vous cache pas que c’est un peu lourd à gérer le jour où il faut faire tous les départements un par un (la fonction « dupliquer » prend tout son sens), mais ensuite on a un système aux petits oignons.

On peut aussi imaginer envoyer une notification à l’internaute pour qu’il ait une copie de sa demande. Et coupler ça avec une case à cocher en fin de formulaire intitulée « je veux recevoir une copie du formulaire par e-mail ». Ensuite on relie le tout avec une logique conditionnelle et le tour est joué.

On a ensuite à notre disposition tous les paramètres pour composer l’e-mail de notification. Le sujet du mail, l’émetteur, le destinataire, d’éventuelles personnes en copie cachée… On a tout.

On peut même récupérer les informations des champs pour remplir ces paramètres-là.

C’est bon, nous avons paramétré les notifications et elles nous parviendront par e-mail. Mais on peut également les consulter directement dans le tableau de bord.

La consultation des messages dans WordPress

C’est une fonctionnalité bien pratique et proposée par défaut dans Gravity Forms : vous pouvez consulter dans une même interface toutes les entrées que vous aurez reçues. Et ce, formulaire par formulaire.

Pour cela, allez dans Formulaires > Entrées et vous aurez une liste de toutes les soumissions. On peut ensuite changer de formulaire grâce à la liste déroulante présente en haut à gauche, au niveau du titre du formulaire (sur l’exemple, Formulaire de contact).

Relativisons : il ne s’agit là que de consulter des archives, vous aurez probablement déjà eu toutes les notifications dans votre boîte de réception auparavant !

On est presque prêts maintenant, le formulaire est bien configuré et il ne nous manque qu’une chose : que vos visiteurs l’utilisent.

Pour cela, il va falloir le faire apparaître sur votre site.

Formez-vous à WordPress en 3 mois

Apprenez à concevoir des sites WordPress sécurisés, rapides et conformes aux obligations légales avec la formation à distance la plus généreuse du marché (éligible au CPF).

Découvrir le programme

Intégrer les formulaires sur votre site

Deux emplacements sont possibles pour vos formulaires : dans le contenu, ou dans un widget. Découvrez les deux façons de faire.

Intégration dans les pages (et tout autre type de contenu)

Commençons par une insertion dans le contenu et notamment dans une page « Contact » par exemple. C’est quand même le cas le plus courant.

Allez donc dans votre page comme vous le feriez d’habitude, puis sélectionnez le bloc Gutenberg appelé Formulaire.

Gutenberg étant l’éditeur natif par défaut de WordPress depuis l’apparition de sa version 5.0, on vous fait logiquement une démonstration avec lui. Cependant, Gravity Forms s’utilise aussi sans problème avec l’ancien éditeur de WordPress (TinyMCE).

En cliquant dessus, vous pourrez ensuite sélectionner le formulaire de votre choix, puis ses champs apparaîtront au sein de votre éditeur.

Au niveau des réglages du bloc Gutenberg, vous serez en mesure d’activer ou non certaines options.

Vous pourrez par exemple afficher le titre ou la description (que vous aurez paramétré au préalable), ou vous pourrez encore activer l’AJAX.

Cela signifie que si jamais il y a une erreur dans un champ ou que l’internaute valide son formulaire, il n’y aura pas besoin de recharger la page. C’est donc une expérience utilisateur plus sympathique.

Il y a une petite limite, cependant : si vous utilisez un captcha, vous ne pourrez pas utiliser cette fonction.

Mais au delà des formulaires au sein du corps d’une page, on peut également les avoir dans une barre latérale (sidebar) ou au sein d’un pied de page (footer). Et devinez comment ?

Intégration d’un formulaire Gravity Forms dans un widget

Si vous allez dans Apparence > Widgets, vous verrez qu’il y a un nouveau widget, sobrement intitulé Formulaire.

Vous pouvez alors le faire glisser dans la zone de widgets de votre choix et vous aurez des options similaires à l’insertion dans une page.

Vous choisirez le formulaire en question, ajouterez un titre de widget, afficherez le titre du formulaire ou encore la description. Là encore, vous pourrez activer l’AJAX dans les options avancées.

Une option très intéressante est incluse : celle de gérer l’index de tabulation. Dit comme ça, ce n’est pas très parlant. Mais en fait, c’est très pratique.

Lorsque vous avez deux formulaires sur une même page – disons un formulaire de contact et un pour s’abonner à la newsletter en pied de page – un conflit apparaît. Si vous utilisez la touche « Tab » de votre clavier, vous n’irez pas d’un champ à l’autre comme vous l’imaginez, mais d’un formulaire à un autre.

Et c’est très frustrant ! D’où cet index de tabulation où vous pourrez donner un chiffre différent. Par exemple « 2 ». Histoire que le formulaire de contact de votre page soit à 1 et que sa valeur soit différente du formulaire en widget. Ainsi, plus de conflit !

Voici la fin de la prise en main, il ne nous reste qu’un détail pour finir cette présentation de Gravity Forms : son prix.

Se procurer Gravity Forms

Je vous l’ai dit tout à l’heure, il faudra forcément mettre la main à la poche pour utiliser toutes les fonctionnalités de Gravity Forms. C’est sa particularité. Mais par contre vous en aurez pour votre argent.

À côté de ça, j’ai testé les extensions disponibles sur CodeCanyon (dans le comparatif sur les plugins de formulaire), et malgré qu’il faille payer dès le début également, elles ne lui arrivent pas à la cheville.

Gravity Forms propose ces trois offres :

• La licence « Basic » à 59 $ (environ 48 €). Elle n’est valable que pour un seul site et vous donne accès aux add-ons Basic. Ces add-ons permettent d’intégrer Gravity Forms à des services d’emailing (Mailchimp, ActiveCampaign, AWeber etc.) pour gérer l’abonnement à une newsletter. En gros, une licence Basic permet d’utiliser GF pour gérer vos formulaires de contact, de devis, accueillir des articles invités ou faire des simulateurs de prix. Mais pas beaucoup plus.
• La licence « Pro » à 159 $ (environ 130 €). Valable pour 3 sites, elle donne accès aux add-ons Basic et Pro. Parmi les add-ons Pro, on notera la possibilité d’intégrer Gravity Forms à un CRM (Agile CRM, Capsule CRM), ou encore de le lier à Dropbox.
• La licence « Elite » à 259 $ (environ 212 €). Il s’agit de la formule la plus chère et la plus complète. Vous avez la possibilité d’utiliser Gravity Forms sur autant de sites que vous le souhaitez, c’est illimité. Et en plus des add-ons Basic et Pro, vous avez aussi accès aux add-ons Elite. Vous pourrez ainsi utiliser l’extension pour faire des sondages, des questionnaires, du petit e-commerce et de l’automatisation vers d’autres services.

Ces trois formules vous donnent l’accès aux mises à jour et au support pendant un an.

Si vous êtes convaincu que c’est l’extension qu’il vous faut, alors vous pouvez cliquer sur le bouton ci-dessous pour aller l’acheter.

Consulter le site officiel de Gravity Forms :

Pour conclure : je ne peux plus me passer de Gravity Forms

J’ai longtemps été limité dans ce que je proposais à mes clients concernant les formulaires. C’était très frustrant…

Je n’étais pas vraiment à l’aise à l’idée de débourser 200 $ (environ 164 €) pour un seul plugin. Mais j’ai finalement sauté le pas et je ne le regrette pas.

Depuis, je sais que je n’ai plus de limites du côté des formulaires et le coût est finalement amorti en fonction du nombre de projets sur lesquels je travaille. C’est presque comme si mes clients me payaient la licence chaque année finalement !

C’est pourquoi je vous conseille vraiment d’investir dans Gravity Forms si vous souhaitez faire de bons formulaires. Et à terme, c’est même une « petite » dépense à côté de la sérénité et de la qualité des formulaires que vous pourrez réaliser.

J’espère que ce « tour du propriétaire » s’est montré à la hauteur de vos attentes.

Assez parlé de mon adulation pour ce plugin, maintenant c’est à votre tour ! Si vous utilisez déjà Gravity Forms, qu’est-ce que vous en pensez ? Est-ce que vous êtes satisfait ? Est-ce que vous comptez le garder ad vitam aeternam ?

Et si jamais vous ne l’avez pas encore, avez-vous maintenant envie de l’acheter ? Ou quelque chose ne vous plait pas ?

Comme d’habitude, la conversation continue en commentaires !

Recevez gratuitement les prochains articles et accédez à des ressources exclusives. Plus de 20000 personnes l'ont fait, pourquoi pas vous ?

Je m'inscris

À propos de l'auteur

Nicolas Richer

Je suis formateur WordPress chez WPChef et grand fan de Divi.