Evidenziare i prezzi scontati e la relativa percentuale di sconto nei prodotti consigliati consente di aumentare le conversioni nell’eCommerce. Tramite stili e classi CSS, puoi mostrare la percentuale di sconto e l’importo originale barrato, accanto al prezzo attuale, solo nei prodotti in promozione.
In questo articolo imparerai come mostrare in un’email la percentuale di sconto solo quando esiste uno sconto.
PASSO 1. Crea un design di email
1. Accedi a “Contenuto > Email” e fai clic su Crea nuova email.
2. Includi nel design almeno un componente avanzato di tipo Prodotti.
PASSO 2. Crea la variabile nel contenuto dinamico
3. Seleziona il blocco di prodotti e, nell’editor incluso in Proprietà, fai clic su Variabili per crearne una nuova nel punto in cui desideri visualizzare il prezzo scontato.
4. Dai un nome alla variabile che mostrerà il prezzo scontato. Puoi chiamarla: "originalPrice".
5. Clicca su Accetta per salvare le modifiche.
6. Seguendo gli stessi passaggi, crea la variabile che conterrà lo sconto. Puoi chiamarla: "discount".
7. Vai alla scheda Variabili e fai clic su (Modifica) sulla variabile appena creata ("originalPrice").
8. Assegna alla variabile il tipo di dato "Valuta".
9. Premi su Accetta per salvare le modifiche.
10. Seleziona di nuovo il blocco di prodotti dinamico e, nella sezione Editor, fai clic sull’opzione HTML.
11. Nell’editor del contenuto dinamico, assegna la classe con i seguenti stili CSS agli elementi che mostrano le variabili del prezzo originale e dello sconto:
- Il blocco che include la percentuale di sconto è il seguente:
<h5 style="text-align: center;"><strong>{{title}} <span style="background-color: #FF0000; color: #FFFFFF;{{__cn_expression|HIDE_WHEN_ZERO(discount)}}"> {{discount}}</span></strong></h5>
- Il blocco che include il prezzo originale barrato è il seguente:
<h5 style="text-align: center;"><br><span style="color: #808080; text-decoration : line-through;{{__cn_expression|HIDE_WHEN_ZERO(discount)}}">{{originalPrice}}</span><span style="font-size: 12pt;"> {{price}}</span></h5>
12. Clicca su Applica per salvare le modifiche al codice HTML e chiudi l’editor di email facendo clic su Salva.
PASSO 3. Crea un workflow per inviare l’email
13. Accedi a “Workflows” e fai clic su Crea nuovo workflow.
14. Nel nodo “Invia email”, fai clic su (Modifica configurazione del nodo) e configura l’assegnazione delle variabili.
15. Fai clic su Applica per salvare le modifiche nel nodo e salva tutte le modifiche del workflow.
16. Clicca su Avvia per attivare il workflow.
17. Accedi al tuo gestore email via web e verifica che le percentuali di sconto siano visualizzate correttamente nell’email.
Continua a imparare!
Per sfruttare tutto il potenziale del tuo account Connectif, ti consigliamo di proseguire con i seguenti articoli:
-
Mostrare la percentuale di sconto solo se esiste in un contenuto web, per applicare la stessa funzionalità nei contenuti web.
-
Campagna settimanale di prodotti consigliati, per inviare ogni settimana una newsletter con raccomandazioni personalizzate.
-
Carrello abbandonato + raccomandazioni, per inviare un’email ai contatti con i prodotti abbandonati nel carrello e altri articoli correlati.
- Prodotti complementari dopo l’acquisto, per inviare un’email con prodotti complementari a quelli acquistati, dopo un periodo di inattività.