Creare un popup

Creare un popup è davvero un’operazione molto semplice ed intuitiva grazie all’integrazione nativa con Gutenberg.

In questa guida vedremo come creare un popup in pochi semplici passi.

Crea il tuo primo popup

Dopo aver installato Popper, sarà disponibile una nuova voce di menu nella tua dashboard.

Da questo menu potrai gestire tutti i tuoi popup.

Nella pagina principale c’è una tabella da cui potrai gestire i tuoi popups.

Cliccando sul pulsante in alto puoi creare il tuo primo popup.

Tipi di popup

Quando il popup è vuoto ti verrà chiesto di scegliere un preset. Puoi comunque decidere di partire con un popup vuoto cliccando sul tasto skip.

Sono disponibili i seguenti tipi di popup:

  • Default: un popup che appare al centro della pagina e può essere provvisto di un overlay che oscura la pagina per mettere in evidenza il popup
  • Slide In: un popup che può apparire in diversi punti della pagina ( in basso a destra, in alto a sinistra etc…)
  • Off canvas: un popup che occupa l’intera altezza della pagina senza coprirla tutta e può apparire da destra o sinistra
  • Top bar: un popup che appare in alto per l’intera larghezza della pagina
  • Full page: un popup che copre interamente la pagina

Dopo aver scelto un preset avrai la struttura del popup pronta. Dovrai solo aggiungere il contenuto che più ti piace.

Struttura del popup

Di base un popup è composto da tre blocchi:

  • Popup: il contenitore principale (non può essere cancellato)
  • Bottone di chiusura: un pulsante che permette di chiudere il popup.
  • Popup body: il blocco che conterrà tutti i blocchi che vuoi aggiungere.