Exemplo de carrinho abandonado

​

Visão geral

• Detecta quando um usuário adiciona itens a um carrinho
• Aguarda um curto período de inatividade
• Envia um lembrete personalizado
• Para o envio de mensagens imediatamente após a compra ou remoção do carrinho

• Eventos Personalizados (recomendado para a maioria das implementações)
• Tags (mais simples, casos de uso limitados)

​

O que você vai construir

• Atividade do carrinho enviada ao OneSignal (via Tags ou Eventos Personalizados)
• Um segmento que representa usuários com um carrinho ativo e abandonado
• Um Journey que:
  • Inicia quando a atividade do carrinho é detectada
  • Aguarda a inatividade
  • Envia uma mensagem de carrinho abandonado
  • Sai imediatamente quando o carrinho é esvaziado ou comprado
• Análises para medir o desempenho de mensagens e receita

​

Tags vs Eventos Personalizados

• Tags para propriedades de usuário que são estáticas e não mudam frequentemente
• Custom Events para cenários em tempo real, segmentação complexa e fluxos de trabalho de jornada mais sofisticados

​

Configuração

​

Passo 1. Decida quais dados do carrinho você deseja usar

• Número de itens no carrinho
• Nome do produto, imagem, preço e quantidade
• Um deep link de volta ao carrinho do usuário

​

Passo 2. Identifique sua fonte de dados

• App ou site → Use o SDK Frontend do OneSignal
• Backend ou banco de dados → Use a API REST do OneSignal
• Plataforma de terceiros ou integração → Use Eventos Personalizados via integração

​

Passo 3. Envie atividade do carrinho ao OneSignal

1. Carrinho atualizado - quando itens são adicionados
2. Carrinho esvaziado - quando itens são removidos ou o checkout é concluído

// Adicionar os itens do carrinho às propriedades do evento
OneSignal.User.trackEvent("cart_updated", {
  product_name: "24 Pack of Acorns",
  product_image: "https://i.imgur.com/ssPCfbC.png",
  product_price: 12.99,
  product_quantity: 1,
  cart_url: "https://yourdomain.com/username/cart"
});

// Enviar o evento ao OneSignal
OneSignal.User.trackEvent("cart_emptied");

{
  "events": [
    {
      "name": "cart_updated",
      "properties": {
        "product_name": "24 Pack of Acorns",
        "product_image": "https://i.imgur.com/ssPCfbC.png",
        "product_price": "$12.99",
        "product_quantity": "1",
        "cart_url": "https://yourdomain.com/username/cart"
      },
      "external_id": "ID_OF_THE_USER"
    }
  ]
}

{
  "events": [
    {
      "name": "cart_emptied",
      "external_id": "ID_OF_THE_USER"
    }
  ]
}

​

Passo 4. Crie modelos de mensagem de carrinho abandonado

• Sintaxe Liquid
• Personalização de Mensagem
• Modelos

• Evento Personalizado: Modelo Push
• Tag: Modelo Push

Referencie propriedades do evento usando formato de sintaxe liquid:

Copiar

Perguntar à IA

{{journey.event.name.properties.property_name | default: "fallback_value"}}

• Título: Oi, Gatinho Legal 😸!
• Mensagem: Você deixou {{journey.event.cart_updated.properties.product_name | default: "itens"}} no seu carrinho.
• Imagem: {{journey.event.cart_updated.properties.product_image | default: "https://i.imgur.com/ssPCfbC.png"}}
• URL de Lançamento: {{journey.event.cart_updated.properties.cart_url | default: "https://yourdomain.com/cart"}}

A imagem não será exibida se product_image não for uma URL de imagem direta e publicamente acessível.Se seu product_image for o nome de um arquivo de imagem disponível online, você pode referenciar a imagem usando o seguinte formato: https://yourdomain.com/images/{{journey.event.cart_updated.properties.product_image | default: "stock_image"}}.png

Referencie propriedades do evento usando formato de sintaxe liquid:

Copiar

Perguntar à IA

{{tag_key | default: "fallback_value"}}

• Título: Oi, Gatinho Legal 😸!
• Mensagem: Você deixou {{product_name | default: "itens"}} no seu carrinho.
• Imagem: {{product_image | default: "https://i.imgur.com/ssPCfbC.png"}}
• URL de Lançamento: {{cart_url | default: "https://yourdomain.com/cart"}}

A imagem não será exibida se product_image não for uma URL de imagem direta e publicamente acessível.Se seu product_image for o nome de um arquivo de imagem disponível online, você pode referenciar a imagem usando o seguinte formato: https://yourdomain.com/images/{{journey.event.cart_updated.properties.product_image | default: "stock_image"}}.png

