Caso di utilizzo della personalizzazione: e-mail di abbandono del carrello

Ultimo aggiornamento: 2023-08-17
  • Argomenti:
  • Personalization
    Visualizza ulteriori informazioni su questo argomento
  • Creato per:
  • Intermediate
    Developer

In questo esempio personalizzerai il corpo di un messaggio e-mail. Questo messaggio è destinato ai clienti che hanno lasciato articoli nel carrello ma non hanno completato l’acquisto.

Puoi utilizzare i seguenti tipi di funzioni di assistenza:

  • Il upperCase funzione stringa, per inserire il nome del cliente in lettere maiuscole. Ulteriori informazioni.
  • Il each helper, per elencare gli elementi presenti nel carrello. Ulteriori informazioni.
  • Il if helper, per inserire una nota specifica per il prodotto se il prodotto correlato si trova nel carrello. Ulteriori informazioni.

➡️ Scopri come utilizzare le funzioni di assistenza in questo video

Prima di iniziare, assicurati di sapere come configurare questi elementi:

Segui questi passaggi:

  1. Creazione dell'evento iniziale e del percorso.
  2. Creare un messaggio e-mail.
  3. Inserire il nome del cliente in lettere maiuscole.
  4. Aggiungi il contenuto del carrello all’e-mail.
  5. Inserire una nota specifica per il prodotto.
  6. Test e pubblicazione del percorso.

Passaggio 1: creare l’evento iniziale e il percorso correlato

Il contenuto del carrello è un’informazione contestuale proveniente dal percorso. Pertanto, è necessario aggiungere un evento iniziale e l’e-mail a un percorso prima di poter aggiungere all’e-mail informazioni specifiche per il carrello.

  1. Crea un evento il cui schema include productListItems array.

  2. Definisci tutti i campi di questo array come campi payload per questo evento.

    Ulteriori informazioni sul tipo di dati delle voci dell’elenco dei prodotti Documentazione di Adobe Experience Platform.

  3. Crea un percorso che inizia con questo evento.

  4. Aggiungi un E-mail al percorso.

Passaggio 2: creare l’e-mail

  1. In E-mail attività, fai clic su Modifica contenuto, quindi fai clic su E-mail Designer.

  2. Dalla palette a sinistra della home page di E-mail Designer, trascina e rilascia tre componenti struttura sul corpo del messaggio.

  3. Trascina e rilascia un componente di contenuto HTML su ciascun nuovo componente struttura.

Passaggio 3: inserire il nome del cliente in lettere maiuscole

  1. Nella pagina Home di E-mail designer, fai clic sul componente HTML in cui desideri aggiungere il nome del cliente.

  2. Sulla barra degli strumenti contestuale, fai clic su Mostra il codice sorgente.

  3. In Modifica HTML , aggiungi il upperCase funzione stringa:

    1. Nel menu a sinistra, seleziona Funzioni di supporto.

    2. Utilizza il campo di ricerca per trovare "maiuscolo".

    3. Dai risultati della ricerca, aggiungi upperCase funzione. A tale scopo, fare clic sul segno più (+) accanto a {%= upperCase(string) %}: string.

      L’editor espressioni mostra questa espressione:

      {%= upperCase(string) %}
      

  4. Rimuovi il segnaposto "stringa" dall’espressione.

  5. Aggiungi il token di nome:

    1. Nel menu a sinistra, seleziona Attributi del profilo.

    2. Seleziona Persona > Nome e cognome.

    3. Aggiungi il Nome token per l’espressione.

      L’editor espressioni mostra questa espressione:

      {%= upperCase(profile.person.name.firstName) %}
      

      Ulteriori informazioni sul tipo di dati Nome persona in Documentazione di Adobe Experience Platform.

  6. Clic Convalida, quindi fai clic su Salva.

  7. Salva il messaggio.

