CONDIVIDI
Wordpress: come inserire un OnClick Pop-Up
Non so se hai avuto lo stesso problema, ma io è un po' che lotto con i pop-up in WordPress.
Intendiamoci: se vuoi trovare un plugin che consenta di far comparire un pop-up in modo indipendente dall'azione di un utente, è facilissimo. L'offerta attuale è piena di pop-up più o meno complessi e configurabili che si attivino in corrispondenza dell'apertura di una pagina, alcuni secondi dopo l'apertura, addirittura immediatamente prima che l'utente abbandoni la pagina.
Si tratta, in questo caso, di plugin indispensabili per l'attività di marketing, poiché favoriscono l'adesione a un'offerta, stimolano un'azione, propongono un up-selling.
Se però la mia intenzione è quella di favorire la lead generation mediante la risposta ad una call-to-action che non generi l'uscita dalla pagina web che la contiene (allo scopo, evidentemente, di rendere più seamless e breve possibile la pipeline di conversione), allora l'offerta si riduce attualmente a un paio di scelte che ho trovato immancabilmente insufficienti e addirittura mal funzionanti.
Il problema che mi premeva risolvere era, in sintesi, il seguente: creare, come risposta al click su una call to action, un pop-up con le seguenti caratteristiche:
  • capace di contenere un invito all'azione e un form di lead generation wrappato da una veste grafica
  • responsive
  • fortemente personalizzabile e modificabile in ogni pagina
  • immune ai meccanismi di blocco pop-up
  • misurabile in Google Analytics, sia per l'evento di generazione del pop-up, sia per l'evento di compilazione del form di lead generation contenuto nel pop-up stesso.

Onclick Pop-Up: chiedevo troppo?

Mi stavo convincendo di sì, quando ho trovato un aiuto in un plug-in che in realtà è nato per fare tutt'altro: Lightbox Plus Colorbox. Il plugin in questione è di quelli che di solito si usano per ingrandire in una lightbox un'immagine.
Tuttavia, una sua particolare caratteristica consente di creare dei popup che si attivano al click dell'utente su un determinato link (che può essere associato evidentemente a una Call to Action).

Onclick Pop-Up: vediamo come procedere.

1. Installa Lightbox Plus Colorbox

Utilizza la procedura standard per l'installazione del plugin, e attivalo normalmente.

2. Attiva le opzioni che ti servono

Per poter utilizzare il plugin come generatore di pop-up, è necessario attivare la relativa caratteristica. Vai allora sulle impostazioni del plugin, e attiva la funzione che genera le Secondary Lightbox e quella che genera gli Inline Lightbox.
onclick pop-up wordpress
Il numero di Inline Lightbox corrisponde al numero di Id generati dal plugin all'interno del foglio di stile che regola le dimensioni e il comportamento delle Lightbox.
Quindi: con lo stesso comportamento e le stesse dimensioni, si potranno creare alla bisogna più pop-up. Inutile pertanto inserire un numero elevato, a meno che non si voglia generare molte tipologie di pop-up differenti.
Salviamo le impostazioni e andiamo avanti.

3. Imposta i pop-up

Scendendo nella pagina di impostazioni, troviamo la scheda Inline Lightbox, con i cinque (o più, se abbiamo impostato un numero diverso) Id generati.
onclick popup wordpress
Da questa schermata potrai regolare il comportamento del tuo pop-up sulla pagina. Quelli veramente necessari sono: metodo e velocità della transizione, altezza e larghezza della lightbox, posizione, modalità di apertura e, infine, opacità del viewport circostante la lightbox generata dal plugin.
Il Content Id si riferisce invece alla classe cui fare riferimento per il link che genera l'apertura del pop-up, e a quella relativa al pop-up stesso.

4. Costruisci il tuo onclick pop-up

Una volta terminate le impostazioni, sarà sufficiente andare sulla pagina WordPress dove si intende inserire il pop-up e passare nella modalità di visualizzazione del codice Html.
Il plugin stesso suggerisce quale base di codice utilizzare per costruire lo scheletro del tuo pop-up, che sarà simile al seguente per la call to action che dovrà generare il pop-up
onclick pup up wordpress
e simile al seguente per il div nascosto che dovrà contenere il pop-up stesso:
Onclick Pup-Up usando wordpres
Da qui, si tratterà solo di inserire il proprio codice, inclusi gli shortcode di generazione del form di registrazione, il codice javascript per generare le chiamate a Google Analytics per il tracking del click sulla call to action ecc.
Il risultato sarà una lightbox contenente il tuo pop-up.
Le soluzioni grafiche, lavorando come faresti normalmente con istruzioni css e html per costruire il pop-up, sono ovviamente infinite.

CIAO! Grazie per essere arrivato a leggere fino a qui.

Porto avanti questo blog solo per passione, senza voler fare altro se non avviare un confronto con chi condivide con me l'interesse per tutto ciò che è marketing. Se ti è piaciuto questo post, la soddisfazione più grande che potrai darmi sarà quella di condividerlo sui social media e di lasciare un tuo commento.

Se poi vuoi rimanere sempre aggiornato, iscriviti subito alla newsletter!

Inserisci qui il tuo indirizzo e-mail:

Delivered by FeedBurner

NO COMMENTS

LEAVE A REPLY