Come aggiungere un pulsante personalizzato a WordPress

Uno degli elementi di maggior valore su una landing page è il pulsante di invito all’azione (CTA). È l’elemento che i visitatori cliccano per scaricare una risorsa, iscriversi alla tua lista email o prenotare una consulenza. Progettalo bene e contribuirà notevolmente alle conversioni; progettalo male e gli utenti potrebbero scorrere oltre prima di abbandonare la tua pagina.

In definitiva, sapere come aggiungere un pulsante in WordPress — uno che si distingua da quelli generici presenti su altre pagine — può fare la differenza tra un nuovo cliente e uno perso. Ma è molto più facile a dirsi che a farsi. Sebbene WordPress offra opzioni di personalizzazione dei pulsanti nel suo editor Gutenberg, sono di base. Gli utenti spesso restano bloccati dalle confuse impostazioni dei colori e dalla mancanza di opzioni di animazione. Se vuoi creare un pulsante CTA più sofisticato, l’editor Gutenberg non ti porterà molto lontano. 

Per aggirare i limiti dei pulsanti di WordPress, hai due opzioni: installare un pesante blocco o plug-in di terze parti, oppure utilizzare un widget serverless gratuito e leggero che protegge la velocità della tua pagina e il codice del tema. Questa guida spiega come funziona ciascuna opzione, così potrai decidere qual è la migliore per il tuo sito web.

Watch on youtube

How to Add a Custom Button to Wordpress

Opzione 1: installare un plug-in dedicato per i pulsanti di WordPress o utilizzare CSS personalizzato

Se stai imparando come usare WordPress, potresti ricorrere a plug-in di terze parti o a codice CSS per personalizzare i pulsanti. Puoi trovare i plug-in disponibili tramite la dashboard di amministrazione di WordPress oppure aggiungere il tuo CSS utilizzando l’Editor di WordPress. 

Prima di esplorare queste opzioni, tieni presente i potenziali svantaggi:

• Alcuni plug-in utilizzano un eccesso di JavaScript e CSS, il che può rallentare i tempi di caricamento della pagina e compromettere il tuo punteggio Core Web Vitals. 
• Gli sviluppatori non sempre mantengono aggiornati i plug-in. Questo può portare a futuri problemi di prestazioni. Inoltre, ti dà un’altra cosa da monitorare.
• Un CSS personalizzato errato può sovrascrivere le attuali impostazioni globali dei pulsanti del tuo sito web, con ripercussioni sull’aspetto degli altri pulsanti in tutto il sito. Può anche influire sulla reattività mobile del tuo sito.

Iniziamo con l’opzione più semplice: un plug-in di terze parti. Per trovarne e installarne uno sul tuo sito, segui questi passaggi:

1. Clicca sull’opzione Plugin nella dashboard di amministrazione di WordPress. Digita la funzionalità di cui hai bisogno nella barra di ricerca. In questo esempio, abbiamo inserito “custom CTA button WordPress”.

2. Scegli un plug-in dall’elenco e cliccaci sopra per saperne di più sulle sue funzionalità. I migliori plug-in per WordPress sono aggiornati, compatibili con il tuo tema WordPress e hanno recensioni positive degli utenti. Clicca su Installa ora quando trovi un’opzione che ti piace.

3. Quando il plug-in termina l’installazione, clicca sul pulsante Attiva. Segui le istruzioni dello sviluppatore per creare il tuo pulsante personalizzato. 

Se hai dimestichezza con i CSS, puoi programmare il tuo pulsante CTA personalizzato. Per farlo, segui questi passaggi:

1. Clicca su Aspetto > Editor nella dashboard di amministrazione di WordPress. Se stai utilizzando un tema classico o di terze parti, clicca su Aspetto > Personalizza. 

2. Clicca su Stili > ⋮ > CSS aggiuntivo. Nei temi classici e di terze parti, clicca su CSS aggiuntivo.

3. Digita il codice CSS personalizzato del tuo pulsante nella casella di testo.

Invece di programmare il tuo pulsante, puoi provare un’alternativa al CSS personalizzato per WordPress: il Widget Pulsante di Jotform. Esploriamo questa opzione nella sezione successiva.

Opzione 2: aggiungi un widget pulsante gratuito e personalizzabile (consigliato)

Con il Widget Pulsante di Jotform, puoi creare un pulsante CTA con gradienti, icone ed effetti al passaggio del mouse unici. Questa opzione non influirà sul CSS del tuo sito né ne ridurrà la velocità di caricamento, poiché funziona tramite un affidabile embed ospitato.

Per utilizzarlo, dovrai configurare il tuo pulsante in Jotform e incorporare il pulsante personalizzato in WordPress utilizzando un blocco HTML personalizzato. Si aggiorna immediatamente con un pulsante impeccabile, reattivo e indipendente, su misura per le tue esigenze. Segui questi passaggi per provarlo:

1. Vai al Widget Pulsante di Jotform e compila le informazioni di base sul tuo pulsante. Clicca su Continua.

2. Aggiungi colori, icone e altre opzioni di stile. Puoi regolare lo stile degli angoli, la spaziatura interna, la dimensione del testo e i caratteri, oppure aggiungere un’ombreggiatura per dare maggiore risalto. Quando hai finito, clicca su Continua.

3. Esamina e seleziona le tue opzioni di layout, quindi clicca su Provalo gratis sul tuo sito web.

4. Segui le istruzioni per creare un account gratuito con Jotform, quindi copia il codice di incorporamento e incollalo in un blocco HTML personalizzato sul tuo sito web WordPress. Assicurati di scegliere la pagina e la sezione in cui vuoi che appaia il pulsante.

L’alternativa gratuita e senza codice di Jotform per i pulsanti di invito all’azione in WordPress ti offre il controllo completo sull’aspetto e la funzionalità del tuo pulsante. Che tu voglia personalizzare testo, colori e raggio dei bordi, oppure aggiungere un’animazione al passaggio del mouse, Jotform è all’altezza del compito. 

Potenzia il tuo sito WordPress con widget intelligenti e serverless

Jotform offre molto più della semplice progettazione di pulsanti personalizzati. Consulta la nostra directory di widget gratuiti per siti web per trovare altri strumenti che massimizzano le conversioni, eliminano il sovraccarico delle pagine e mantengono leggero il database del tuo sito per velocità di caricamento fulminee. Alcuni dei nostri widget più amati includono

• Widget Recensioni Google: mostra le recensioni Google del tuo brand in base alle tue preferenze
• Widget Timer per il conto alla rovescia: mostra ai visitatori quanto tempo hanno a disposizione per compiere una determinata azione, come iscriversi a un evento
• Widget FAQ: fornisce uno strumento FAQ ricercabile con risposte ricche di contenuti multimediali e stile personalizzato
• Moduli per WordPress: ti permette di creare moduli personalizzati e incorporarli nel tuo sito web

In qualità di creatore, blogger o marketer, il tuo obiettivo è produrre contenuti eccezionali e ottimizzare i funnel, non armeggiare con CSS o plug-in. Gli strumenti gratuiti e off-server di Jotform ti permettono di implementare funzionalità premium e ad alta conversione in pochi minuti, così potrai tornare a ciò che sai fare meglio. Inizia oggi stesso con Jotform.