Come aggiungere una calcolatrice ipotecaria in WordPress (passo dopo passo)

Immaginate questo: un potenziale acquirente visita il vostro sito web. È entusiasta, ma forse anche un po’ sopraffatto. Che tipo di proprietà possono permettersi? Non sarebbe fantastico se potessero rispondere a questa domanda proprio lì, sul vostro sito?

Se operate nel settore immobiliare, l’aggiunta di un calcolatore di mutui al vostro sito web può darvi un grande vantaggio rispetto alla concorrenza. Permette ai potenziali acquirenti di case di stimare i loro pagamenti mensili e vi posiziona come una risorsa competente e utile.

In questo articolo vi mostreremo come aggiungere facilmente una calcolatrice ipotecaria in WordPress.

Perché aggiungere una calcolatrice ipotecaria in WordPress?

Un calcolatore di mutui consente agli utenti di ottenere una stima delle rate del mutuo, con il tasso di interesse e il periodo di ammortamento.

I visitatori possono semplicemente add-on informazioni come il valore della casa, il pagamento del giù, i tassi di interesse e così via. Dopodiché, il calcolatore calcolerà l’importo da pagare al mese.

Se state realizzando un sito web con annunci immobiliari IDX, un calcolatore di mutui vi aiuterà anche nella generazione di contatti. I visitatori possono utilizzare la calcolatrice, ma dovranno inserire il loro indirizzo email per salvare i risultati.

Ciò può anche ridurre la frequenza di rimbalzo, poiché i visitatori non devono visitare un altro sito per ottenere un calcolo del mutuo.

Anche iconsulenti finanziari, i broker di mutui o le banche e gli educatori di finanza personale possono trarre vantaggio dall’aggiunta di un calcolatore di mutui al loro sito.

Detto questo, vediamo come creare facilmente una calcolatrice ipotecaria in WordPress. Questo tutorial vi mostrerà due metodi adatti ai principianti con due diversi plugin per il calcolo dei mutui: WPForms e Formidable Forms.

È possibile utilizzare questi collegamenti rapidi per passare a un plugin specifico:

Metodo 1: Aggiungere una semplice calcolatrice ipotecaria per WordPress con WPForms

Il primo metodo consiste nell’utilizzare WPForms. Con i suoi oltre 1.800 template di moduli, questo plugin di trascina e rilascia permette di creare vari moduli, tra cui un calcolatore di mutui.

Questo metodo è consigliato a chi vuole solo creare un calcolatore di mutui semplice e reattivo, senza calcoli aggiuntivi per le tasse o l’assicurazione.

Prima di tutto, procedete all’installazione del plugin in WordPress.

Fatto ciò, andate su WPForms ” Impostazioni e inserite la chiave di licenza del vostro piano Pro dalla pagina del vostro account WPForms. Poi, fate clic su “Verifica chiave”.

Scegliere e personalizzare un modello di modulo di calcolo ipotecario

Una volta attivata la chiave di licenza, è necessario navigare in WPForms ” Aggiungi nuovo“.

Nella schermata successiva, è possibile assegnare un nome al nuovo modulo. Può essere un nome semplice come “Modulo di calcolo del mutuo”.

Scorrendo verso il basso, utilizzate la barra di ricerca per trovare un modello di modulo di calcolo ipotecario.

WPForms ha due template: Modulo per il calcolo del mutuo e Modulo per il calcolo del mutuo semplice. Entrambi i template forniscono funzionalità simili, ma hanno campi leggermente diversi.

Il template Modulo di calcolo ipotecario semplice è ideale per i siti immobiliari che vogliono aiutare i potenziali acquirenti a stimare rapidamente la rata mensile del mutuo.

D’altra parte, il modello di modulo di calcolo del mutuo fornisce una ripartizione completa dei dettagli del mutuo, compresi gli interessi totali pagati, la rata totale del mutuo e l’importo della rata annuale. Questo livello di dettaglio può essere utile per i clienti che desiderano comprendere appieno i propri obblighi finanziari.

Facendo clic su “Visualizza demo” è possibile vedere ogni modulo in azione. Potete scegliere uno dei due template, ma per gli scopi di questa esercitazione utilizzeremo il modulo Calcolatrice di mutui.