​

Passo 5. Crie o Segmento de carrinho abandonado

• Evento Personalizado: Segmento de Carrinho Abandonado
• Tag: Segmento de Carrinho Abandonado

Selecione o filtro de Evento Personalizado para rastrear usuários onde o evento cart_updated foi realizado pelo menos 1 vez nos últimos 24 horas

Agora podemos rastrear usuários que atualizam seu carrinho pelo menos uma vez a cada 24 horas.Os usuários serão automaticamente removidos do segmento após 24 horas terem passado desde que atualizaram seu carrinho pela última vez.

Selecione o filtro de Tag de Usuário para rastrear usuários onde a tag cart_updated existe E selecione o filtro de Última Sessão é menos de 7 dias atrás

Agora podemos rastrear usuários que atualizam seu carrinho e visitaram o app ou site nos últimos 7 dias.Os usuários serão automaticamente removidos do segmento quando qualquer uma das seguintes condições for atendida:

• Após 7 dias terem passado desde que visitaram o app/site pela última vez
• Quando a tag cart_updated for removida

​

Passo 6. Crie o Journey de carrinho abandonado

• Journeys
• Configurações do Journey

​

Configurações do Journey

• Selecione Segmento de Público
• Incluir Segmento: Carrinho Abandonado - cart_updated

• Evento Personalizado: Regras de Saída
• Tag: Regras de Saída

• Selecione Atender a uma determinada condição
• Marque Sair quando a condição do evento personalizado ocorrer
• Nome do Evento Personalizado: cart_emptied

Os usuários sairão do Journey quando:

• O evento cart_emptied (do passo 3) for realizado.
• Eles completarem o Journey.

• Selecione Atender a uma determinada condição
• Marque Sair quando um usuário não corresponder mais às condições de público

Os usuários sairão do Journey quando:

• Eles saírem do segmento.
• Eles completarem o Journey.

• Selecione Sim, após um determinado período de tempo
• Defina o tempo de reentrada para 1 dia

​

Passos do Journey

1. Dar ao usuário tempo suficiente para esvaziar seu carrinho (fazer uma compra ou esvaziar seu carrinho manualmente)
2. Se eles não esvaziarem seu carrinho, enviar uma mensagem lembrando-os sobre os itens em seu carrinho

• Defina o tempo de espera pelo tempo que você desejar. Recomendamos defini-lo para 1 hora para que você possa enviar mensagens a eles enquanto ainda têm a intenção de comprar.

• Selecione o modelo de Notificação Push de Carrinho Abandonado que você criou no Passo 4.

​

Configuração Avançada do Journey

​

Sequência de Mensagens

1. Enviar a primeira mensagem após 1 hora (completado neste guia).
2. Adicionar outro passo de Aguardar por 1 dia e enviar uma segunda mensagem (~24 horas desde que atualizaram seu carrinho).
3. Adicionar outro passo de Aguardar por 2 dias e enviar uma terceira mensagem (~72 horas desde que atualizaram seu carrinho).

1. Este guia mostra como enviar uma mensagem de notificação push após a primeira hora. Isso é usado como um lembrete útil para tentar capturar a venda enquanto o usuário ainda pode estar online.
2. Considere usar tanto push quanto e-mail para sua segunda mensagem. Use esta segunda mensagem para destacar benefícios e prova social com leve urgência para encorajá-los a comprar.
3. Para a mensagem final da sequência, use um e-mail ou talvez um SMS (dependendo do caso de uso) como uma “última chamada”. Considere usar um código de desconto ou outro incentivo para encorajá-los a comprar.

​

Mensagens de Contingência

​

Rastrear desempenho

​

Rastrear receita com Outcomes

// Exemplo: capturar preço total e contagem de itens no checkout
const checkoutPriceTotal = document.querySelector(".checkout-price-total").innerText;
const checkoutItemsTotal = document.querySelector(".checkout-items-total").innerText;

function updateOSOnCartPurchase(checkoutPriceTotal, checkoutItemsTotal) {
  const purchasePriceTotal = parseFloat(checkoutPriceTotal);
  const purchasedItemCount = parseInt(checkoutItemsTotal);

  OneSignalDeferred.push(function (OneSignal) {
    OneSignal.Session.sendOutcome("Purchase", purchasePriceTotal);
    OneSignal.Session.sendOutcome("Purchased Item Count", purchasedItemCount);
  });
}

const submitPurchaseButton = document.querySelector(".submit-payment");
if (submitPurchaseButton) {
  submitPurchaseButton.addEventListener("click", () => {
    updateOSOnCartPurchase(checkoutPriceTotal, checkoutItemsTotal);
  });
}