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

Volete aggiungere un calcolatore di mutui in WordPress?

Se avete un sito web immobiliare o finanziario, un calcolatore di mutui può aiutare i visitatori a capire se possono permettersi le proprietà che state promuovendo. In questo modo, le persone rimangono più a lungo sul vostro sito web e vi aiutano a vendere più immobili.

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 inserire informazioni come il valore della casa, l’anticipo, i tassi di interesse e così via. Dopodiché, il calcolatore di rate ipotecarie calcolerà l’importo da pagare al mese in base ai dati forniti.

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

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

Altri soggetti che possono trarre vantaggio da un calcolatore di mutui sui loro siti sono i consulenti finanziari, i broker di mutui o le banche e gli educatori di finanza personale.

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 1700 modelli di moduli, questo plugin di moduli drag-and-drop è perfetto per creare vari moduli, tra cui un calcolatore di mutui, per diversi tipi di siti web.

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.

Una volta fatto, andate su WPForms ” Impostazioni e inserite la chiave di licenza del vostro piano Pro dalla pagina del vostro account WPForms. Quindi, fate semplicemente clic su “Verifica chiave”.

Scegliere e personalizzare un modello di modulo di calcolo ipotecario

Ora che la chiave di licenza è attiva, è 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.

Vedrete che WPForms ha due modelli: Modulo di calcolo ipotecario e Modulo di calcolo ipotecario semplice. Entrambi i modelli offrono funzionalità simili, ma differiscono per i campi specifici che includono.

Il modello di modulo per il calcolo del mutuo è ideale per i siti immobiliari che vogliono aiutare i potenziali acquirenti a stimare rapidamente l’importo 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.

Sta a voi decidere quale calcolatore utilizzare, ma a scopo dimostrativo utilizzeremo il modello di modulo di calcolo ipotecario.

È possibile fare clic su “Visualizza demo” per vedere l’aspetto di ciascun modulo in azione.

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

A questo punto, apparirà un popup che indica che il modulo richiede il componente aggiuntivo Calcoli.

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

Ora si arriva al costruttore di moduli con trascinamento. Come si può vedere, il modello ha già aggiunto i campi della calcolatrice.