Una volta effettuata la scelta, è sufficiente fare clic su “Usa modello”.

A questo punto, apparirà un popup che vi dirà che avete bisogno dell’add-on Calcoli.

Fare clic su “Sì, installa e attiva” per continuare.

Si arriva così al builder del modulo trascina e rilascia. Come si può vedere, il template viene fornito con i campi della calcolatrice incorporati.

Questo template in particolare ha campi in cui gli utenti possono inserire il valore della casa (il costo totale della casa) e l’importo del pagamento anticipato (quanto l’acquirente paga in anticipo quando acquista un immobile).

Gli utenti possono anche utilizzare i cursori per inserire informazioni sul tasso di interesse e sulla durata del mutuo.

Dopo aver inserito queste informazioni, la sezione inferiore calcolerà automaticamente l’importo della rata mensile e annuale del mutuo dell’utente, il totale degli interessi pagati e la rata totale del mutuo.

La formula di calcolo si trova andando in “Opzioni campo” e navigando fino alla scheda “Avanzate” nel pannello di sinistra. In fondo, si trova la casella “Formula”.

Si consiglia di non apportare modifiche a questa sezione se non si è sicuri di farlo. Detto questo, WPForms ha un foglio informativo sui calcoli che potete usare se avete bisogno di aiuto.

Procediamo con la personalizzazione del modulo. Per aggiungere un nuovo campo, andare alla sezione “Aggiungi campi” nel pannello di sinistra. Quindi, è sufficiente trascinare e rilasciare qualsiasi campo nel costruttore del modulo.

Qui abbiamo aggiunto un campo ‘Nome’ al modulo per catturare il nome dell’utente.

Per personalizzare un campo, basta fare clic su di esso e il pannello di sinistra visualizza la scheda “Opzioni campo”. Qui si trovano tre schede: Generale, Avanzate e Logica intelligente.

Se si desidera modificare l’etichetta del campo, inserire un testo descrittivo o rendere il campo obbligatorio, è necessario selezionare “Generale”.

Nell’immagine seguente, abbiamo modificato l’etichetta del campo “Valore della casa” in “Prezzo dell’immobile” e abbiamo aggiunto alcune istruzioni supplementari. Abbiamo anche reso il campo necessario, in modo che gli utenti debbano completare questa sezione per ottenere il calcolo del pagamento del mutuo.

Nella scheda “Avanzate” è possibile aggiungere un testo segnaposto, specificare le classi CSS da utilizzare, nascondere l’etichetta del campo e abilitare una funzione di calcolo, se necessario.

Come predefinito, il modulo visualizza il segno “$”, in modo che gli utenti sappiano che devono inserire i valori in dollari americani.

In alternativa, è possibile inserire un esempio nell’etichetta del campo, come “ad esempio 500.000”, in modo che l’utente sappia come inserire correttamente il prezzo.

La scheda “Logica intelligente” abilita la logica condizionale nel campo. È facoltativa, ma è una buona caratteristica per rendere più engagement il modulo della calcolatrice ipotecaria.

Per utilizzarla, basta attivare il pulsante “Abilita logica condizionale”.

Poi, si può scegliere di mostrare o nascondere il campo in base a determinati criteri. Nell’esempio seguente, abbiamo scelto di mostrare il campo ‘Prezzo dell’immobile’ se l’utente inserisce il proprio indirizzo email.

Una volta terminata la personalizzazione del modulo, è sufficiente fare clic su “Salva” nell’angolo in alto a destra.

Configurare le impostazioni del modulo

Ora passiamo alla scheda “Impostazioni” sul lato sinistro.

Nella scheda “Generale” è possibile modificare il nome del modulo e aggiungere una descrizione in alto. Si possono anche digitare alcune istruzioni e aggiungere un invito all’azione per incoraggiare gli utenti a compilare il modulo.

Inoltre, è possibile personalizzare l’etichetta e il testo di elaborazione del pulsante di invio.

È inoltre necessario passare alla scheda “Protezione e sicurezza antispam”.

WPForms è già dotato di una protezione antispam abilitata di default. Tuttavia, è possibile attivare Akismet per ulteriori misure di protezione.

