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.

Il template Next Box Message è utilizzato per andare a inserire all’interno della propria pagina un elemento che può contenere uno o più di questi elementi:

• testo HTML
• immagine laterale al testo
• form
• raccomandazioni prodotto

Sarà possibile disattivare e attivare le varie funzionalità in fase di personalizzazione.

Ricordiamo che per mostrare raccomandazioni prodotti o contenuti all’interno di un messaggio comportamentale è necessario allo step 1, in fase di creazione, selezionare la voce che ci interessa : prodotti, contenuti, prodotti e contenuti, form e il tipo di algoritmo da utilizzare nel caso siano presenti le raccomandazioni

Attenzione: Questo messaggio non essendo di tipo Overlay va inserirsi all’interno della struttura della pagina prima/dopo o al posto di elementi presenti. All’inizio della configurazione del behavioural message è necessario definire l’XPATH in cui verrà inserito tale elemento. Potete trovare una guida dettagliata su come fare a questo link. Finchè l’XPATH non verrà selezionato non sarà possibile visualizzare l’anteprima. Nel caso in cui l’XPATH definito non risulti presente nella pagina il messaggio non verrà mostrato.

Layout

Layout -> Testo Messaggio

Titoli maiuscoli: ci permette di trasformare il titolo in testo tutto maiuscolo

Colore titoli | Dimensione titoli (in px): possiamo impostare colore e dimensione per i titoli.

Colore link possiamo impostare un colore per i link all’interno del contenuto di testo.

Contenuto HTML interno: box di inserimento HTML dal quale possiamo inserire e formattare il testo da visualizzare nel messaggio.

Immagine laterale possiamo inserire una immagine laterale tramite la media gallery di Blendee.

Immagine laterale a sinistra se impostato a si l’immagine sarà inserita a sinistra, altrimenti andrà a destra.

Visualizza immagine laterale possiamo decidere se visualizzare oppure no l’immagine laterale.

Larghezza massima immagine laterale (in px) possiamo impostare la larghezza massima dell’immagine laterale.

Target link immagine laterale impostiamo dove viene aperto il link presente sull’immagine: se in una nuova tab o nella finestra corrente.

Link immagine laterale: inseriamo l’URL al quale deve rimandare l’immagine.

Nascondi contenuto HTML: attiva/disattiva la visualizzazione del testo del messaggio contenuto nel box HTML

Nascondere immagine laterale: mostra/nasconde l’immagine laterale del messaggio

Layout -> Pulsante

Testo pulsanti maiuscolo: è possibile convertire il testo in carattere tutto maiuscolo

Colore sfondo rollover pulsanti colore di sfondo del pulsante al passaggio del mouse.

Angoli arrotondati pulsanti (in px) raggio di stondamento del bordo dei pulsanti.

Colore testo pulsati colore testo pulsanti.

Sfondo pulsanti colore di sfondo dei pulsanti.

Dimensioni testo pulsanti (in px)

Colore bordo pulsanti rollover imposta il colore dei bordi al passaggio del mouse.

Dimensione bordo pulsanti | Colore bordo pulsanti colore e spessore bordo pulsanti.

Layout -> Posizione e Dimensioni

Margine superiore box message (in px): distanza in pixel dall’elemento superiore

Margine inferiore box message (in px): distanza in pixel dall’elemento inferiore

Padding box message (in px): distanza interna in pixel dal bordo dell’elemento

Dimensione bordo esterno box message (in px): spessore del bordo esterno del box contenente il messaggio in pixel

Colore bordo esterno box message: colore del bordo esterno del box contenente il messaggio

Angoli arrotondati box message (in px): raggio di stondamento in pixel del bordo del box

Sfondo box message: colore di sfondo del box contenente il messaggio

Dimensione del testo interno (in px): dimensione del carattere utilizzato per il testo all’interno del messaggio

Colore testo interno: colore del testo all’interno del messaggio

Layout -> Altro

Codice CSS aggiuntivo: in questo box è possibile inserire il codice CSS valido che ci permette di personalizzare il foglio di stile del messaggio

Form

Form -> Posizione e Dimensioni

Colore radio/checkbox: colore del segno di selezione del campo

Colore label form: colore dell’etichetta del form

Dimensione label form (in px): dimensione del carattere utilizzato nelle etichette del form

Colore bordo input form: colore del bordo utilizzato per evidenziare la casella di input del form

Sfondo input form: colore di sfondo utilizzato per i campi input del form

Angoli arrotondati form (in px) raggio di arrotondamento dei bordi del form.

Padding form (in px _ se sfondo form attivato): distanza interna tra il bordo del form e i suoi elementi interni

Attivare sfondo form: attiva/disattiva la presenza di un colore di sfondo del form

Colore sfondo form: colore utilizzato per lo sfondo del form se attivato al punto precedente

Nascondi Form: mostra/nascondi form

Larghezza minima form (in px): dimensione minima in pixel che dovrà avere il form

Recommendation (Chiavi presenti solo nel template “Next Box Message con Recommendations”)

Layout -> Contenuto recommendation

Colore nome prodotto REC: colore con cui verrà mostrato il nome dell’articolo

Colore prezzi REC: colore con cui verrà mostrato il prezzo dell’articolo

Testo pulsante REC: CTA sul pulsante presente in ogni scheda prodotto es: “Compra ora”

Testo titolo REC: Intestazione del box contenente le raccomandazioni dei prodotti es: “Potrebbe interessarti”

Altezza immagini REC (in px): dimensione in pixel relativa all’altezza che dovrà avere l’immagine del prodotto

Dimensione nome REC (in px): dimensione del carattere utilizzato per il nome del prodotto

Dimensione prezzo REC (in px): dimensione del carattere utilizzato per il prezzo del prodotto

REC prima dei contenuti HTML: mostra la raccomandazione prima/dopo il testo inserito nel box HTML

Colore bordo tra REC e contenuto: colore della linea di separazione tra testo HTML e raccomandazioni prodotto

Dimensione bordo tra REC e contenuto: spessore della linea di separazione tra testo HTML e raccomandazioni prodotto

Nascondi titolo REC: mostra/nasconde il titolo della sezione raccomandazioni

Nascondi nome REC: mostra/nasconde il nome del prodotto nella scheda della raccomandazione

Nascondi img REC: mostra/nasconde l’immagine del prodotto nella scheda della raccomandazione

Nascondi prezzi REC: mostra/nasconde il nome del prodotto nella scheda della raccomandazione

Nascondi pulsante REC: mostra/nasconde il pulsante con il link al prodotto nella scheda della raccomandazione

Nascondi REC: mostra/nasconde il blocco contenente le raccomandazioni dei prodotti.