Andremo a spiegare il funzionamento di ogni singola chiave di questo template.
Per la configurazione iniziale del behavioural message si rimanda all’articolo dedicato come configurare un behavioural message.
In tutto l’articolo quando si farà riferimento all’evento On Exit, si intenderà quando l’utente avrà oltrepassato con il mouse la viewport del sito web.
OPZIONI > Altro
Durata dei Cookie (in giorni) possiamo indicare il tempo in cui il messaggio non verrà mostrato di nuovo all’utente dopo che questo lo avrà chiuso.
Timeout indicare il tempo di permanenza del messaggio in secondi.
Intervallo tra le visualizzazioni (millisecondi) indicare il tempo di ritardo della visualizzazione del messaggio.
Sensibilità maggiore sarà il suo valore più facilmente scatterà l’evento On Exit .
Mostra solo dopo x secondi possiamo inserire un tempo nel quale il messaggio non verrà mostrato anche se l’evento On Exit si sarà verificato.
LAYOUT > Posizione e dimensioni
Angoli stondati (in px) per impostare gli angoli arrotondati del messaggio.
Padding contenuto (in px) distanza del contenuto dai bordi del messaggio.
Posizione top icona chiusura (in px) indica la distanza tra il bordo superiore e l’icona di chiusura (può avere valori negativi).
Posizione right icona chiusura (in px) indica la distanza tra il bordo laterale e l’icona di chiusura (può avere valori negativi).
Colore di sfondo per impostare il colore di sfondo di tutto il messaggio.
Larghezza bordo (in px) spessore bordo esterno del messaggio.
Colore bordo esterno colore bordo esterno del messaggio.
Colore icona chiusura per impostare il colore icona di chiusura del messaggio.
Icona chiusura box impostare l’icona per il pulsante di chiusura del messaggio.
Colore ombra esterna imposta il colore dell’ombra esterna.
Opacità forma sfondo animato (in %) imposta l’intensità delle forme esterne animate valori accettati da 0 a 100.
Colore forma sfondo animato imposta il colore delle forme esterne animate.
Opacità overlay esterno (in %) imposta la trasparenza dell’overlay esterno, valori accettati da 0 a 100.
Colore overlay esterno imposta il colore di sfondo dell’overlay esterno.
Mostra ombra esterna possiamo attivare o disattivare l’ombra esterna.
Overlay esterno animato possiamo decidere se mostrare oppure no le forme animate.
Mostrare overlay esterno possiamo attivare o disattivare tutto l’overlay esterno, se disattivo anche le forme animate non saranno visibili.
Posizione box compare un select dove possiamo impostare la posizione del nostro messaggio.
Distanza del box dai lati (in px) impostare una distanza dai bordi minima che il messaggio deve rispettare.
Forma sfondo animato possiamo inserire una forma CSS, vi rimandiamo al sito, per poter generare le vostre forme personalizzate.
Larghezza massima box (in px) possiamo impostare una larghezza massima del messaggio.
LAYOUT > Testo messaggio
Larghezza immagine laterale (in px) impostiamo la larghezza massima dell’immagine laterale.
Immagine laterale a sinistra se scegliamo se l’immagine va a sinistra altrimenti si posiziona a destra.
Visualizza immagine laterale possiamo decidere se mostrare o nascondere l’immagine laterale.
Immagine laterale selezioniamo tramite la media gallery l’immagine.
Contenuto di testo inseriamo il contenuto di testo da visualizzare.
Colore titolo possiamo impostare un colore per tutti i titoli inseriti nel testo precedente.
Colore del testo impostiamo il colore per il testo (titoli esclusi).
Dimensione titoli (in px) – Dimensione testo (in px)
LAYOUT > Content recommendation
Queste chiavi sono presenti solo nel template “NEXT ON EXIT RECOMMENDATIONS”.
Colore bordo tra REC e Contenuto impostiamo il colore della riga di separazione tra il contenuto di testo e il carosello.
Altezza immagini REC (in px) impostiamo l’altezza delle immagini interne alle card del carosello.
Mostra REC prima del contenuto se impostato su “si” mostra prima il carosello con le raccomandazioni e poi il contenuto, altrimenti lo inserisce dopo.
Mostra REC possiamo decidere se mostrare o nascondere il carosello con le raccomandazioni.
Spessore bordo tra REC e contenuto (in px) impostiamo lo spessore della riga di separazione tra il contenuto e il carosello.
Testo pulsante REC inseriamo il testo che vogliamo sia inserito nel pulsante di ogni singola card.
Titolo REC inseriamo il titolo che compare prima del carosello (colore e dimensione prende quelli già impostati).
Nascondi pulsante REC possiamo nascondere il pulsante su ogni singola card.
Nascondi img REC possiamo nascondere l’immagine sulle card.
Nascondi prezzi REC possiamo nascondere i prezzi sulle card.
Nascondi descrizione REC possiamo nascondere la descrizione breve sulle card.
Nascondi nome REC possiamo nascondere il nome sulle card.
Nascondi titolo REC si può nascondere il titolo prima del carosello.
Ordine prezzo REC | Ordine immagine REC | Ordine descrizione REC | Ordine nome REC possiamo decidere l’ordine di ogni elemento più alto è il valore e prima verrà inserito.
Colore descrizione REC | Colore nome REC possiamo impostare il colore per il nome e la descrizione all’interno delle card.
LAYOUT > Altro
z-index impostiamo uno z-index per posizionare il messaggio al di sopra del nostro sito web.
Codice CSS aggiuntivo possiamo inserire codice CSS personalizzato ATTENZIONE inserire codice CSS valido.
FORM > Posizione e dimensioni
Mostrare sfondo form possiamo attivare o disattivare lo sfondo del form (se disattivato il padding sarà 0).
Padding form (in px se sfondo attivo) se lo sfondo è attivo, possiamo impostare un margine tra il bordo del form e i contenuti.
Angoli arrotondati form (in px) se lo sfondo del form è attivo possiamo anche impostare gli angoli arrotondati.
Colore di sfondo del form impostiamo il colore di sfondo del form.
Colore link impostiamo i colori dei link all’interno delle label del form.
Colore label form colore del testo sulle label del form.
Colore checkbox/radio form impostiamo il colore con cui evidenziamo checkbox e radio selezionati.
Colore bordo input form colore del bordo esterno degli input del form.
Colore sfondo input form colore di sfondo degli input del form.
Nascondi form possiamo nascondere o mostrare il form.
PULSANTI > Pulsante (valide per tutti i pulsanti)
Colore testo pulsati colore del testo per i pulsanti.
Colore testo pulsati rollover colore del testo quando il mouse è posizionato sopra.
Sfondo pulsanti colore di sfondo dei pulsanti.
Sfondo pulsanti rollover colore di sfondo al passaggio del mouse.
Dimensioni testo pulsanti (in px)
Angoli arrotondati pulsanti (in px) angoli arrotondati dei pulsanti.
Colore bordo pulsanti rollover colore del bordo al passaggio del mouse.
Colore bordo pulsanti colore del bordo.
Dimensione bordo pulsanti spessore bordo pulsanti (in px).
Thanks for contributing!