Inoltre, è gratuito impostare un numero minimo di secondi che un utente deve aspettare prima di inviare il modulo. In questo modo, gli utenti autentici hanno il tempo sufficiente per compilare il modulo, ma non quello necessario a un bot di spam per inviarlo rapidamente.

Scorrendo verso il basso, si può anche abilitare un filtro per Paese, che limita il modulo agli utenti di determinati Paesi. Consigliamo questa impostazione se il vostro sito web vende solo in un determinato Paese.

Una volta attivato il pulsante “Abilita filtro paese”, basta fare clic su “Consenti” sotto il filtro paese e selezionare il paese in cui si vende.

Se necessario, è possibile personalizzare il messaggio del filtro paese.

Se si procede verso il basso della pagina, si può anche impedire l’invio di moduli spam utilizzando un CAPTCHA.

WPForms supporta CAPTCHA personalizzati , reCAPTCHA e hCAPTCHA.

Passiamo alla scheda “Notifiche”.

WPForms può inviare un’email ogni volta che qualcuno completa il modulo. Per abilitare questa funzione, basta fare clic su “Abilita notifiche”.

Suggerimento: per rispondere subito all’invio di nuovi moduli, volete davvero assicurarvi che questi messaggi arrivino al sicuro nella vostra casella di posta e non nella cartella spam. Per questo motivo, vi consigliamo di utilizzare un provider di servizi SMTP per migliorare i tassi di deliverability delle vostre email e correggere il problema di WordPress che non invia correttamente le email.

È possibile modificare il contenuto dell’email secondo le necessità. Inoltre, è possibile inviare email di conferma dopo l’invio del modulo WordPress.

Una volta modificate le impostazioni, non dimenticate di fare clic su “Salva” per memorizzare le modifiche.

Incorporare il calcolatore dei costi del mutuo sul vostro sito WordPress

Ora siete pronti a visualizzare la calcolatrice ipotecaria sul vostro blog o sito web WordPress. Per farlo, fate clic sul pulsante “Incorpora” nel menu in alto.

A questo punto, è possibile aggiungere il modulo a una pagina esistente o creare una pagina completamente nuova.

In alternativa, è possibile utilizzare uno shortcode.

Il processo per aggiungere il modulo a una pagina esistente o nuova è abbastanza simile.

Facendo clic su “Seleziona pagina esistente”, si può scegliere la pagina che si desidera utilizzare. Dopodiché, fate clic su “Andiamo!”.

Se si sceglie di creare una nuova pagina, è necessario digitare il titolo della pagina.

Come per il metodo precedente, fate clic su “Let’s Go!” per procedere.

Entrambe le opzioni portano all’editor a blocchi standard di WordPress.

Qui, fare clic sul pulsante ‘+’ e selezionare il blocco WPForms.

Nel nuovo blocco, aprire il menu a discesa “Seleziona un modulo”.

A questo punto, è sufficiente scegliere il modulo creato in precedenza.

A questo punto si vedrà il modulo appena creato.

Nella barra laterale delle impostazioni del blocco, è possibile personalizzare ulteriormente il design del modulo. Ad esempio, è possibile modificare il colore di sfondo e il bordo del campo. È anche possibile restituire il builder di WPForms selezionando “Modifica modulo”.

Quando si è soddisfatti dell’aspetto del modulo, basta cliccare su “Aggiorna” o “Pubblica” per rendere effettive le modifiche.

Ecco come si presenta il nostro modulo di calcolo dei mutui:

Se si utilizza un tema WordPress classico, non a blocchi, è possibile visualizzare il modulo in un’area pronta per i widget.

Basta andare in Aspetto ” Widget e fare clic sul pulsante ‘+’ per aggiungere un blocco in qualsiasi area predisposta per i widget. Ora è possibile aggiungere il blocco WPForms e selezionare il modulo appena creato.

Nell’editor a blocchi è possibile modificare anche le impostazioni del widget della calcolatrice ipotecaria.

Quando si è soddisfatti dell’aspetto del modulo, è sufficiente fare clic su “Aggiorna”.

