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

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

Verranno utilizzati i seguenti tipi di funzioni di supporto:

➡️ Scopri come utilizzare le funzioni helper in questo video

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

Segui questi passaggi:

  1. Creare l’evento iniziale e il 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, devi aggiungere un evento iniziale e l’e-mail a un percorso prima di poter aggiungere informazioni specifiche sul carrello all’e-mail.

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

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

    Ulteriori informazioni sul tipo di dati dell’elemento dell’elenco prodotti Documentazione di Adobe Experience Platform.

  3. Crea un percorso che inizia con questo evento.

  4. Aggiungi un E-mail attività al percorso.

Passaggio 2: Creare l’e-mail

  1. In E-mail attività, fai clic su Edit content, quindi fai clic su Email Designer.

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

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

Passaggio 3: Inserire il nome del cliente in lettere maiuscole

  1. Nella home page di E-mail Designer, fare clic sul componente HTML in cui si desidera aggiungere il nome del cliente.

  2. Sulla barra degli strumenti contestuale, fai clic su Show the source code.

  3. In Edit HTML aggiungi upperCase funzione stringa:

    1. Nel menu a sinistra, seleziona Helper functions.

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

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

      L’editor espressioni mostra questa espressione:

      {%= upperCase(string) %}
      

  4. Rimuovere il segnaposto "string" dall'espressione.

  5. Aggiungi il token del nome:

    1. Nel menu a sinistra, seleziona Profile attributes.

    2. Seleziona Person > Full name.

    3. Aggiungi il First name token dell'espressione.

      L’editor espressioni mostra questa espressione:

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

      Ulteriori informazioni sul tipo di dati del nome della persona in Documentazione di Adobe Experience Platform.

  6. Fai clic su Validate, quindi su Save.

  7. Salva il messaggio.

Passaggio 4: Inserisci l'elenco degli elementi dal carrello

  1. Riapri il contenuto del messaggio.

  2. Nella home page di E-mail Designer, fare clic sul componente HTML in cui si desidera elencare il contenuto del carrello.

  3. Sulla barra degli strumenti contestuale, fai clic su Show the source code.

  4. In Edit HTML aggiungi each helper:

    1. Nel menu a sinistra, seleziona Helper functions.

    2. Usa il campo di ricerca per trovare "ogni".

    3. Dai risultati della ricerca, aggiungi la each aiutante.

      L’editor espressioni mostra questa espressione:

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

  5. Aggiungi il productListItems all'espressione:

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

    2. Nel menu a sinistra, seleziona Contextual attributes.

      Contextual attributes sono disponibili solo dopo che il contesto del percorso è stato trasmesso al messaggio.

    3. Seleziona Journey Optimizer > Events > event_name, quindi espandi il productListItems nodo.

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

    4. Aggiungi il Product token dell'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. Modificare l’espressione:

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

      Questo esempio mostra l'espressione modificata:

      {{#each context.journey.events.event_ID.productListItems as |product|}}
      
  6. Incolla questo codice tra l'apertura {{#each}} e la 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 precedenti, aggiungi la Name token dell'espressione.

    Ripeti due volte questi passaggi:

    • Sostituisci il segnaposto "#quantità" con il Quantity token.
    • Sostituisci il segnaposto "#priceTotal" con il Total price 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. Fai clic su Validate, quindi su Save.

Passaggio 5: Inserire una nota specifica per il prodotto

  1. Nella home page di E-mail Designer, fare clic sul componente HTML in cui si desidera inserire la nota.

  2. Sulla barra degli strumenti contestuale, fai clic su Show the source code.

  3. In Edit HTML aggiungi if helper:

    1. Nel menu a sinistra, seleziona Helper functions.

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

    3. Dai risultati della ricerca, aggiungi la 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. Rimuovere il segnaposto "condizione1" dall'espressione.

    2. Nel menu a sinistra, seleziona Contextual attributes.

    3. Seleziona Journey Orchestration > Events > event_name, quindi espandi il productListItems nodo.

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

    4. Aggiungi il Name token dell'espressione.

      L’editor espressioni mostra questa espressione:

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

  6. Modificare l’espressione:

    1. Nell’editor espressioni, specifica il nome del prodotto dopo il 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. Sostituire 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. Rimuovere il segnaposto "default_render" dall'espressione.

  7. Fai clic su Validate, quindi su Save.

  8. Salva il messaggio.

Passaggio 6: Test e pubblicazione del percorso

  1. Accendere Test attiva/disattiva, quindi fai clic su Trigger an event.

  2. In Event configuration immetti i valori immessi, quindi fai clic su Send.

    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 è nel carrello:

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

Funzioni del manubrio

Casi d’uso

Video introduttivo

Scopri come utilizzare le funzioni di supporto.

In questa pagina