カート放棄チュートリアル

​

概要

• カートアクティビティの検出
• 短い非アクティブ期間の待機
• パーソナライズされたリマインダーの送信
• 購入またはカート削除後のメッセージ送信即時停止

• Custom Events（ほとんどの実装に推奨）
• Tags（よりシンプルで、限定的なユースケース）

​

構築する内容

• OneSignalに送信されるカートアクティビティ（TagsまたはCustom Eventsを経由）
• 明確なコード定義の放棄シグナル
• カートデータをパーソナライズするメッセージテンプレート
• 以下を実行するJourney：
  • 放棄シグナルが受信されたときに開始
  • 送信前に待機
  • カート放棄メッセージを送信
  • カートが空になるか購入されたときに即座に終了
• メッセージと収益のパフォーマンスを測定するAnalytics

​

トラッキング方法の選択

• Custom Eventsを使用する場合：
  • 非アクティブ期間後に放棄を検出できる
  • リッチなカートデータ（アイテム、画像、価格）が必要
  • イベントが放棄ごとに1回だけ発火することを保証できる
• Tagsを使用する場合：
  • デフォルトで状態ベースの安全性が必要
  • シンプルなカートデータのみが必要
  • セグメント制御のエントリーとエグジットを好む

​

カート放棄のモデリング方法

• 意味のある非アクティブ期間の後（例：1時間）
• カートにまだアイテムが含まれている場合のみ

​

Journeysが放棄シグナルを使用する方法

• ユーザーがJourneyにエントリーする資格を得ます
• 待機期間により自然に戻る時間が与えられます
• エグジットしない場合のみメッセージが送信されます
• cart_emptiedが受信されるとユーザーは即座にエグジットします

​

セットアップ

​

ステップ1. カートデータとソースを計画する

• 商品名、画像、価格、数量
• カート内のアイテム数
• カートに戻るディープリンク

​

ステップ2. カート状態シグナルをOneSignalに送信する

OneSignal.User.trackEvent("cart_abandoned", {
  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/cart"
});

OneSignal.User.addTags({
  cart_updated: unix_timestamp_seconds,
  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"
})

{
  "events": [
    {
      "name": "cart_abandoned",
      "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"
    }
  ]
}

{
  "properties": {
    "tags": {
      "cart_updated": "unix_timestamp_seconds",
      "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"
    }
  }
}

​

ステップ3. カート放棄メッセージテンプレートを作成する

• Liquid構文
• メッセージのパーソナライゼーション
• テンプレート

• Custom Eventプッシュテンプレート
• Tagプッシュテンプレート

Liquid構文形式を使用してイベントプロパティを参照します：

Liquid

コピー

AIに質問

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

メッセージ：

Liquid

コピー

AIに質問

You left {{journey.event.cart_abandoned.properties.product_name | default: "items"}} in your cart.

画像：

Liquid

コピー

AIに質問

{{journey.event.cart_abandoned.properties.product_image | default: "https://i.imgur.com/ssPCfbC.png"}}

起動URL：

Liquid

コピー

AIに質問

{{journey.event.cart_abandoned.properties.cart_url | default: "https://yourdomain.com/cart"}}

product_imageが直接的な、一般公開されている画像URLでない場合、画像は表示されません。product_imageがオンラインで利用可能な画像ファイルの名前である場合、以下の形式を使用して画像を参照できます： https://yourdomain.com/images/{{journey.event.cart_abandoned.properties.product_image | default: "stock_image"}}.png

Liquid構文形式を使用してタグプロパティを参照します：

Liquid

コピー

AIに質問

{{tag_key | default: "fallback_value"}}

メッセージ：

Liquid

コピー

AIに質問

You left {{product_name | default: "items"}} in your cart.

画像：

Liquid

コピー

AIに質問

{{product_image | default: "https://i.imgur.com/ssPCfbC.png"}}

起動URL：

Liquid

コピー

AIに質問

{{cart_url | default: "https://yourdomain.com/cart"}}

product_imageが直接的な、一般公開されている画像URLでない場合、画像は表示されません。product_imageがオンラインで利用可能な画像ファイルの名前である場合、以下の形式を使用して画像を参照できます： https://yourdomain.com/images/{{journey.event.cart_updated.properties.product_image | default: "stock_image"}}.png

​

ステップ4. カート放棄セグメントを作成する（Tagsのみ）

​

ステップ5. カート放棄Journeyを作成する

​

Journeyの設定

• Custom Event: エントリールール
• Tag: エントリールール

• Custom Eventを選択
• Custom Event名：cart_abandoned

ユーザーはcart_abandonedイベントが送信されるたびにJourneyにエントリーします。意味のある非アクティブ期間の後にのみこのイベントを送信してください。

• Audience Segmentを選択
• セグメントを含める：Abandoned Cart - cart_updated

• Custom Event: エグジットルール
• Tag: エグジットルール

• Meet a certain conditionを選択
• Exit when custom event condition occursをチェック
• Custom Event名：cart_emptied

ユーザーは以下の場合にJourneyからエグジットします：

• cart_emptiedイベント（ステップ3から）が実行された場合。
• Journeyを完了した場合。

• Meet a certain conditionを選択
• Exit when a user no longer matches the audience conditionsをチェック

ユーザーは以下の場合にJourneyからエグジットします：

• セグメントを離れた場合。
• Journeyを完了した場合。

• Yes, after a certain amount of timeを選択
• 再エントリー時間を1 dayに設定

​

Journeyのステップ

1. ユーザーにカートを空にする十分な時間を与える（購入するか手動でカートを空にする）
2. カートを空にしない場合、カート内のアイテムについてリマインダーメッセージを送信する

• 待機時間を希望する長さに設定します。購入意思がまだあるうちにメッセージを送信できるように、1 hourに設定することを推奨します。

• ステップ4で作成したAbandoned Cartプッシュ通知テンプレートを選択します。

​

高度なJourneyセットアップ

​

メッセージシーケンス

1. 1時間後に最初のメッセージを送信（このガイドで完了）。
2. 1日間の別のWaitステップを追加し、2番目のメッセージを送信（カート更新後約24時間）。
3. 2日間の別のWaitステップを追加し、3番目のメッセージを送信（カート更新後約72時間）。

1. このガイドでは、最初の1時間後にプッシュ通知メッセージを送信する方法を示しています。これは、ユーザーがまだオンラインである可能性がある間に販売を獲得するための有用なリマインダーとして使用されます。
2. 2番目のメッセージにはプッシュとメールの両方を使用することを検討してください。この2番目のメッセージを使用して、軽い緊急性とともに利点と社会的証明を強調し、購入を促しましょう。
3. シーケンスの最後のメッセージには、メールまたはSMS（ユースケースに応じて）を「最後のチャンス」として使用してください。割引コードやその他のインセンティブを使用して購入を促すことを検討してください。

​

フォールバックメッセージ

​

パフォーマンスの追跡

​

Outcomesで収益を追跡する

// Example: capture total price and item count at 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);
  });
}