Use propriedades de Custom Events para personalizar mensagens de Journeys com sintaxe Liquid. Saiba como os eventos sao armazenados, acessados e renderizados em templates de push, e-mail e SMS.
Custom Events permitem personalizar mensagens de Journeys usando propriedades de eventos (nomes de produtos, precos, URLs, arrays, etc.).As propriedades de eventos ficam disponiveis nos templates somente se o evento:
Aciona a entrada no Journey, ou
Corresponde a uma condicao Wait Until dentro do Journey
As propriedades de eventos armazenadas podem ser acessadas usando sintaxe Liquid.
Voce tambem pode acessar propriedades aninhadas usando notacao de ponto e colchetes:
Liquid
{{ journey.first_event.properties.details.first.manufacturer }} = Company A{{ journey.first_event.properties.details.last.manufacturer }} = Company B{{ journey.first_event.properties.details[0].manufacturer }} = Company A{{ journey.first_event.properties.details[1].manufacturer }} = Company B
Liquid invalido ou propriedades ausentes sao renderizados como strings vazias. As mensagens ainda sao enviadas. Use filtros default para definir um valor de fallback.
3
Criar um Journey
Configure o Journey para usar o Custom Event como regra de entrada e/ou condicao Wait Until.
Exemplo: Templates de carrinho abandonado usando Custom Events
Este exemplo mostra como personalizar mensagens de carrinho abandonado usando Custom Events. Ele se baseia no tutorial de Carrinho Abandonado.Exemplo de conjunto de Custom Events:
Este exemplo mostra como criar um template de e-mail que exibe:
A quantidade de itens no carrinho
Cada produto com imagem, nome, quantidade e preco usando um loop for
Um botao que direciona para a URL unica do carrinho do cliente
Exemplo de template de e-mail de carrinho abandonado
1
Criar o template de e-mail
Navegue ate Messages > Templates > New Email Template e abra o Editor Drag & Drop.
2
Adicionar a estrutura de layout
Crie cinco linhas:
Linhas 1, 2 e 4: uma coluna com um bloco Paragraph
Linha 3: quatro colunas com HTML | Paragraph | Paragraph | Paragraph
Linha 5: uma coluna com um bloco Button
Template de e-mail inicial para carrinho abandonado
3
Exibir a contagem de itens
Na linha 1, adicione:
Liquid
We're holding onto {{journey.first_event.properties.cart.size}} items in your cart, but don't wait too long!
Para melhor gramatica, voce poderia usar um condicional para dizer “1 item” vs “2 itens”, mas para e-mails de carrinho abandonado, o plural geralmente e aceitavel.
Liquid
{% assign cart = message.custom_data.cart %}{% assign item_count = cart.size | plus: 0 %}{% if item_count == 1 %}We're holding onto {{item_count}} item in your cart, but don't wait too long, other squirrels are getting ahead!{% endif %}{% if item_count > 1 %}We're holding onto {{item_count}} items in your cart, but don't wait too long, other squirrels are getting ahead!{% endif %}
4
Iniciar o loop for
Use um loop for para repetir a linha de exibicao do produto para cada item do carrinho.Na linha 2 (inicio do loop), adicione:
Liquid
{% for product in journey.first_event.properties.cart %}
O que isso faz:
Inicia um loop que itera sobre cada objeto no array cart
Cria uma variavel temporaria product representando o item atual
Tudo entre {% for %} e {% endfor %} se repete uma vez por item do carrinho
Voce pode nomear product como quiser (ex.: item, cartItem) — apenas mantenha a consistencia
Posicionamento do loop for: Certifique-se de que a sintaxe {% for %} esteja em sua propria linha de bloco de texto. Nao a coloque dentro de uma linha com varias colunas junto a outro conteudo, pois isso pode quebrar a renderizacao do e-mail em alguns clientes.
5
Exibir detalhes do produto
Esta linha de 4 colunas mostra imagem, nome, quantidade e preco. Como esta dentro do loop, ela se repete para cada item do carrinho.Na linha 3 (detalhes do produto), configure:Coluna 1 - Bloco HTML (imagem do produto):
Colunas 2-4 - Blocos de texto (nome do produto, quantidade, preco):
Coluna 2: {{product.product_name}}
Coluna 3: {{product.product_quantity}}
Coluna 4: {{product.product_price}}
Como o loop funciona:
Na primeira iteracao, product = primeiro objeto no array do carrinho
{{product.product_image}} obtem a imagem do primeiro item
Na segunda iteracao, product = segundo objeto
A linha se repete automaticamente para todos os itens do carrinho
Correspondencia de nomes de campos: Chaves como product_image devem corresponder exatamente ao payload do seu evento (diferencia maiusculas de minusculas). Incompatibilidades sao renderizadas como strings vazias.
6
Encerrar o loop for
Feche o loop para marcar onde a repeticao termina.Na linha 4 (fim do loop), adicione:
Liquid
{% endfor %}
Todo {% for %} deve ter um {% endfor %} correspondente. A ausencia dele quebrara a renderizacao do e-mail.
7
Adicionar o botao com URL do carrinho
No bloco Button da linha 5, defina a URL da acao como:
Liquid
{{journey.first_event.properties.cart_url}}
Template de e-mail base finalizado para carrinho abandonado sem estilizacao
8
Testar o template
Adicione o template a um Journey em branco e defina a regra de entrada como Custom Event.
Ative o Journey e entre nele por meio da API de Custom Events.
Notificacoes push tem espaco limitado, entao exiba um item e mencione a contagem total.Campo de mensagem:Exiba o item e a contagem com gramatica correta usando instrucoes condicionais.
Liquid
{% assign cart = journey.first_event.properties.cart %}{% assign item_count = cart.size | plus: 0 %}{% if item_count == 1 %}You left {{cart.first.product_name}} in your cart.{% endif %}{% if item_count == 2 %}You left {{cart.first.product_name}} and {{item_count | minus: 1}} more item in your cart.{% endif %}{% if item_count > 2 %}You left {{cart.first.product_name}} and {{item_count | minus: 1}} more items in your cart.{% endif %}
Envie uma notificacao push de teste adicionando-a ao Journey de teste e entrando nele por meio de outra chamada da API de Custom Events. Voce devera ver uma notificacao semelhante a esta:
Exemplo de template de push de carrinho abandonado
