Caso de uso do Personalization: email de abandono de carrinho personalization-use-case-helper-functions

Crie um evento cujo esquema inclua a matriz productListItems.

Defina todos os campos dessa matriz como campos de carga para esse evento.

Saiba mais sobre o tipo de dados do item de lista de produtos na documentação do Adobe Experience Platform.

Crie uma jornada que comece com este evento.

Adicione uma atividade de Email à jornada.

Na atividade de Email, clique em Editar conteúdo e em Email Designer.

Na paleta esquerda da página inicial do Designer de email, arraste e solte três componentes de estrutura no corpo da mensagem.

Arraste e solte um componente de conteúdo de HTML em cada novo componente de estrutura.

Na página inicial do Designer de email, clique no componente de HTML onde deseja adicionar o nome do cliente.

Na barra de ferramentas contextual, clique em Mostrar o código-fonte.

Na janela Editar HTML, adicione a função de sequência de caracteres upperCase:

1. No menu esquerdo, selecione funções auxiliares.

2. Use o campo de pesquisa para localizar "caixa alta".

3. Nos resultados da pesquisa, adicione a função upperCase. Para fazer isso, clique no sinal de adição (+) ao lado de {%= upperCase(string) %}: string.

   O editor de expressão mostra esta expressão:

   code language-handlebars
   {%= upperCase(string) %}

   

Remova o espaço reservado "string" da expressão.

Adicione o token de nome:

1. No menu esquerdo, selecione Atributos do perfil.

2. Selecione Pessoa > Nome completo.

3. Adicione o token Nome à expressão.

   O editor de expressão mostra esta expressão:

   code language-handlebars
   {%= upperCase(profile.person.name.firstName) %}

   

   Saiba mais sobre o tipo de dados do nome da pessoa na documentação da Adobe Experience Platform.

Clique em Validar e em Salvar.

Salve a mensagem.

Reabra o conteúdo da mensagem.

Na página inicial do Designer de email, clique no componente de HTML onde deseja listar o conteúdo do carrinho.

Na barra de ferramentas contextual, clique em Mostrar o código-fonte.

Na janela Editar HTML, adicione o auxiliar each:

1. No menu esquerdo, selecione funções auxiliares.

2. Use o campo de pesquisa para localizar "cada".

3. Nos resultados da pesquisa, adicione o auxiliar do each.

   O editor de expressão mostra esta expressão:

   code language-handlebars
   {{#each someArray as |variable|}} {{/each}}

   

Adicionar a matriz productListItems à expressão:

1. Remova o espaço reservado "someArray" da expressão.

2. No menu esquerdo, selecione Atributos contextuais.

   Atributos contextuais só estão disponíveis depois que o contexto de jornada é passado para a mensagem.

3. Selecione Journey Optimizer > Events > event_name e expanda o nó productListItems.

   Neste exemplo, event_name representa o nome do evento.

4. Adicionar o token do Produto à expressão.

   O editor de expressão mostra esta expressão:

   code language-handlebars
   {{#each context.journey.events.event_ID.productListItems.product as |variable|}} {{/each}}

   Neste exemplo, event_ID representa a ID do evento.

   

5. Modifique a expressão:

   1. Remova a string ".product".
   2. Substitua o espaço reservado "variável" por "produto".

   Este exemplo mostra a expressão modificada:

   code language-handlebars
   {{#each context.journey.events.event_ID.productListItems as |product|}}

Cole este código entre a tag de abertura {{#each}} e a tag de fechamento {/each}}:

<table>
   <tbody>
      <tr>
         <td><b>#name</b></td>
         <td><b>#quantity</b></td>
         <td><b>$#priceTotal</b></td>
      </tr>
   </tbody>
</table>

Adicione os tokens de personalização para o nome do item, a quantidade e o preço:

1. Remova o espaço reservado "#name" da tabela de HTML.
2. A partir dos resultados da pesquisa anterior, adicione o token Name à expressão.

Repita essas etapas duas vezes:

• Substitua o espaço reservado "#quantity" pelo token de Quantidade.
• Substitua o espaço reservado "#priceTotal" pelo token de Preço total.

Este exemplo mostra a expressão modificada:

{{#each context.journey.events.event_ID.productListItems as |product|}}
   <table>
      <tbody>
         <tr>
         <td><b>{{product.name}}</b></td>
         <td><b>{{product.quantity}}</b></td>
         <td><b>${{product.priceTotal}}</b></td>
         </tr>
      </tbody>
   </table>
{{/each}}

Clique em Validar e em Salvar.

Na página inicial do Designer de email, clique no componente de HTML onde deseja inserir a nota.

Na barra de ferramentas contextual, clique em Mostrar o código-fonte.

Na janela Editar HTML, adicione o auxiliar if:

1. No menu esquerdo, selecione funções auxiliares.

2. Use o campo de pesquisa para localizar "if".

3. Nos resultados da pesquisa, adicione o auxiliar do if.

   O editor de expressão mostra esta expressão:

   code language-handlebars
   {%#if condition1%} render_1 {%else if condition2%} render_2 {%else%} default_render {%/if%}

   

Remova essa condição da expressão:

{%else if condition2%} render_2

Este exemplo mostra a expressão modificada:

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

Adicione o token do nome do produto à condição:

1. Remova o espaço reservado "condition1" da expressão.

2. No menu esquerdo, selecione Atributos contextuais.

3. Selecione Journey Orchestration > Events > event_name e expanda o nó productListItems.

   Neste exemplo, event_name representa o nome do evento.

4. Adicione o token Name à expressão.

   O editor de expressão mostra esta expressão:

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

   

Modifique a expressão:

1. No editor de expressão, especifique o nome do produto após o token name.

   Use esta sintaxe, onde product_name representa o nome do seu produto:

   code language-javascript
   = "product_name"

   Neste exemplo, o nome do produto é "Juno Jacket":

   code language-handlebars
   {%#if context.journey.events.`event_ID`.productListItems.name = "Juno Jacket" %} render_1 {%else%} default_render {%/if%}

2. Substitua o espaço reservado "render_1" pelo texto da nota.

   Exemplo:

   code language-handlebars
   {%#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. Remova o espaço reservado "default_render" da expressão.

Clique em Validar e em Salvar.

Salve a mensagem.

Ative a opção Testar e clique em Acionar um evento.

Na janela Configuração de evento, digite os valores de entrada e clique em Enviar.

O modo de teste funciona somente com perfis de teste.

O email é enviado para o endereço do perfil de teste.

Neste exemplo, o email contém a observação sobre o Juno Jacket porque este produto está no carrinho:

Verifique se não há erros e publique a jornada.