Blendee permette, oltre ai template default, di poter creare dei template personalizzati sia per le Recommendations che per i Behavioural message.

Vediamo punto per punto come fare:

Il primo step è recarsi nella sezione Impostazioni->Gestione template, scegliere la tipologia di web personalization per cui vogliamo creare il template: se behavioral message, recommendations, email o widget.

In questo caso facciamo l’esempio con un behavioural  message, ma il procedimento è uguale anche per gli altri elementi.

Cliccando su Template per Behavioural Message si apre una pagina in cui ci sono tre tab contenenti i template:

Generali: quindi quelli default che fornisce Blendee
Personali: sono quelli personalizzati dall’utente,
Archiviati: è la sezione dove possiamo archiviare i template inutilizzati.

Successivamente andremo a clonare il template che vogliamo utilizzare come base per le nostre personalizzazioni utilizzando il pulsante clone in basso a destra per ogni template.
Premendo clona si apre un wizard di configurazione del template, dove possiamo impostare, al primo step, il nome del template e se dovrà contenere o meno delle raccomandazioni di prodotti. E’ possibile impostare anche la tipologia di template se overlay o meno, ossia se dovrà comparire come elemento su un layer posto al di sopra della nostra pagina di partenza o come elemento integrato all’interno di quelli presenti nella pagina, andando quindi a modificare la struttura del DOM.

Allo step 2 possiamo impostare le chiavi che verranno interpretate in fase di inserimento all’interno della pagina e che ci permettono di impostare delle variabili per la personalizzazione del template, come colori, dimensioni e campi.

All’ultimo step è possibile inserire la parte di HTML e CSS relativa al nostro template personalizzato.

Una volta conclusa la configurazione, troveremo il template personalizzato nella sezione “Personali”.

Per modificare il template appena creato è sufficiente andare nella tab Personali e cliccare su “Modifica” per ritornare alla sezione di configurazione.

Una volta creato il template sarà disponibile alla sezione “Personali” in fase di creazione del messaggio comportamentale.

Con Blendee è possibile inserire prodotti raccomandati sia in Messaggi comportamentali che in Recommendation, infatti, tramite la clonazione di un template è possibile modificare il codice in modo da personalizzarlo al meglio.

Vediamo come poter aggiungere il codice base per poter inserire prodotti raccomandati ovunque.

foreach.{{products}}

..inserire il proprio codice html da ripetere per ogni elemento, ad esempio:

 <div class="ADB_IDRCTX_PLACEHOLDER_price_product ADB_hidden_##ADB_sc_card_price_bool##">
                    <div class="ADB_IDRCTX_PLACEHOLDER_price_original_product">
                        <span class="ADB_IDRCTX_PLACEHOLDER_amount">{{products}}.{{priceOriginal}}</span>
                        <span class="ADB_IDRCTX_PLACEHOLDER_currency">{{products}}.{{currencySymbol}}</span>
                    </div>
                    <div class="ADB_IDRCTX_PLACEHOLDER_price_discount_product">
                        <span class="ADB_IDRCTX_PLACEHOLDER_amount">{{products}}.{{priceDiscounted}}</span>
                        <span class="ADB_IDRCTX_PLACEHOLDER_currency">{{products}}.{{currencySymbol}}</span>
                    </div>
                </div>
...

endforeach

Il codice che vediamo sopra, serve a ripetere la struttura HTML inserita per ogni prodotto mostrato, estratto dall’algoritmo.

L’accesso ai valori relativi al prodotto raccomandato è possibile grazie all’utilizzo delle chiavi:

{{products}}.{{nomecampo}}

Come possiamo vedere dal codice sopra è possibile anche modificare il nome delle classi in real time tramite l’uso delle chiavi create in fase di personalizzazione del template (es: ##ADB_sc_card_price_bool## nel codice sopra che assumerà il valore true/false a seconda del valore selezionato nel menù laterale visibile sotto)

Le chiavi utilizzabili relative ai prodotti sono:

{{products}}.{{image}}: Url dell’immagine del prodotto

{{products}}.{{priceOriginal}}: Prezzo originale del Prodotto

{{products}}.{{priceDiscounted}}: Prezzo finale del Prodotto

{{products}}.{{priceDelivery}}: Prezzo di spedizione

{{products}}.{{name}}: Titolo del Prodotto

{{products}}.{{descriptionShort}}: Descrizione Breve del Prodotto

{{products}}.{{discount}}: Percentuale di sconto sul Prodotto

{{products}}.{{shopLink}}: Link al prodotto

{{products}}.{{currencySymbol}}: Simbolo della valuta

{{products}}.{{sku}}: SKU del prodotto

{{products}}.{{idExt}}: Id del prodotto

{{products}}.{{brand}}: Brand del prodotto

{{products}}.{{model}}: Modello del prodotto

{{products}}.{{availableQuantity}}: Quantità disponibile del prodotto

{{products}}.{{insertionDate}}: Id della categorie di appartenenza separati da spazio

{{products}}.{{categoryIds}}: Id delle categorie associate al prodotto separati da virgola.