Comment créer un formulaire de calcul WordPress avec WPForms

Une calculatrice donne à vos visiteurs une réponse instantanée et personnalisée, qu'il s'agisse d'un paiement hypothécaire mensuel, d'une estimation des frais d'expédition ou du nombre de calories qu'ils devraient consommer par jour.

Ce type d'interactivité maintient les gens sur votre page beaucoup plus longtemps qu'un bloc de texte ne le pourrait jamais. Cela vous donne également une raison naturelle de demander une adresse e-mail avant de révéler le résultat.

Ainsi, le même outil qui aide vos visiteurs peut également développer votre liste en même temps. Et vous n'avez pas besoin d'écrire une seule ligne de code pour en configurer un. Je vais vous montrer deux façons de créer une calculatrice dans WordPress avec WPForms.

Créez votre formulaire de calculatrice dès maintenant

Comment créer une calculatrice dans WordPress avec WPForms

Créer un formulaire de calculatrice avec WPForms prend environ cinq minutes, et les premières étapes sont les mêmes, que vous laissiez l'IA faire le gros du travail ou que vous partiez d'un modèle. Vous configurerez WPForms et le module complémentaire Calculations, puis choisirez la méthode de création qui vous convient.

Installer le plugin WPForms Pro

WPForms est l'outil de création de formulaires le plus convivial pour les débutants dans WordPress, et il sert également de plugin de calculatrice véritablement performant.

Il est livré avec plus de 2 100 modèles de formulaires, y compris toute une catégorie de formulaires de calculatrice prêts à l'emploi que vous pouvez adapter pour les prix, les devis, les indicateurs de santé, et plus encore.

Ce que j'aime le plus dans l'utilisation de WPForms pour les calculatrices, c'est que les calculs se font dans le même constructeur glisser-déposer que vous utilisez pour tous les autres formulaires. Il n'y a pas d'outil de calculatrice séparé à apprendre, et une fois qu'une formule est en place, elle met à jour le résultat en temps réel pendant que votre visiteur tape.

Les calculatrices fonctionnent grâce au module complémentaire Calculations, qui est disponible sur WPForms Pro et les versions supérieures. Pro débloque également la logique conditionnelle, la gestion des entrées et la bibliothèque complète de modèles, c'est donc le niveau que je recommanderais pour tout projet de calculatrice.

Pour commencer, achetez la licence Pro. Installez et activez ensuite WPForms sur votre site. Si vous n'avez jamais ajouté de plugin auparavant, voici des instructions étape par étape sur comment installer un plugin WordPress.

Passez à WPForms Pro maintenant !

Activer le module complémentaire Calculations

Le module complémentaire Calculations est ce qui transforme un formulaire ordinaire en une calculatrice fonctionnelle, c'est donc la pièce maîtresse que vous voudrez avoir en place avant de commencer à construire. Son installation prend quelques clics. Depuis votre tableau de bord WordPress, allez dans WPForms » Addons.

Tapez « Calculations » dans le champ Rechercher des modules complémentaires, puis cliquez sur Installer le module complémentaire et, une fois qu'il apparaît, cliquez sur Activer.

Avec le module complémentaire actif, vous êtes prêt à créer votre calculatrice, et vous pouvez le faire de deux manières : en laissant l'IA le créer pour vous ou en partant d'un modèle et en le façonnant vous-même.

Méthode 1 : Créez votre calculatrice avec l'IA (le plus rapide)

Avec WPForms AI, vous créez un nouveau formulaire, ouvrez le constructeur IA et tapez une description simple de la calculatrice que vous souhaitez.

Quelque chose comme « une calculatrice hypothécaire qui demande le montant du prêt, le taux d'intérêt et la durée, puis affiche le paiement mensuel estimé » est suffisant pour commencer.

Si votre demande implique des calculs, comme l'ajout de totaux, de taxes ou de frais de port, WPForms active le module complémentaire Calculations, écrit la formule et la place dans le champ qui affiche le résultat.

Vous décrivez le résultat souhaité, et l'IA assemble les champs et la formule pour y correspondre. C'est le moyen le plus rapide de passer de l'idée à un calculateur terminé.

Vous pouvez créer un formulaire complet simplement en le décrivant, examiner ce que l'IA a produit et demander des modifications ultérieurement pour créer des formules de calcul.

Une fois votre calculateur créé, vous voudrez généralement l'affiner, ce qui est exactement l'objectif de Smart Edit.

Méthode 2 : Créez votre calculatrice manuellement à partir d'un modèle

