Vous souhaitez générer plus de prospects sur votre site web ?
Les calculateurs en ligne sont un excellent moyen d’obtenir les coordonnées d’un visiteur afin de pouvoir le contacter au moyen de publicités personnalisées, d’e-mails, de lettres d’information et d’autres formulaires de marketing en ligne.
Dans cet article, nous allons vous afficher comment créer une calculatrice en ligne et commencer à générer plus de prospects pour votre site WordPress.
Pourquoi les calculatrices en ligne sont-elles de si bons outils de génération de prospects ?
Les calculatrices en ligne sont des outils utiles qui peuvent aider les internautes à résoudre un problème ou à répondre à une question. Mieux encore, vous pouvez demander l’adresse e-mail de l’internaute avant d’afficher leurs résultats, ce qui en fait un excellent moyen de générer des prospects.
Vous pouvez utiliser des calculateurs en ligne dans de nombreux secteurs et niches différents. Par exemple, dans le domaine de la santé et du bien-être, vous pouvez ajouter un calculateur d’IMC, puis encourager les internautes à acheter une offre de repas.
Si vous vendez à un public international, une calculatrice qui convertit les unités métriques en unités impériales peut vous permettre d’augmenter vos ventes en aidant les clients/clientes à vérifier si un produit est de la bonne taille ou du bon poids.
Vous pouvez également ajouter une calculatrice de prêt hypothécaire à votre site immobilier ou une calculatrice de paiement de voiture à votre site de concessionnaire automobile.
Les possibilités sont infinies, il est donc facile de comprendre pourquoi les calculateurs en ligne deviennent rapidement l’un des moyens les plus populaires de développer votre liste d’adresses électroniques.
Ceci étant dit, nous allons vous afficher comment créer une calculatrice en ligne et générer des prospects. Nous allons couvrir deux méthodes, et n’hésitez pas à utiliser nos liens pour passer à la méthode de votre choix :
Méthode 1 : Créer des calculatrices en ligne en utilisant WPForms (Recommandé)
La meilleure et la plus simple façon de créer une calculatrice en ligne pour votre site WordPress sans écrire une seule ligne de code est d’utiliser l’extension WPForms.
WPForms est le meilleur constructeur de formulaires de contact et le meilleur plugin de calcul disponible, avec plus de 6 millions d’installations. Il vous permet de créer tous les types de formulaires, y compris les formulaires conversationnels, les formulaires d’inscription des utilisateurs, et plus encore.
En outre, vous avez accès à une large plage de modèles de formulaires de calculatrice prêts à l’emploi afin que vous puissiez commencer à instaurer la confiance et à générer des prospects pour votre entreprise.
Note : Comme nous allons utiliser le module de calcul et le module de formulaires de prospects pour ce tutoriel, vous aurez besoin de la version WPForms Pro. Cette extension premium vous donne accès à des fonctionnalités avancées comme les rapports de formulaires et la logique conditionnelle. Cela dit, si vous voulez créer des formulaires de base, il y a une version gratuite que vous pouvez essayer.
Étape par étape : Installer et activer l’extension WPForms
Une fois que vous avez acheté WPForms Pro, allez-y et installez et activez le plugin dans votre Tableau de bord WordPress. Pour plus de détails, consultez notre tutoriel étape par étape sur l ‘installation d’une extension WordPress.
Une fois activé, vous devrez vous rendre sur WPForms » Addons. Cliquez ensuite sur le bouton « Installer le module ».
Puisque nous allons collecter des prospects, vous devrez également trouver le module Lead Forms Addon.
Cliquez ensuite sur « Installer le module ».
Ensuite, nous verrons comment créer une calculatrice en ligne afin que les utilisateurs/utilisatrices puissent l’utiliser pour effectuer des calculs et obtenir des estimations précises.
Étape par étape : Création du formulaire de calcul en ligne
Allez dans WPForms « Ajouter une nouvelle. Cela ouvrira le Constructeur de formulaires en ligne par glisser-déposer, où vous pourrez créer et personnaliser votre formulaire de calculatrice.
Ensuite, il suffit de donner un nom à votre nouveau formulaire en le tapant dans la case prévue à cet effet.
Vous pourrez ainsi vous référer ultérieurement à votre formulaire de calculatrice lorsque vous souhaiterez y apporter des modifications ou l’intégrer à une page ou à une publication.
En dessous, vous pouvez sélectionner un modèle qui vous convient. Dans le panneau de gauche, vous pouvez naviguer dans les différentes catégories sous l’option « Calculatrice ».
Par exemple, si vous gérez un site de salle de sport, vous pouvez choisir la catégorie « Fitness », mais si vous êtes concessionnaire ou agent immobilier, vous pouvez sélectionner la catégorie « Finance » afin de vous assurer que vos clients/clientes potentiels sont qualifiés pour vos produits ou services.
Avec une énorme liste de modèles, vous trouverez à peu près n’importe quel type de calculateur en ligne que vous recherchez. Mais pour les besoins de ce tutoriel, nous opterons pour le « formulaire de génération de prospects hypothécaires ».
Il suffit de survoler le modèle que vous souhaitez utiliser et de sélectionner « Utiliser le Modèle ».
À partir de cette page, vous accéderez à l’onglet Champs, où vous verrez le Constructeur de formulaires par glisser-déposer. Tous les champs disponibles se trouvent dans le panneau de gauche.
Si vous souhaitez ajouter un champ, faites-le glisser de la gauche vers la droite. À droite se trouve l’éditeur qui vous permet de voir visuellement à quoi ressemble le formulaire.
Avec le module complémentaire Lead Forms, vous verrez automatiquement des sauts de page. Avant chaque saut de page, un bouton « Suivant » permet aux utilisateurs/utilisatrices de passer à la page suivante une fois les champs obligatoires terminés.
Ils verront également une barre de progression en dessous qui divise le formulaire en sections digestes et améliore l’expérience des utilisateurs/utilisatrices.
Astuce : Vous pouvez regrouper les champs similaires sur chaque page et même inclure un titre en gros caractères gras indiquant le sujet de chaque page.
Le formulaire de calcul de l’hypothèque comporte les champs suivants :
- Valeur du logement
- Acompte
- Taux d’intérêt
- Période d’hypothèque
- Paiement mensuel du prêt hypothécaire
- Montant du paiement annuel
- Total des intérêts payés
- Paiement total du prêt hypothécaire
Si vous êtes un prêteur hypothécaire, ce modèle contiendra la plupart des champs que vous recherchez probablement. Cela dit, vous pouvez toujours ajouter ou supprimer des champs si nécessaire.
Par exemple, il peut être judicieux d’ajouter des champs à choix multiples qui demandent le « but de l’hypothèque ou du prêt » et le « type de propriété » que le compte recherche. Vous pourrez ainsi mieux répondre à ses besoins.
Lorsque vous ajoutez le champ, il vous suffit de naviguer jusqu’à l’onglet « Général » sous Options du champ et de modifier les options selon vos besoins.
Étape par 3 : Modification des calculs (facultatif)
Une fois tous les champs définis, vous pouvez ajouter ou modifier les calculs de ce Modèle. Dans ce formulaire, le calcul est contrôlé par le champ « Paiement total de l’hypothèque ».
Si vous cliquez sur le champ et passez à l’onglet « Avancé », l’option « Activer le calcul » devrait déjà être permutée. Si vous souhaitez conserver la formule de calcul originale définie dans le Modèle, vous pouvez ne pas modifier ce paramètre.
Toutefois, si vous souhaitez modifier la formule, vous pouvez changer les valeurs dans la zone de texte « Formule ».
Lorsque les utilisateurs/utilisatrices saisissent les détails, le formulaire calcule automatiquement les résultats en fonction des informations qu’ils ont fournies.
En haut de la boîte de formule, vous pouvez ajouter des fonctions arithmétiques telles que :
- Ajout (+)
- Soustraction (-)
- Multiplication (*)
- Division (/)
Chaque fois que vous insérez une formule, celle-ci doit être placée entre les parenthèses, qui peuvent être ajoutées en haut de la boîte de formule.
Il suffit de cliquer sur « Insérer un champ » pour voir apparaître la liste des codes associés à chaque champ.
Il existe d’autres règles que vous pouvez mettre en place, telles que la règle « et si, sinon ».
Par exemple, si vous utilisez une formule telle que Dépenses de logement/Revenu mensuel brut, vous pouvez dépasser le risque du candidat. L’utilisation de la règle if/else vous aide à refuser ou à accepter automatiquement des candidats en fonction du risque.
En savoir plus sur la façon d’utiliser les fonctionnalités de calcul pour votre cas d’utilisation spécifique, vous pouvez consulter la documentation du module complémentaire Calculs de WPForms.
Vous pouvez également cliquer sur le « tableau de bord » situé à côté de la case « Formule » pour voir toutes les règles et fonctions disponibles que vous pouvez ajouter.
Lorsque vous avez fini d’ajouter la formule, cliquez sur « Valider la formule » pour vous assurer que les calculs et la syntaxe sont corrects.
Étape par 4 : Réglages des options de contact
Dans votre formulaire de prospection pour les calculatrices en ligne, il est également judicieux de demander aux clients/clientes comment ils souhaitent être contactés. Vous pourrez ainsi assurer le suivi des prospects qui ont affiché de l’intérêt pour votre offre.
C’est également un endroit idéal pour ajouter des icônes. Cliquez simplement sur le champ à choix multiple. Vous devriez alors voir des options pour configurer les options à choix multiples. Si vous permutez le bouton « Utiliser les choix d’icônes », les icônes seront ajoutées à votre formulaire.
Vous verrez maintenant apparaître des cases « visage-sourire ».
Il suffit de cliquer sur la case du sourire dans le panneau de gauche, ce qui vous permet de choisir l’icône que vous souhaitez ajouter.
Un écran contextuel de sélecteur d’icônes apparaît. Vous avez le choix entre plus de 2 000 icônes.
Il vous suffit d’utiliser la barre de recherche et de taper l’icône que vous recherchez. Nous choisirons les icônes qui correspondent le mieux à nos options à choix multiples.
Vous pouvez également modifier le réglage de la « couleur de l’icône » dans le panneau de gauche.
Une fois que cette étape est terminée et que vous avez choisi toutes vos icônes dans le champ à choix multiples, voici à quoi cela devrait ressembler.
Une autre touche personnelle que vous pouvez ajouter à votre formulaire est un logo ou une image d’en-tête en haut de votre formulaire de calculatrice.
Il suffit de cliquer sur le champ Contenu et de le faire glisser sur le côté droit de l’éditeur/éditrices du formulaire.
Sélectionnez ensuite le champ Sélectionné.
Dans l’onglet « Général », vous pouvez cliquer sur le bouton « Téléversement des médias » pour téléverser le logo de votre entreprise.
Étape par étape : styliser le formulaire de la calculatrice
En outre, vous pouvez personnaliser le style de votre formulaire de prospect.
Pour ce faire, vous devez vous rendre dans Réglages » Formulaires de prospects.
Lorsque vous activez les « Réglages de style avancés », vous pouvez ajouter un conteneur autour des champs et du formulaire, en leur donnant des effets de style pour qu’ils ressortent davantage.
Vous pouvez également personnaliser la couleur des bordures des champs, de l’arrière-plan du conteneur et du texte.
Ajouter des icônes et personnaliser l’apparence de votre formulaire est un excellent moyen de lui donner un aspect net et professionnel.
Étape par 6 : Modification du message de confirmation
La dernière chose que vous aurez à faire est de revoir et modifier le message de confirmation. WPForms enverra automatiquement un message de confirmation qui résume les champs terminés par l’utilisateur, ainsi que les résultats des calculs.
Pour ce faire, vous devez vous rendre dans Réglages » Confirmations.
Vous pouvez choisir d’envoyer le message directement sur la page ou de rediriger le compte vers une autre page. Modifiez ensuite le message dans la zone de texte.
L’utilisation des balises intelligentes est un excellent moyen de personnaliser votre message en fonction des informations fournies par l’utilisateur.
Une fois que vous êtes satisfait de l’aspect de votre formulaire, cliquez sur le bouton « Enregistrer ».
De cette façon, vous ne perdez pas les modifications que vous avez apportées.
Étape par étape : Embarquer votre nouveau formulaire de calcul en ligne dans une page ou une publication WordPress
Ensuite, vous voudrez intégrer votre calculatrice en ligne dans l’une de vos pages ou publications WordPress.
Allez sur n’importe quelle page ou publication WordPress. Ici, vous pouvez cliquer sur le bouton « + » pour ajouter un nouveau module et choisir le module WPForms.
Sélectionnez ensuite le formulaire de calcul en ligne que vous venez de créer.
Le formulaire doit apparaître automatiquement sur la page.
Ensuite, cliquez sur « Publier » en haut de la page.
Vous avez bien ajouté votre calculatrice en ligne à votre site WordPress.
Confirmez simplement la Prévisualisation avant de terminer.
Il devrait ressembler à ceci.
Confirmez la validité du formulaire en vous assurant que tous les champs du formulaire et les calculs fonctionnent correctement.
Par exemple, voici à quoi ressemble le message de confirmation lorsque nous avons terminé le formulaire.
Étape par étape : Vue des entrées de formulaires
Si vous vous rendez dans WPForms » Entries et sélectionnez le nom de votre formulaire, vous verrez alors toutes les entrées de votre formulaire de calcul en ligne.
Vous pouvez facilement voir, modifier ou mettre à la corbeille chaque entrée. Si vous voyez l’entrée, vous ou votre équipe de vente pouvez trouver toutes les informations sur le prospect que vous recherchez.
Vous pouvez également exporter cette liste et la téléverser sur une plateforme d’automatisation du marketing ou la connecter à un plugin d’automatisation WordPress comme Uncanny Automator.
Cela vous permet de contacter les prospects après qu’ils ont envoyé le formulaire de calcul en ligne.
Pour en savoir plus, consultez notre guide sur la génération de prospects sur WordPress comme un pro.
Méthode 2 : Ajouter une calculatrice avec Formidable Forms (Avancé)
Une autre façon d’ajouter des calculatrices en ligne sur WordPress est d’utiliser l’extension Formidable Forms. Il dispose d’un constructeur de formulaires avancé par glisser-déposer et fait partie des meilleures extensions WordPress de calculatrices sur le marché.
L’extension est spécialisée dans l’aide à la construction de formulaires complexes avec des calculs avancés.
Par exemple, Formidable Forms est livré avec de nombreux modèles de calculatrices, y compris une calculatrice hypothécaire que vous pouvez ajouter à votre site immobilier IDX et une calculatrice d’IMC qui est idéale pour les blogs sur la santé et les sites de gymnastique.
Formidable Forms vous permet également d’ajouter des calculs conditionnels. Par exemple, en fonction des responsive de l’utilisateur sur un formulaire, vous pouvez indiquer à l’extension quelle formule elle doit automatiquement utiliser.
La première chose à faire est d’installer et d’activer les extensions Formidable Forms Lite (gratuite) et Formidable Forms (premium). Pour plus de détails, consultez notre guide sur l ‘installation d’une extension WordPress.
Une fois que vous avez fait cela, allez dans Formidable » Réglages globaux et sélectionnez » Ajouter une licence manuellement « .
Pour trouver votre clé de licence, il vous suffit de vous rendre sur le site de Formidable Forms.
Ensuite, connectez-vous à votre compte et rendez-vous sur la page « Téléchargements ».
À partir de là, il vous suffit de coller votre clé de licence dans le champ de votre site WordPress.
Confirmez-vous que vous avez bien cliqué sur le bouton « Enregistrer la licence », puis sur le bouton « Mettre à jour » en haut de la page.
Un message de réussite de l’activation de la licence s’affiche ensuite.
Étape par étape : Choisir un modèle de formulaire de calculatrice
Vous êtes maintenant prêt à créer votre première calculatrice en vous rendant sur Formidable » Formulaires puis en cliquant sur ‘+ Ajouter une nouvelle’.
Vous verrez maintenant tous les différents modèles de formulaires parmi lesquels vous pouvez choisir.
Sur la page, défilez vers le bas et sélectionnez la catégorie Calculatrice, où vous verrez tous les modèles de calculateurs disponibles que Formidable Forms propose.
Pour prévisualiser un modèle, il suffit de survoler celui-ci et de cliquer sur « Voir la démo ».
Lorsque vous êtes prêt à Premiers, survolez-la et cliquez sur « Utiliser le Modèle ».
Pour ce guide, nous utiliserons le modèle « Calculateur d’intérêts composés », mais vous pouvez utiliser n’importe quel modèle de calculatrice.
Vous verrez maintenant le modèle que vous avez choisi dans l’éditeur/éditrices de Formidable Forms.
Étape par étape : Conception de votre calculatrice en ligne gratuite
À partir de là, vous pouvez pointer et cliquer pour personnaliser n’importe quel champ du formulaire. Par exemple, si vous souhaitez modifier le libellé du champ ou la plage numérique du « Montant initial », cliquez sur ce champ pour le sélectionner.
Vous pouvez ensuite effectuer vos modifications en utilisant les Réglages du menu de gauche.
Pour ajouter des champs à la calculatrice, il suffit de sélectionner l’onglet « Ajouter des champs » dans le menu de gauche. Faites ensuite glisser le champ sur le modèle de calculatrice.
Par exemple, si vous souhaitez recueillir l’adresse e-mail de l’internaute, vous devez ajouter un champ dans lequel les internautes peuvent saisir cette information. Pour ce faire, faites glisser un champ « E-mail expéditeur » sur le modèle de calculatrice.
Cliquez ensuite sur le champ « E-mail » et apportez des modifications à l’aide des options « Réglages du champ ».
Vous pouvez généralement utiliser les réglages par défaut, mais pour générer autant de prospects que possible, il est conseillé de cocher la case « Prérequis ». Cela signifie que les internautes devront saisir une adresse e-mail afin de commander leurs résultats.
Vous pouvez continuer à personnaliser votre calculatrice en modifiant les valeurs des champs et même en ajoutant de nouveaux champs.
Étape par étape : Ajustement des calculs
Formidable Forms est livré avec des modèles prédéfinis qui ont déjà des calculs prédéfinis. Cela dit, si vous souhaitez ajuster les formules ou les valeurs, vous pouvez le faire.
Note : Si vous souhaitez conserver les calculs par défaut dans le Modèle, vous ne devez pas toucher aux champs avancés.
Pour vérifier les calculs, cliquez sur l’un des éléments de champ concernés par la formule. Lorsque vous cliquez sur un élément de champ, un numéro d’ID doit également apparaître.
Dans le panneau de gauche, vous devez aller dans l’onglet Options de champ » Avancées » . Sous » Valeur par défaut « , vous verrez la formule utilisée.
Ainsi, dans ce cas, nous voyons que ‘Total des intérêts composés’ a un ID de 20. La formule « [18]+[19] » indique que l’intérêt composé sur le principal + l’intérêt composé sur les dépôts est égal à l’intérêt composé total.
Si vous n’êtes pas sûr du numéro ID d’un champ particulier ou si vous souhaitez savoir quels champs vous pouvez ajouter à votre formule, il vous suffit de cliquer sur l’icône représentant trois points à côté de « Valeur par défaut ».
Sélectionnez ensuite le champ que vous recherchez dans le menu déroulant Liste des champs. Vous pouvez choisir n’importe quel champ et il sera ajouté à la « Valeur par défaut » pour être utilisé dans votre formule.
Il convient de garder à l’esprit que vous utiliserez tous les symboles mathématiques standard, tels que
- + pour l’addition
- – pour la soustraction
- * pour la multiplication
- / pour la division
- () pour regrouper certains calculs
- Math.pow() pour ajouter des exposants à une équation
Voici un exemple de ce à quoi il ressemble. Comme nous l’avons affiché précédemment, le [] est la notation des numéros d’ID.
Vous voudrez bien prévisualiser le formulaire pour vous assurer que les calculs fonctionnent correctement.
Lorsque vous êtes satisfait du formulaire de la calculatrice, cliquez sur le bouton « Enregistrer ».
Vous devriez voir apparaître un message vous demandant de donner un nom à votre formulaire.
Allez-y et donnez-lui un nom afin de pouvoir vous y référer ultérieurement. Cliquez ensuite sur le bouton « Enregistrer ».
Au bout de quelques instants, vous verrez apparaître un message indiquant que la mise à jour a été bien effectuée.
Étape par étape : Ajouter une calculatrice en ligne gratuite à WordPress
Vous êtes maintenant prêt à ajouter la calculatrice à n’importe quelle page ou publication de votre site WordPress. Vous devez vous rendre sur la page ou la publication où vous souhaitez ajouter votre formulaire de calculatrice.
Pour commencer, saisissez un titre pour la page de la calculatrice.
Une fois que vous avez fait cela, cliquez sur l’icône « + ». Sélectionnez ensuite le bloc « Formidable Forms ».
Lorsque le bon bloc apparaît, il suffit de cliquer dessus pour l’ajouter à la page.
Ensuite, vous devez ouvrir le menu déroulant « Sélectionné un formulaire » et sélectionner la calculatrice que vous avez créée précédemment.
WordPress chargera désormais automatiquement la calculatrice personnalisée.
À ce stade, vous pouvez continuer à modifier la page en ajoutant du texte, des images, une description de la calculatrice, des catégories et des identifiants, etc.
Lorsque vous êtes prêt à mettre la calculatrice en direct, cliquez sur le bouton « Publier » ou « Mettre à jour » dans le coin droit.
Votre nouvelle page de calculatrice est maintenant en direct sur votre site.
Voici à quoi cela ressemble sur notre site de démonstration.
Bonus : Obtenir plus de prospects avec OptinMonster
Votre prochaine tâche consiste à diriger les internautes vers la calculatrice en ligne gratuite afin d’augmenter le nombre d’abonnés/abonnés et de prospects pour le site de votre petite entreprise.
C’est là qu’intervient OptinMonster.
OptinMonster est le meilleur plugin WordPress de génération de prospects qui est livré avec des modèles conçus par des professionnels et un éditeur drag-and-drop que vous pouvez utiliser dans vos campagnes.
Il dispose également d’outils tels que des fenêtres surgissantes de type lightbox, des fenêtres diapositives, des comptes à rebours, des bannières d’en-tête et de pied de page, et bien d’autres encore.
Tous ces outils sont parfaits pour promouvoir votre calculatrice en ligne gratuite afin d’obtenir plus d’utilisateurs/utilisatrices et de conversions.
Si vous gérez une boutique en ligne, OptinMonster dispose également d’une fonctionnalité avancée d’Exit-Intent qui permet de convertir les internautes qui abandonnent en clients/clientes et abonnés/abonnées.
Pour en savoir plus, voyez comment nous avons augmenté nos abonnés/abonnées aux e-mails de 600 % avec OptinMonster.
Nous espérons que cet article vous a aidé à apprendre comment générer plus de prospects avec des calculatrices en ligne. Vous pouvez également consulter notre guide sur la façon d’augmenter le trafic de votre blog et notre choix d’experts des meilleurs services de marketing e-mail pour les petites entreprises.
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.
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!