Questo modello in particolare presenta campi in cui gli utenti possono inserire il valore della casa (il costo totale della casa) e l’importo dell’acconto (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.

Una volta che il modulo contiene tutti i dettagli del mutuo, la sezione inferiore calcolerà automaticamente l’importo della rata mensile e annuale del mutuo dell’utente, gli interessi totali pagati e la rata totale del mutuo.

La formula di calcolo per questa sezione inferiore si trova in “Opzioni campo” e nella scheda “Avanzate” del 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 porterà alla scheda “Opzioni campo”. Ci sono tre schede che si possono configurare ulteriormente: Generale, Avanzata e Logica intelligente.

Le possibilità di personalizzazione variano a seconda del tipo di campo. Se si desidera modificare l’etichetta del campo, inserire un testo descrittivo o rendere il campo obbligatorio, si andrà in “Generale”.

In questo caso, abbiamo cambiato l’etichetta del campo “Valore della casa” in “Prezzo dell’immobile” e abbiamo aggiunto un testo descrittivo per ulteriori istruzioni. Abbiamo anche reso il campo obbligatorio, in modo che gli utenti debbano inserirlo per ottenere il calcolo della rata del mutuo.

Nella scheda “Avanzate” è possibile aggiungere un testo segnaposto, specificare la classe CSS del campo se si desidera utilizzare un CSS personalizzato, scegliere di nascondere l’etichetta del campo e attivare una funzione di calcolo, se necessario.

Per impostazione predefinita, il modulo presenta il segno ‘$’ come segnaposto per indicare agli utenti che i valori devono essere espressi 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” consente di attivare la logica condizionale nel campo. È facoltativa, ma è un’ottima funzione per rendere più accattivante il modulo di calcolo dei mutui.

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

Quindi, 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 ha inserito il proprio indirizzo e-mail.

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 più a sinistra del menu.

Nella scheda “Generale” è possibile modificare il nome del modulo e inserire una descrizione nella parte superiore del modulo. È possibile digitare alcune istruzioni e testi di invito all’azione per incoraggiare gli utenti a compilare il modulo.

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

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

WPForms è già dotato di una protezione antispam attivata di default. Ma è anche possibile attivare Akismet per ulteriori misure di protezione.

Inoltre, è possibile impostare un numero minimo di secondi che un utente deve impiegare prima di poter inviare il modulo. In questo modo gli utenti hanno il tempo sufficiente per compilare il modulo, ma non abbastanza per consentire a un bot di spam di inviarlo rapidamente.

Scorrendo verso il basso, si può anche attivare un filtro per Paese per consentire agli utenti di determinati Paesi di compilare il modulo. Vi consigliamo di farlo se il vostro sito web immobiliare 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 scende nella pagina, si può anche attivare la funzionalità CAPTCHA per evitare l’invio di moduli contenenti spam.

WPForms consente CAPTCHA personalizzati , reCAPTCHA e hCAPTCHA.

Passiamo alla scheda ‘Notifiche’. Qui è possibile inviare un’e-mail ogni volta che viene inviato un nuovo modulo.

Per attivare questa funzione, è sufficiente fare clic su “Abilita notifiche”. Si consiglia inoltre di utilizzare WP Mail SMTP per assicurarsi di ricevere sempre queste notifiche via e-mail, poiché le e-mail inviate da WordPress rischiano di andare perse.

Per ulteriori informazioni, consultate la nostra guida su come risolvere il problema dell’invio di e-mail da parte di WordPress.

Sentitevi liberi di modificare il contenuto dell’e-mail secondo le vostre necessità.

In queste impostazioni potete anche creare un’e-mail di conferma personalizzata per l’utente. Per farlo, potete seguire il nostro tutorial su come inviare e-mail di conferma dopo l’invio di un modulo WordPress.

Come in precedenza, non dimenticate di fare clic su “Salva” una volta terminate le impostazioni.

Incorporare il calcolatore dei costi del mutuo sul vostro sito WordPress

Ora siete pronti a visualizzare il modulo per il calcolo dei mutui sul vostro blog o sito web WordPress. Dovete fare clic sul pulsante “Incorpora” nel menu in alto.

A questo punto, apparirà un popup di incorporamento, che chiederà di selezionare una pagina esistente o di crearne una nuova a cui aggiungere il modulo.

In alternativa, è possibile utilizzare uno shortcode.

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

Se si sceglie l’opzione “Seleziona pagina esistente”, la schermata successiva chiederà di scegliere una pagina a cui aggiungere il modulo. Dopodiché, fare clic su “Andiamo!”.

Se scegliete l’opzione nuova pagina, la schermata successiva vi chiederà di assegnare un nome a questa nuova pagina, in modo che WPForms possa crearla per voi.

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

Entrambe le opzioni portano all’editor di blocchi di Gutenberg.

Ora, fare clic sul pulsante “+” per aggiungere un blocco in qualsiasi punto della pagina e selezionare il blocco WPForms.

Una volta che il blocco è presente, aprire il menu a discesa “Seleziona un modulo”.

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

A questo punto, il modulo appena creato verrà visualizzato nell’editor dei blocchi.

Nella barra laterale delle impostazioni del blocco, è possibile personalizzare ulteriormente il design del modulo, come il colore di sfondo e il bordo del campo. Se necessario, si può anche fare clic su “Modifica modulo” per tornare al costruttore di WPForms.

Una volta che si è soddisfatti dell’aspetto del modulo, basta fare clic su “Aggiorna” o “Pubblica” per rendere ufficiali le modifiche.

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

Se si utilizza un tema WordPress classico, non a blocchi, e si desidera visualizzare il modulo in un’area predisposta per i widget, come intestazioni, piè di pagina o barre laterali, è possibile farlo.

Basta andare su Aspetto ” Widget e fare clic sul pulsante ‘+’ per aggiungere un blocco in qualsiasi area predisposta per i widget. Come prima, aggiungete il blocco WPForms e selezionate il modulo appena creato.

Nell’editor di widget, è possibile modificare anche le impostazioni del blocco del widget calcolatore di mutui, proprio come nell’editor di blocchi.

Una volta soddisfatti del modulo, è sufficiente fare clic su “Aggiorna”.

In alternativa, se i metodi di cui sopra non funzionano, è possibile utilizzare il metodo shortcode per inserire i moduli in pagine, post e altre parti del template. È sufficiente fare clic sul link “usa uno shortcode” nel popup di incorporamento precedente.

Quindi copiate lo shortcode e incollatelo dove preferite.

Per ulteriori informazioni, leggere come aggiungere 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 mutuo, alla durata del mutuo e al tasso di interesse, può visualizzare l’anteprima della ripartizione dei pagamenti dell’utente, chiamata anche piano 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, consultate 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, è sufficiente accedere al proprio account Formidable Forms.

Dopo l’acquisto di un piano, dovreste disporre delle informazioni sul vostro conto.

A questo punto si aprirà una pagina che chiede il permesso di installare Formidable Forms Pro.

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, basta andare su Formidable ” Moduli e cliccare su “Aggiungi nuovo”.

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

Per trovare il modello di modulo di calcolo ipotecario, è sufficiente digitare “Advanced Mortgage Calculator” nella barra di ricerca. Quindi, passate il cursore sul modello e fate clic su “Usa modello”.

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.

L’aspetto interessante di Formidable Forms è che si può inserire un valore predefinito nella calcolatrice, consentendo agli utenti di vedere come potrebbe apparire il calcolo in seguito.

Se fate clic su uno dei campi della sezione “Analisi finanziaria”, cercate di non 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 scrivere 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 il design dello stile del modulo.

Sentitevi liberi di modificare la tipografia, lo schema dei colori, gli stili dei pulsanti, le caselle di controllo 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.

In primo luogo, nella scheda “Generale” è possibile personalizzare il titolo e la descrizione del modulo, nonché scegliere di visualizzarli successivamente sul sito web. Questo potrebbe essere un buon posto per inserire alcune istruzioni su come utilizzare il modulo.

Si noti che se si desidera stilizzare il testo, è necessario utilizzare l’HTML.

Scorrendo verso il basso, si trova un’impostazione per abilitare Honeypot e JavaScript per la prevenzione dello spam.

Si consiglia di abilitarli entrambi per evitare voci di spam false e dannose.

Nella scheda “Azioni e notifiche” è possibile personalizzare l’e-mail di conferma per l’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 il testo e la posizione del pulsante di invio e persino attivare un pulsante “Ricomincia” nel caso in cui l’utente voglia svuotare il modulo e ricominciare da capo.

Dopo aver configurato le impostazioni del modulo, basta fare clic sul pulsante “Aggiorna”.

Incorporare il modulo di calcolo ipotecario avanzato sul proprio sito web

Ora che il vostro modulo avanzato per il calcolo dei mutui è pronto, potete aggiungerlo a qualsiasi post, pagina o area pronta per i widget del vostro tema WordPress.

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 incorporare il modulo in una pagina esistente, inserirlo in 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”.

D’altra parte, scegliendo l’opzione nuova pagina si crea e si dà un nome a una nuova pagina.

Una volta fatto ciò, fare clic su “Crea pagina”.

Con entrambe le opzioni, Formidable Forms inserisce automaticamente il blocco del modulo nell’editor di blocchi della pagina. Tutto ciò che si deve fare è riorganizzarlo.

Se è necessario modificare il modulo direttamente dall’editor del blocco, 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 il codice breve 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, vi consigliamo di utilizzarlo solo se vi sentite a vostro agio nel lavorare con gli snippet di codice. Per questo 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 di mutui in WordPress. Potreste anche leggere il nostro articolo su come creare un calcolatore di prestiti auto o di pagamenti auto in WordPress e la nostra scelta dei migliori servizi di email marketing per le piccole imprese.

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