WPForms inclut une catégorie de modèles de calculatrices conçus pour des tâches courantes, vous n'avez donc que rarement à partir de zéro.

Vous choisissez celui qui se rapproche le plus de vos besoins, puis vous personnalisez les champs et la formule jusqu'à ce qu'ils correspondent. Voici à quoi cela ressemble du début à la fin.

Choisir un modèle de calculateur

Depuis votre tableau de bord WordPress, allez dans WPForms » Ajouter.

Donnez un nom à votre formulaire pour pouvoir le retrouver plus tard. Je vais appeler celui-ci « Calculateur hypothécaire ».

Faites défiler vers le bas jusqu'à la catégorie de modèles Calculateur pour voir les formulaires créés spécifiquement pour cette tâche.

Lorsque vous en trouvez un qui convient, survolez-le et cliquez sur Utiliser le modèle. Pour cette démonstration, j'utilise le modèle Formulaire de calculateur hypothécaire.

WPForms ouvre le constructeur de formulaires avec votre modèle chargé. Le panneau des champs se trouve à gauche, et un aperçu en direct de votre formulaire est à droite.

Parce que vous avez commencé à partir d'un modèle de calculateur, les champs et le calcul sont déjà en place, de sorte que le modèle fonctionne comme un calculateur dès son chargement.

Personnaliser les champs et le calcul

C'est ici que vous personnalisez votre calculateur. Vous pouvez utiliser le constructeur par glisser-déposer pour ajouter, supprimer ou réorganiser des champs, et ajuster la formule derrière le résultat.

Pour voir comment les calculs fonctionnent, cliquez sur le champ qui affiche votre total et ouvrez son onglet Avancé. La formule se trouve dans la boîte Calcul, écrite avec des opérateurs simples comme ceux que vous utiliseriez dans une feuille de calcul.

Vous pouvez la modifier directement, et si l'écriture d'une formule n'est pas votre fort, la documentation du module complémentaire Calculs vous guide pas à pas pour en configurer une.

La plupart des calculateurs ont également besoin d'un moyen de contacter la personne qui les utilise, j'aime donc ajouter un champ Nom et E-mail en haut du formulaire.

Vous pouvez les faire glisser depuis le panneau des champs. Pour vous assurer de bien capturer ces informations, sélectionnez chaque champ et activez Requis sous ses options Générales.

J'aime aussi mettre à jour le bouton de soumission pour qu'il convienne à un calculateur. Faites défiler jusqu'en bas de l'aperçu et cliquez sur le bouton Soumettre.

Cela ouvre Paramètres » Général, où vous pouvez changer le Texte du bouton de soumission pour quelque chose de plus clair comme « Calculer mes résultats ».

Lorsque tout semble correct, cliquez sur Enregistrer pour ne pas perdre votre travail.

Transformer votre calculateur en formulaire de prospects (facultatif)

Si votre objectif principal est de collecter des prospects, vous pouvez convertir l'ensemble en un formulaire de prospects qui affiche une question à la fois et ressemble davantage à une conversation. C'est une étape facultative, mais elle a tendance à augmenter les taux d'achèvement des calculateurs plus longs.

Depuis le générateur de formulaires, allez dans Paramètres » Formulaires de prospects. Il vous sera demandé d'installer le module complémentaire Formulaires de prospects, alors cliquez sur Oui, installer et activer.

Une fois qu'il est actif, activez Activer le mode formulaire de prospects.

WPForms vous informera qu'il est sur le point de restructurer votre formulaire dans la mise en page du formulaire de prospects. Cliquez sur Activer les formulaires de prospects pour confirmer.

La conversion de vos champs calculés dans le nouveau format prend quelques secondes, puis votre calculateur est prêt à être publié.

Modifiez votre calculatrice à tout moment avec Smart Edit

La plupart des calculateurs ont besoin d'un ajustement à un moment donné, peut-être un nouveau champ ou un taux mis à jour dans la formule. Lorsque cela se produit, Smart Edit vous permet d'apporter la modification en discutant au lieu de cliquer dans les paramètres.

Ouvrez n'importe quel formulaire dans le générateur et cliquez sur le bouton Smart Edit dans le coin inférieur droit. Un panneau de discussion s'ouvre, vous tapez la modification que vous souhaitez en langage clair, et appuyer sur Entrée la réalise.

L'avantage pratique pour les calculateurs est que Smart Edit peut ajouter des champs et ajuster les calculs en une seule requête.

Demandez-lui d'« ajouter une liste déroulante Taxe de vente et de l'inclure dans le total », et avec le module complémentaire Calculs actif, il construit la formule et l'attribue au bon champ pour vous.

