Comment ajouter un calculateur de paiement et une transaction limitée dans le temps au site Web Divi

Si vous souhaitez vendre des produits sur un site Web, vous pouvez ajouter des éléments pour augmenter le taux de conversion. C’est particulièrement vrai pour les gros articles comme les voitures. Soyons réalistes, tout le monde n’a pas assez d’argent (ou de discipline) pour payer 30 000 $en liquide pour une voiture. C’est pourquoi les calculatrices de paiement en ligne peuvent jouer un rôle clé dans le processus d’achat lorsque vous voulez acheter une nouvelle voiture. En plus de la magie des opérations mathématiques en coulisses, le calculateur de paiement peut également fournir à l’acheteur un outil pratique sur votre site Web pour aider le vendeur à vraiment augmenter le taux de conversion.
Une autre façon d’encourager l’utilisateur à cliquer sur le bouton est d’ajouter un minuteur de compte à rebours à l’offre en vedette afin que l’utilisateur puisse voir plus clairement que l’offre est sur le point d’expirer. Dans ce tutoriel de cas d’utilisation, je vais vous montrer comment ajouter des calculatrices de paiement et des offres limitées dans le temps à votre site Web. Pour ajouter une calculatrice de paiement, j’utiliserai le module module de calcul des champs et j’utiliserai Visual Builder pour personnaliser la conception afin de correspondre à la disposition de la page de financement du concessionnaire. Je vais également vous montrer comment utiliser les éléments de la mise en page de la liste des concessionnaires automobiles et les combiner avec un compte à rebours pour créer des offres spéciales limitées dans le temps.
Allons – y! Voici un aperçu du calculateur de paiement et des offres limitées dans le temps que nous allons créer: Contenu de ce tutoriel pour ce tutoriel de cas d’utilisation, vous aurez besoin du thème Divi Automotive dealer Layout Pack (Financing page and Advertising page layout), accessible à partir de Visual Builder. Module de champ de calcul plug – in explorer la fonction du module de champ de calcul plug – in est un outil puissant
Ajouter un raccourci de calculatrice de paiement à la page pour ajouter un raccourci de module de calculatrice de location à la page, retournez d’abord à la liste des modules et copiez le raccourci à côté du module de calculatrice de location. Ensuite, allez à votre page pour voir la mise en page de la page financement des concessionnaires automobiles. Sinon, créez une nouvelle page et importez la mise en page en utilisant Divi Builder. Localisez la section intitulée ressources. Cette section comporte une ligne et deux colonnes, un formulaire de contact à droite et un formulaire texte à gauche. Déplacez le formulaire texte dans la colonne de gauche en haut de la colonne de droite juste au – dessus du formulaire de contact.
Nous pouvons maintenant ajouter la calculatrice à la colonne de gauche en utilisant le Code court. Continuez à ajouter un nouveau formulaire de texte et collez le Code court dans la zone de contenu. Avant de commencer à modéliser les formulaires pour correspondre à la mise en page, je tiens à souligner que le plug – in contient des modèles pré – conçus que vous pouvez utiliser pour personnaliser l’apparence des formulaires. Vous pouvez accéder à cette option à partir des paramètres du module. Cependant, gardez à l’esprit que cela limite votre capacité d’écraser le modèle CSS dans les paramètres du formulaire texte. Par conséquent, je pense qu’il est préférable de garder le module sur le modèle par défaut et d’utiliser Divi Builder pour ajouter autant de styles que possible.
Utilisez le raccourci clavier pour aller au formulaire de texte et changer la couleur du texte en clair. Une façon rapide de faire correspondre le reste du texte à la mise en page est d’aller au module Blurb dans la colonne de droite et de copier le style de texte du corps utilisé. Ensuite, faites un clic droit sur le formulaire de texte dans la colonne de gauche et collez le style de texte du corps dans le formulaire. Cela mettra à jour la fiscalité
Le barème des prix doit préciser ce qui suit: Extraire les titres et sous – titres. Prix mensuel: 199 et ajouter ce qui suit en remplacement du texte de l’encadré contenu: 36 mois
Diminution de 2 000 dollars Dans les paramètres de conception, mettre à jour ce qui suit: taille du texte du corps: 28 Px hauteur de la ligne du corps: 0,2 emcustom fill: 20px top, 0px Bottom, 0px left, 0px right Pour créer une offre limitée dans le temps, nous ajouterons un compte à rebours au – dessus de la ligne de soumission de premier plan. Ajoutez d’abord une nouvelle ligne à la colonne et un module de minuterie à la ligne pour le compte à rebours. Faites glisser une nouvelle ligne sur la ligne au premier plan de l’offre. Supprime le remplissage supérieur de la section et supprime le remplissage supérieur et inférieur de la nouvelle ligne. Maintenant, mettez à jour les paramètres du minuteur de compte à rebours comme suit: titre du minuteur de compte à rebours: la transaction touche à sa fin couleur de fond: \ # c10f1b Police du titre: Teko taille du texte du titre: 50px numéro de police: Teko largeur: 500 Px alignement du module: ombres de la boîte du milieu: voir capture d’écran Vous devez ajouter un remplissage supérieur de 5% à la ligne sous le compte à rebours afin de laisser un peu d’espace pour respirer dans l’ombre de la boîte inférieure. Vérifiez maintenant les résultats finaux. Le plug – in de module de champ de calcul vous permettra de créer des modules pour calculer tout ce que vous voulez, mais la courbe d’apprentissage semble un peu raide pour les calculs avancés. Heureusement, la version gratuite du plug – in est livrée avec une calculatrice de location qui peut être utilisée immédiatement. L’ajouter à Divi est aussi simple que d’intégrer un code court et de mettre à jour certains paramètres. L’un des avantages de l’utilisation de la mise en page par défaut est que vous n’avez pas besoin
À partir de zéro, ajoutez d’autres éléments au site. La création d’offres spéciales limitées dans le temps est rapide et facile parce que nous utilisons la conception de listes de voitures pour le faire. J’espère que cela facilitera le processus d’ajout des éléments nécessaires pour améliorer le taux de conversion du site. J’ai hâte d’entendre vos commentaires. Bonjour!