Passaggio 4: inserire l’elenco degli articoli dal carrello

  1. Riapri il contenuto del messaggio.

  2. Nella pagina Home di E-mail designer, fai clic sul componente HTML in cui desideri elencare il contenuto del carrello.

  3. Sulla barra degli strumenti contestuale, fai clic su Mostra il codice sorgente.

  4. In Modifica HTML , aggiungi il each helper:

    1. Nel menu a sinistra, seleziona Funzioni di supporto.

    2. Utilizza il campo di ricerca per trovare "ciascuno".

    3. Dai risultati della ricerca, aggiungi each aiutante.

      L’editor espressioni mostra questa espressione:

      {{#each someArray as |variable|}} {{/each}}
      

  5. Aggiungi il productListItems array all’espressione:

    1. Rimuovi il segnaposto "someArray" dall’espressione.

    2. Nel menu a sinistra, seleziona Attributi contestuali.

      Attributi contestuali sono disponibili solo dopo che il contesto del percorso è stato passato al messaggio.

    3. Seleziona Journey Optimizer > Eventi > nome_evento, quindi espandi productListItems nodo.

      In questo esempio, nome_evento rappresenta il nome dell’evento.

    4. Aggiungi il Prodotto token per l’espressione.

      L’editor espressioni mostra questa espressione:

      {{#each context.journey.events.event_ID.productListItems.product as |variable|}} {{/each}}
      

      In questo esempio, event_ID rappresenta l’ID dell’evento.

    5. Modifica l’espressione:

      1. Rimuovi la stringa ".product".
      2. Sostituisci il segnaposto "variable" con "product".

      Questo esempio mostra l’espressione modificata:

      {{#each context.journey.events.event_ID.productListItems as |product|}}
      
  6. Incolla questo codice tra le aperture {{#each}} tag e chiusura {/each}} tag:

    <table>
       <tbody>
          <tr>
             <td><b>#name</b></td>
             <td><b>#quantity</b></td>
             <td><b>$#priceTotal</b></td>
          </tr>
       </tbody>
    </table>
    
  7. Aggiungi i token di personalizzazione per il nome dell’articolo, la quantità e il prezzo:

    1. Rimuovere il segnaposto "#name" dalla tabella HTML.
    2. Dai risultati della ricerca precedente, aggiungi Nome token per l’espressione.

    Ripeti questi passaggi due volte:

    • Sostituire il segnaposto "#quantity" con Quantità token.
    • Sostituire il segnaposto "#priceTotal" con Prezzo totale token.

    Questo esempio mostra l’espressione modificata:

    {{#each context.journey.events.event_ID.productListItems as |product|}}
       <table>
          <tbody>
             <tr>
                <td><b>{{context.journey.events.event_ID.productListItems.name}}</b></td>
                <td><b>{{context.journey.events.event_ID.productListItems.quantity}}</b></td>
                <td><b>${{context.journey.events.event_ID.productListItems.priceTotal}}</b></td>
             </tr>
          </tbody>
       </table>
    {{/each}}
    
  8. Clic Convalida, quindi fai clic su Salva.

Passaggio 5: inserire una nota specifica per il prodotto

  1. Nella pagina Home di E-mail designer, fai clic sul componente HTML in cui desideri inserire la nota.

  2. Sulla barra degli strumenti contestuale, fai clic su Mostra il codice sorgente.

  3. In Modifica HTML , aggiungi il if helper:

    1. Nel menu a sinistra, seleziona Funzioni di supporto.

    2. Utilizza il campo di ricerca per trovare "if".

    3. Dai risultati della ricerca, aggiungi if aiutante.

      L’editor espressioni mostra questa espressione:

      {%#if condition1%} render_1
         {%else if condition2%} render_2
         {%else%} default_render
      {%/if%}
      

  4. Rimuovi questa condizione dall’espressione:

    {%else if condition2%} render_2
    

    Questo esempio mostra l’espressione modificata:

    {%#if condition1%} render_1
       {%else%} default_render
    {%/if%}
    
  5. Aggiungi il token del nome del prodotto alla condizione:

    1. Rimuovi il segnaposto "condition1" dall’espressione.

    2. Nel menu a sinistra, seleziona Attributi contestuali.

    3. Seleziona Journey Orchestration > Eventi > nome_evento, quindi espandi productListItems nodo.

      In questo esempio, nome_evento rappresenta il nome dell’evento.

    4. Aggiungi il Nome token per l’espressione.

      L’editor espressioni mostra questa espressione:

      {%#if context.journey.events.`event_ID`.productListItems.name%}
         render_1
         {%else%} default_render
      {%/if%}
      

  6. Modifica l’espressione:

    1. Nell’editor espressioni, specifica il nome del prodotto dopo name token.

      Utilizza questa sintassi, dove product_name rappresenta il nome del prodotto:

      = "product_name"
      

      In questo esempio, il nome del prodotto è "Juno Jacket":

      {%#if context.journey.events.`event_ID`.productListItems.name = "Juno Jacket" %}
         render_1
         {%else%} default_render
      {%/if%}
      
    2. Sostituite il segnaposto "render_1" con il testo della nota.

      Esempio:

      {%#if context.journey.events.`event_ID`.productListItems.name = "Juno Jacket" %}
         Due to longer than usual lead times on the Juno Jacket, please expect item to ship two weeks after purchase.
         {%else%} default_render
      {%/if%}
      
    3. Rimuovi il segnaposto "default_render" dall’espressione.

  7. Clic Convalida, quindi fai clic su Salva.

  8. Salva il messaggio.

Passaggio 6: testare e pubblicare il percorso

  1. Attiva Test , quindi fai clic su Attivare un evento.

  2. In Configurazione evento immettere i valori di input, quindi fare clic su Invia.

    La modalità di test funziona solo con i profili di test.

    L’e-mail viene inviata all’indirizzo del profilo di test.

    In questo esempio, l’e-mail contiene la nota sulla Giacca Juno, perché questo prodotto si trova nel carrello:

  3. Verifica che non vi sia alcun errore, quindi pubblica il percorso.

Funzioni Handlebars

Casi d’uso

Video introduttivo

Scopri come utilizzare le funzioni di assistenza.

In questa pagina