In alternativa, se questi metodi non funzionano, si può usare il metodo shortcode per inserire i moduli nelle pagine, nei post e in altre parti del template. Basta restituire l’editor di WPForms e fare clic su “usa uno shortcode” nel popup di incorpora.

È quindi possibile copiare lo shortcode e aggiungerlo a qualsiasi pagina, pubblicazione o area predisposta per i widget.

Per ulteriori informazioni, consultate la nostra guida su come add-on uno shortcode in WordPress.

Metodo 2: Aggiungere una calcolatrice ipotecaria avanzata per WordPress con Formidable Forms

Questo metodo è eccellente se si desidera creare un calcolatore di mutui WordPress avanzato che tenga conto delle tasse annuali sulla proprietà, dell’assicurazione e della PMI (Private Mortgage Insurance).

Una volta che il modulo dispone di questi dati, insieme al prezzo della casa, all’importo del prestito, al termine del prestito e al tasso di interesse, può visualizzare la ripartizione del pagamento dell’utente, chiamata anche programma di ammortamento.

Per questo metodo, utilizzeremo il plugin Formidable Forms. Questo plugin per i moduli di contatto di WordPress, facile da usare, è dotato di un modello avanzato di calcolatore di mutui che potete aggiungere al vostro sito.

La prima cosa da fare è installare e attivare entrambi i plugin Formidable Forms Lite e Formidable Forms premium (piano Business).

Il plugin gratuito ha funzioni limitate, ma Formidable Forms Pro lo utilizza come base per le sue funzioni più avanzate.

Per istruzioni dettagliate, consultare la nostra guida passo-passo su come installare un plugin di WordPress.

Dopo l’attivazione, andare su Formidable ” Impostazioni globali nella dashboard di WordPress. Qui è possibile fare clic su “Connetti un account”.

Nella schermata successiva, accedi al tuo account Formidable Forms.

Formidable Forms chiederà ora l’autorizzazione a installare il plugin Pro. È sufficiente fare clic su “Connetti e installa Formidable Forms Pro” per attivare la chiave di licenza.

Ora che avete configurato con successo Formidable Forms, siete pronti ad aggiungere un modulo di calcolo ipotecario a WordPress.

Utilizzate il modello di modulo di calcolo ipotecario avanzato

Per iniziare, andate su Formidable ” Moduli e fate clic su ‘Add-on’.

A questo punto apparirà un popup che mostra tutti i modelli già pronti che potete utilizzare sul vostro sito web WordPress.

Per trovare il template del modulo di calcolo del mutuo, è sufficiente digitare “Advanced Mortgage Calculator” nella barra di ricerca. Passare quindi il cursore sul template e fare clic su “Usa template”.

Si arriva così al costruttore di Formidable Forms. A questo punto, è possibile personalizzare il modulo in base alle proprie esigenze.

Per iniziare, fare clic sul campo che si desidera personalizzare e selezionare la scheda “Opzioni campo”.

Da qui è possibile modificare l’etichetta del campo, scegliere se il campo è obbligatorio o facoltativo, aggiungere un testo segnaposto e molte altre cose.

Con Formidable Forms, è anche possibile inserire un valore predefinito nella calcolatrice. In questo modo gli utenti possono vedere come potrebbe essere il loro calcolo.

Se si fa clic su uno dei campi della sezione “Analisi finanziaria”, evitare di modificare le “Opzioni avanzate”.

Quest’area contiene le formule di calcolo, quindi la loro modifica può interrompere completamente il calcolatore di mutui.

Quando si è soddisfatti dell’aspetto del modulo, basta fare clic su “Salva” nell’angolo in alto a destra per salvare le modifiche.

Quindi, digitare un nome per il modulo, in modo da poterlo identificare facilmente in seguito. Quindi, fare clic su “Salva”.

Personalizzare lo stile del modulo di calcolo del mutuo

Passiamo ora alla scheda ‘Stile’ del menu superiore. Qui è possibile scegliere un design per il modulo.

Se non vi piace nessuno degli stili, fate clic sul pulsante “+ Nuovo stile”.

Successivamente, apparirà una finestra a comparsa. È sufficiente digitare un nome per questo nuovo stile e fare clic su “Crea nuovo stile”.