C'est la même aide IA que vous obtenez lors de la création à partir de zéro, prête quand vous voulez modifier un formulaire que vous avez déjà créé.

Publiez votre calculatrice dans WordPress

Une fois votre calculateur créé, la dernière étape consiste à le mettre sur votre site. Vous pouvez l'ajouter à n'importe quelle page ou publication et le styliser avec l'éditeur de blocs pour qu'il corresponde au reste de votre design.

Créez une nouvelle page ou publication, ou modifiez-en une existante. Cliquez sur le bouton Ajouter un bloc et choisissez le bloc WPForms.

Sélectionnez votre calculateur dans la liste déroulante du bloc WPForms pour le déposer sur la page.

Lorsque vous êtes satisfait de son apparence, cliquez sur Publier ou Mettre à jour pour le rendre visible.

Avant de partir, testez le formulaire sur le front-end pour confirmer que le calcul fonctionne comme vous le souhaitez.

FAQ sur la création d'un calculateur WordPress

Nos lecteurs posent de nombreuses questions sur la création de calculateurs dans WordPress. Voici les réponses aux plus courantes.

Pourquoi ajouter un calculateur à votre site WordPress ?

Un calculateur permet aux visiteurs de calculer quelque chose sans quitter votre page, ce qui les maintient engagés et leur donne une raison de vous faire confiance. Voici quelques exemples où ils fonctionnent bien :

• Un site automobile peut ajouter un calculateur de paiement de voiture afin que les acheteurs puissent estimer les paiements mensuels avant de visiter.
• Un site de santé ou de remise en forme peut proposer un calculateur d'IMC pour aider les visiteurs à vérifier leur situation.
• Une boutique en ligne peut offrir aux acheteurs un calculateur de frais de port pour une estimation des frais de livraison à l'avance.

WPForms peut-il créer un calculateur avec l'IA ?

Oui. Si vous décrivez le calculateur que vous souhaitez dans le générateur d'IA, WPForms ajoute les champs, active le paramètre Calculs et écrit la formule pour vous.

Vous pouvez également utiliser Smart Edit pour ajuster les champs ou les calculs plus tard en tapant ce que vous souhaitez modifier. Ces fonctionnalités de calcul s'exécutent sur le module complémentaire Calculs, vous aurez donc besoin de WPForms Pro pour les utiliser.

Est-il difficile de créer sa propre calculatrice ?

Pas du tout difficile. Avec WPForms, vous pouvez créer un calculateur personnalisé sans aucun code, soit en partant d'un modèle, soit en le décrivant à l'IA.

Le générateur par glisser-déposer et la formule en temps réel s'occupent de l'aspect technique, vous pouvez donc vous concentrer sur ce que vous voulez réellement calculer.

Comment créer une calculatrice hypothécaire dans WordPress ?

C'est l'un des calculateurs les plus faciles à configurer. Après avoir installé WPForms Pro et le module complémentaire Calculs, commencez par le modèle de prêt hypothécaire ou décrivez-le à l'IA, puis ajustez les champs du montant du prêt, du taux d'intérêt et de la durée pour correspondre à vos besoins.

Si vous souhaitez comparer vos options au préalable, voici les meilleurs plugins de calculateur de prêt hypothécaire pour WordPress.

Puis-je créer un calculateur gratuit dans WordPress ?

Vous trouverez des plugins de calculateur gratuits, mais ils sont souvent limités dans ce qu'ils peuvent calculer ou dans l'apparence du formulaire.

WPForms vous offre beaucoup plus de flexibilité grâce au module complémentaire Calculs, qui gère tout, d'une simple somme à un estimateur de prix en plusieurs étapes.

Pour peser vos choix, jetez un œil aux meilleurs plugins de calculateur pour WordPress.

Ensuite, peaufinez ce que votre calculateur additionne

Si vous vendez des produits, vous pouvez le configurer de manière à ce que le prix change en fonction de ce que votre visiteur sélectionne, comme les options supplémentaires, les quantités ou les options de livraison. Voici comment modifier le prix total en fonction des options du produit avec WPForms.

Créez votre formulaire de calculatrice dès maintenant

Prêt à créer votre formulaire ? Commencez dès aujourd'hui avec le plugin de création de formulaires WordPress le plus simple.  WPForms Pro inclut de nombreux modèles gratuits et offre une garantie de remboursement de 14 jours.

Si cet article vous a aidé, suivez-nous sur Facebook et Twitter pour plus de tutoriels et de guides WordPress gratuits.