A questo punto si accede a una pagina in cui è possibile personalizzare lo stile del modulo.

Sentitevi liberi di modificare la tipografia, la combinazione di colori, gli stili dei pulsanti, i checkbox e così via.

Una volta soddisfatti del design, basta fare clic sul pulsante “Aggiorna” nell’angolo in alto a destra.

Configurare le impostazioni di Formidable Forms

A questo punto, si può passare al menu “Impostazioni” in alto.

Innanzitutto, è possibile personalizzare il titolo e la descrizione del modulo nella scheda “Generale”. Questo può essere un buon posto per inserire alcune istruzioni sull’uso del modulo.

È anche possibile stilizzare il testo utilizzando l’HTML.

Scorrendo verso il basso, si trova un’impostazione che abilita Honeypot e JavaScript.

Si consiglia di abilitare entrambe le impostazioni, in quanto possono prevenire le voci di spam false e dannose.

Nella scheda “Azioni e notifiche” è possibile personalizzare l’email di conferma che Formidable Forms invia all’utente.

È possibile mostrare un messaggio di ringraziamento personalizzato, reindirizzare gli utenti a un URL specifico o inviarli a una pagina diversa.

Un’altra scheda che consigliamo di controllare è “Pulsanti”.

Qui è possibile personalizzare l’etichetta e la posizione del pulsante di invio e persino aggiungere un pulsante “Ricomincia” nel caso in cui l’utente voglia riavviare l’invio del modulo.

Dopo aver configurato le impostazioni del modulo, basta cliccare sul pulsante “Aggiorna” per salvare le modifiche.

Incorporare il modulo di calcolo ipotecario avanzato sul proprio sito web

Ora che il modulo per il calcolo avanzato dei mutui è pronto, è possibile aggiungerlo a qualsiasi pagina, post o area pronta per il widget.

Per iniziare, fare clic sul pulsante “Incorpora” nell’angolo in alto a destra.

Verrà visualizzata una finestra di dialogo che indica che è possibile aggiungere il modulo in tre modi.

È possibile aggiungere il modulo a una pagina esistente, creare una nuova pagina o utilizzare uno shortcode.

Se si sceglie l’opzione pagina esistente, nella schermata successiva verrà selezionata una pagina.

Quindi, fare clic su “Inserisci modulo”.

Se invece si sceglie l’opzione Nuova pagina, è possibile digitare un nome per la nuova pagina.

Fatto questo, si può cliccare su “Crea pagina”.

Con entrambe le opzioni, Formidable Forms inserirà automaticamente il blocco del modulo nell’editor a blocchi della pagina.

Se è necessario modificare il modulo direttamente dall’editor a blocchi, basta aprire la barra laterale delle impostazioni del blocco e fare clic su “Vai al modulo”.

Quando siete pronti, fate clic su “Pubblica” o “Aggiorna”.

Ecco come si presenta il nostro modulo di calcolo dei mutui Formidable Forms:

In alternativa, è possibile aggiungere il calcolatore di mutui utilizzando uno shortcode o un codice PHP.

Nel popup di incorporamento di prima, fare clic su “Inserisci manualmente”.

Quindi, è possibile copiare lo shortcode o il codice PHP. Anche in questo caso, per la prima opzione, potete leggere il nostro articolo su come aggiungere uno shortcode in WordPress.

Per quanto riguarda il codice PHP, consigliamo questo metodo solo se vi sentite a vostro agio nell’elaborazione in corso di frammenti di codice. A tale scopo, consigliamo di utilizzare WPCode, un plugin che rende sicuro e facile l’inserimento di codice in WordPress.

Per maggiori informazioni, potete leggere la nostra guida su come inserire gli snippet di codice in WordPress.

Speriamo che questo articolo vi abbia aiutato a capire come aggiungere una calcolatrice ipotecaria in WordPress. Potreste anche leggere il nostro articolo su come creare un calcolatore di prestiti auto o di pagamenti auto in WordPress e i nostri consigli da esperti sui modi migliori per creare moduli più interattivi.

Se questo articolo vi è piaciuto, iscrivetevi al nostro canale YouTube per le esercitazioni video su WordPress. Potete trovarci anche su Twitter e Facebook.