ストアフロントのトリガー、ステップバイステップ

これらのトリガーは、管理画面での変更ではなく、買い物客がオンラインストアで行う行動に基づいて発動します。このアプリは、最初のトリガーが有効になった際に自動的にインストールされるウェブピクセルを使用して、これらのトリガー情報を収集します。

まずは「ストアフロントのトリガー」をお読みください。この資料では、同意、データ量、およびピクセルが送信する情報と送信しない情報について解説しています。すべてのイベントがプランのデータ使用量にカウントされます。また、繁盛している店舗では、1日の商品閲覧数が1年間の注文更新数よりも多くなることもあります。

このページの内容:ストアフロントで商品が閲覧された, ストアフロントでコレクションが閲覧された, ストアフロントで商品がカートに追加された, ストアフロントで商品がカートから削除された, ストアフロントでカートが表示された, ストアフロントでチェックアウトが開始された, ストアフロントで検索が行われた, ストアフロントで検索結果が0件だった, 在庫切れのバリエーションが閲覧された, ログイン済みの顧客がアクセスした, B2Bバイヤーがを閲覧 カスタムストアフロントトリガー

Shopify Flow
場所:「Shopify Flow」で「トリガーの選択」を選択し、「Workflow Trigger Extensions」を開き、「Storefront」を検索してください。

ストアフロントで閲覧された商品

買い物客が商品ページを開いたときに発火します。このイベントには、参照対象となる商品と、表示されていたバリエーション、およびSKUと価格が渡されます。

火災の原因は 買い物客のブラウザ上に表示される、アプリのストアフロントのピクセル
許可 ストアフロントの動作へのアクセス権限 + 商品、バリエーション、コレクションのデータへのアクセス権限
電源が入った これを使用するFlowワークフローを有効にすると、それがオンになります。この機能専用のスイッチは、アプリの「**トリガー」**ページにあります。

次のような用途にご利用ください

  • 商品への関心を把握し、購買や商品展開の指針とする。
  • Shopifyとの連携機能がないレコメンデーションツールや分析ツールに、フィードの閲覧データを連携させる。

「閲覧されたストアフロント商品」がワークフローに送信する内容

フロー内の変数 種類 その中身
product 製品(Shopify) 閲覧された商品。完全なShopify商品であるため、そのすべてのフィールドと、Flow独自の商品アクションが利用可能です。
viewedVariant 目的 掲載されている商品とそのSKUおよび価格
viewedVariant.variantId ID
viewedVariant.variantTitle テキスト
viewedVariant.sku テキスト
viewedVariant.price Money (金額, 通貨コード)
viewedVariant.vendor テキスト
viewedVariant.productType テキスト
viewedVariant.productUrl テキスト
eventId テキスト このイベントのIDです。アプリの「イベント履歴」でこのIDを検索すると、具体的に何が送信されたかを確認できます。

例:商品のメタフィールドの閲覧数をカウントする

  1. トリガーとして「**ストアフロントで閲覧された商品」**を選択します。
  2. productリファレンスから、productメタフィールド「custom.view_count」の現在の値を読み取り、それに1を加えた値を返す「コードを実行」を追加します。
  3. 返された数値を使用して、「**Update product metafield」**を追加します。
  4. ワークフローを有効にしてください。

「Storefront」コレクションの閲覧履歴

買い物客がコレクションページを開いたときに発火します。コレクションのIDとタイトルが渡されます。

火災の原因は 買い物客のブラウザ上に表示される、アプリのストアフロント画像
許可 ストアフロントの動作へのアクセス
電源が入った これを使用するFlowワークフローを有効にすると、それがオンになります。専用のスイッチは、アプリの「**トリガー」**ページにあります。

次のような用途にご利用ください

  • どのキャンペーンコレクションにトラフィックが集まっているかを確認しましょう。
  • コレクションのビューを外部の分析エンドポイントに転送します。

「閲覧されたストアフロントコレクション」がワークフローに送信する内容

フロー内の変数 種類 その中身
collection 目的 閲覧されたコレクション
collection.id ID
collection.title テキスト
eventId テキスト このイベントのIDです。アプリの「イベント履歴」でこれを検索すると、具体的に何が送信されたかを確認できます。

例:キャンペーンコレクションの「フォワード」ビュー

  1. 「Pick **Storefront Collection Viewed」**をトリガーとして設定します。
  2. 条件を追加:collection.titleSummer Saleに等しい
  3. アナリティクスエンドポイントへのHTTPリクエストの送信を追加します。
  4. ワークフローを有効にしてください。

店舗の商品がカートに追加されました

買い物客が商品をカートに追加したときに発生します。このイベントには、商品、バリエーション、数量、および行合計が含まれます。

火災の原因は 買い物客のブラウザ上に表示される、アプリのストアフロント画像
許可 ストアフロントの動作へのアクセス + 商品、バリエーション、コレクションのデータへのアクセス
電源が入った これを使用するFlowワークフローを有効にすると、その機能がオンになります。この機能専用のスイッチは、アプリの「**トリガー」**ページにあります。

次のような用途にご利用ください

  • 通常より大量の注文を早期に察知すること。例えば、一般消費者向けストアでのB2Bバイヤーによる注文など。
  • テスト対象の商品の「カートに追加」を追跡する。

「Storefront Product Added to Cart」がワークフローに送信する内容

フロー内の変数 種類 その中身
product 製品(Shopify) 追加された商品。Shopifyのフル機能版であるため、そのすべてのフィールドおよびFlow独自の商品アクションが利用可能です。
cartLineEvent 目的 品種、数量、および行合計
cartLineEvent.variantId ID
cartLineEvent.variantTitle テキスト
cartLineEvent.sku テキスト
cartLineEvent.quantity 番号
cartLineEvent.lineTotal Money (金額, 通貨コード)
eventId テキスト このイベントのIDです。アプリの「イベント履歴」でこれを検索すると、具体的に何が送信されたかを確認できます。

例:営業部門に大量注文について通知する

  1. トリガーとして「**ストアフロントの商品がカートに追加された」**を選択します。
  2. 条件を追加:cartLineEvent.quantity > 20
  3. 「**内部メールを送信」**を追加:{{cartLineEvent.quantity}} x {{product.title}} / {{cartLineEvent.variantTitle}} was added to a cart
  4. ワークフローを有効にしてください。

ストアの商品がカートから削除されました

買い物客がカートから商品を取り出したときに発火します。

火災の原因は 買い物客のブラウザ上に表示される、アプリのストアフロント画像
許可 ストアフロントの動作へのアクセス + 商品、バリエーション、コレクションのデータへのアクセス
電源が入った これを使用するFlowワークフローを有効にすると、それがオンになります。この機能専用のスイッチは、アプリの「**トリガー」**ページにあります。

次のような用途にご利用ください

  • 異常に頻繁に追加されたり削除されたりする商品を探してください。価格、配送、またはバリエーションに関する問題がある可能性があります。

「カートから商品を削除」がワークフローに送信する内容

フロー内の変数 種類 その中身
product 製品(Shopify) 削除された商品。Shopifyの完全な商品であるため、そのすべてのフィールドおよびFlow独自の商品アクションが利用可能です。
cartLineEvent 目的 品種、数量、および行合計
cartLineEvent.variantId ID
cartLineEvent.variantTitle テキスト
cartLineEvent.sku テキスト
cartLineEvent.quantity 番号
cartLineEvent.lineTotal Money (金額, 通貨コード)
eventId テキスト このイベントのIDです。アプリの「イベント履歴」でこれを検索すると、具体的に何が送信されたかを確認できます。

例:被試験製品のログ削除

  1. トリガーとして「**ストアフロントの商品がカートから削除された」**を選択します。
  2. 条件を追加:product.tags には watch が含まれます
  3. {{product.title}} および {{cartLineEvent.sku}} を使用して、スプレッドシートまたはアナリティクスのエンドポイントに HTTP リクエストを送信する機能を追加します。
  4. ワークフローを有効にしてください。

ストアフロントのカートが表示されました

買い物客がカートページ/cart)を開いたときに発火します。カートID、商品数、合計金額が渡されます。

火災の原因は 買い物客のブラウザ上に表示される、アプリのストアフロント画像
許可 ストアフロントの動作へのアクセス
電源が入った これを使用するFlowワークフローを有効にすると、それがオンになります。この機能専用の切り替えスイッチは、アプリの「**トリガー」**ページにあります。

次のような用途にご利用ください

  • 高価なカートに注意してください。

「Storefront Cart Viewed」がワークフローに送信する内容

フロー内の変数 種類 その中身
cartSnapshot 目的 閲覧時のカートの内容
cartSnapshot.cartId ID
cartSnapshot.totalQuantity 番号
cartSnapshot.total Money(金額、通貨コード)
eventId テキスト このイベントのIDです。アプリの「イベント履歴」でこのIDを検索すると、具体的に何が送信されたかを確認できます。

例:1,000を超えるカート数に関するアラート

  1. トリガーとして「Pick Storefront Cart Viewed」を選択します
  2. 金額はテキストとして受け取られるため、big: Number(input.cartSnapshot.total.amount) > 1000を返す実行コードを追加してください。
  3. big条件を追加し、その後、社内メールを送信します
  4. ワークフローを有効にしてください。

オンラインストアでの決済が開始されました

買い物客がチェックアウト画面に入ったときに発火します。チェックアウトを中断したときではなく、開始した時点です。

火災の原因は 買い物客のブラウザ上に表示される、アプリのストアフロント画像
許可 ストアフロントの動作へのアクセス
電源が入った これを使用するFlowワークフローを有効にすると、この機能がオンになります。この機能専用のスイッチは、アプリの「**トリガー」**ページにあります。

次のような用途にご利用ください

  • 注文を基準に、測定のチェックアウトが開始されます。
  • 非常に大規模なチェックアウトが発生している間は、その様子に注意してください。

Storefront Checkout Started がワークフローに送信する内容

フロー内の変数 種類 その中身
checkoutSnapshot 目的 チェックアウトトークン、行数、合計
checkoutSnapshot.checkoutToken テキスト
checkoutSnapshot.lineItemCount 番号
checkoutSnapshot.total Money (金額, 通貨コード)
eventId テキスト このイベントのIDです。アプリの「イベント履歴」でこれを検索すると、具体的に何が送信されたかを確認できます。

例:高額な決済に関するアラート

  1. トリガーとして「Pick Storefront Checkout Started」を選択します
  2. 条件を追加:checkoutSnapshot.lineItemCount より大きい 15
  3. {{checkoutSnapshot.total.amount}} {{checkoutSnapshot.total.currencyCode}}」を使用して社内メールを送信する機能を追加します。
  4. ワークフローを有効にしてください。

店舗検索

ストアフロント検索で少なくとも1件の結果が返された場合に発火します。このイベントには、検索語句、結果の数、最大10件の一致結果、および最初の一致結果が商品参照として含まれます。

火災の原因は 買い物客のブラウザ上に表示される、アプリのストアフロント画像
許可 ストアフロントの動作へのアクセス + 商品、バリエーション、コレクションのデータへのアクセス
電源が入った これを使用するFlowワークフローを有効にすると、それがオンになります。この機能専用のスイッチは、アプリの「**トリガー」**ページにあります。

次のような用途にご利用ください

  • 買い物客が何を検索し、最初に何が表示されるのかを確認しましょう。
  • 重要な用語が正しい商品にリンクされているか確認してください。
フロー内の変数 種類 その中身
product 製品(Shopify) 検索の結果として最初に表示された製品は、分岐処理を行うための完全な製品です。完全なShopify製品であるため、そのすべてのフィールドと、Flow独自の製品アクションを利用できます。
storefrontSearch 目的 検索語、検索結果の数、および最初のものを含む最大10件の検索結果
storefrontSearch.query テキスト 買い物客が入力した検索語。
storefrontSearch.resultCount 番号 検索の結果、いくつの商品バリエーションが返されたか。
storefrontSearch.results オブジェクトの一覧 検索結果は、関連性の高い順に表示され、データ量を抑えるため10件までと制限されています。
storefrontSearch.results (each).productId ID
storefrontSearch.results (each).title テキスト
storefrontSearch.results (each).vendor テキスト
storefrontSearch.results (each).url テキスト
eventId テキスト このイベントのIDです。アプリの「イベント履歴」でこれを検索すると、具体的に何が送信されたかを確認できます。

例:主要な検索キーワードで何が最初に表示されるかを確認する

  1. トリガーとして「**ストアフロント検索」**を選択します。
  2. 条件を追加:storefrontSearch.query には gift card が含まれます
  3. 2つ目の条件を追加します:product.title Gift Card が含まれていない場合内部メールを送信します{{storefrontSearch.query}} の最初のヒットは {{product.title}} でした。
  4. ワークフローを有効にしてください。

ストアフロント検索で結果が見つかりませんでした

ストアフロント検索で結果が見つからない場合に表示されます。これは、買い物客が貴店で販売されていると期待していた商品の一覧、または検索システムが認識できない単語の一覧です。

火災の原因は 買い物客のブラウザ上に表示される、アプリのストアフロント画像
許可 ストアフロントの動作へのアクセス
電源が入った これを使用するFlowワークフローを有効にすると、それがオンになります。この機能専用のスイッチは、アプリの「**トリガー」**ページにあります。

次のような用途にご利用ください

  • 欠落している製品と同義語を収集する。
  • テーマやアプリの変更後に検索機能の不具合を発見する:急激な増加がその兆候です。

「ストアフロント検索で結果が得られなかった場合」がワークフローに送信する内容

フロー内の変数 種類 その中身
searchQuery 目的 検索語とその検索結果数
searchQuery.query テキスト
searchQuery.resultCount 番号
eventId テキスト このイベントのIDです。アプリの「イベント履歴」でこれを検索すると、具体的に何が送信されたかを確認できます。

例:結果が出なかった検索をシートに集約する

  1. トリガーとして「**店舗検索で結果が0件」**を選択します。
  2. {{searchQuery.query}} を使用して、Google スプレッドシートまたは Airtable の Webhook に「**HTTP リクエストの送信」**機能を追加します。
  3. 毎週このシートを確認してください。Shopifyの「Search & Discovery」アプリに同義語やリダイレクトを追加したり、ユーザーからの要望に応じてコンテンツを充実させたりしてください。
  4. ワークフローを有効にしてください。

在庫切れのバリエーションが閲覧されました

購入者が、表示されているバリエーションがすべての店舗で売り切れとなっている商品ページにアクセスした際にトリガーされます。これは需要のシグナルであり、販売できない商品を誰かが求めていたことを意味します。

火災の原因は 買い物客のブラウザ上に表示される、アプリのストアフロント画像
許可 ストアフロントの動作へのアクセス + 在庫データへのアクセス + 商品、バリエーション、コレクションのデータへのアクセス
電源が入った これを使用するFlowワークフローを有効にすると、それがオンになります。この機能専用のスイッチは、アプリの「**トリガー」**ページにあります。

次のような用途にご利用ください

  • 実際の需要に基づいて、再入荷の優先順位を決定してください。
  • 再入荷キャンペーン向けに商品にタグを付けてください。

「閲覧された在庫切れのバリエーション」がワークフローに送信する内容

フロー内の変数 種類 その中身
product 製品(Shopify) 在庫切れのバリエーションが属する商品。完全なShopify商品であるため、そのすべてのフィールドおよびFlow独自の商品アクションが利用可能です。
outOfStockVariant 目的 そのバリエーションと在庫数
outOfStockVariant.variantId ID
outOfStockVariant.variantTitle テキスト
outOfStockVariant.sku テキスト
outOfStockVariant.availableQuantity 番号
eventId テキスト このイベントのIDです。アプリの「イベント履歴」でこれを検索すると、具体的に何が送信されたかを確認できます。

例:売り切れた商品でも、買い物客がまだ閲覧しているものにはタグを付ける

  1. 「在庫切れのバリエーションを選択」をトリガーとして設定します
  2. restock-demand を使用して、商品タグを追加してください
  3. 「購買部門に**社内メールを送信」**を追加:{{product.title}} / {{outOfStockVariant.variantTitle}} ({{outOfStockVariant.sku}}) was viewed while sold out
  4. ワークフローを有効にしてください。

ログイン済みのお客様がアクセスしました

ログイン済みの顧客がストアフロントにアクセスした際に通知されます。ページビューが複数回あっても、お客様1人につき、設定した期間内(すべての訪問から月1回まで)では1回の訪問として集計されます。

火災の原因は 買い物客のブラウザ上に表示される、アプリのストアフロント画像
許可 ストアフロントの動作へのアクセス + 顧客データへのアクセス
電源が入った これを使用するFlowワークフローを有効にすると、それがオンになります。この機能専用のスイッチは、アプリの「**トリガー」**ページにあります。

次のような用途にご利用ください

  • アカウントマネージャーに、主要な顧客が戻ってきたことを伝えてください。
  • 長い間離れていた顧客に対して、再エンゲージメントのプロセスを開始する。

「ログイン済み顧客のアクセス履歴」がワークフローに送信する内容

フロー内の変数 種類 その中身
customer 顧客(Shopify) ログイン済みの顧客で、分岐処理に必要な完全なレコードが保持されています。Shopifyの完全な顧客であるため、すべてのフィールドおよびFlow独自の顧客アクションが利用可能です。
eventId テキスト このイベントのIDです。アプリの「イベント履歴」でこれを検索すると、具体的に何が送信されたかを確認できます。

例:VIPがサイトを閲覧していることをアカウントマネージャーに伝えてください

  1. アプリ内で、「**ログイン済み顧客の来店」**の横にある設定アイコンを開き、来店頻度(例:1日1回)を選択してください。
  2. 「フロー内で**アクセスしたログイン済み顧客」**を選択します。
  3. 条件を追加:customer.tags には vip が含まれます
  4. {{customer.displayName}}」を使用して社内メールを送信する機能を追加します。
  5. ワークフローを有効にしてください。

B2Bのバイヤーが来訪

ログイン済みのB2Bバイヤーが貴社のストアフロントにアクセスした際に、そのバイヤーが所属する企業名および購入先の所在地とともに通知されます。選択した期間内におけるアクセス数は、企業ごとに集計されます。

火災の原因は 買い物客のブラウザ上に表示される、アプリのストアフロント画像
許可 企業および企業の所在地データへのアクセス(B2B)店舗での行動データへのアクセス
電源が入った これを使用するFlowワークフローを有効にすると、この機能がオンになります。この機能専用のスイッチは、アプリの「**トリガー」**ページにあります。

次のような用途にご利用ください

  • その企業のバイヤーが活動している際には、同社の営業担当者に通知する。
  • 卸売顧客が再購入する頻度を測定する。

「B2B Buyer Visited」がワークフローに送信する内容

フロー内の変数 種類 その中身
purchasingCompany 目的 購入者が購入する会社および場所
purchasingCompany.companyId ID
purchasingCompany.companyName テキスト
purchasingCompany.companyLocationId ID
purchasingCompany.companyLocationName テキスト
eventId テキスト このイベントのIDです。アプリの「イベント履歴」でこれを検索すると、具体的に何が送信されたかを確認できます。

例:ある企業の購買担当者がアクティブになった際に、営業担当者に通知する

  1. アプリ内の「**B2Bバイヤーの訪問」**の横にある設定アイコンから、訪問期間を設定してください。
  2. 「Flow」でアクセスしたB2Bバイヤーを選択します。
  3. **「社内のメールを送信」**を追加:A buyer of {{purchasingCompany.companyName}} ({{purchasingCompany.companyLocationName}}) is on the store
  4. ワークフローを有効にしてください。

カスタムストアフロントトリガー

テーマが、ユーザーが定義したイベント(カートドロワーの展開、サイズガイドの使用、クイズの完了など)を配信すると、トリガーが発火します。アプリ内でトリガーを作成し、イベント名を設定した後、テーマ側から1行のJavaScriptでその名前を配信します。

火災の原因は 買い物客のブラウザ上に表示される、アプリのストアフロント画像
許可 ストアフロントの動作へのアクセス
電源が入った これを使用するFlowワークフローを有効にすると、それがオンになります。この機能専用のスイッチは、アプリの「**トリガー」**ページにあります。

次のような用途にご利用ください

  • Shopifyが報告しないものすべて:ドロワー、モーダル、バリアントスイッチ、コンフィギュレーター。
  • 独自のデータを渡して、Flow内で利用しましょう。

カスタムストアフロントトリガーがワークフローに送信する内容

フロー内の変数 種類 その中身
eventName テキスト 公開したイベント名(例:cart_drawer_opened)。これを条件としてフィルタリングすることで、そのうちの1つだけを実行するようにできます。
triggerName テキスト このストアフロント・トリガーに付けた名前。
output 目的 変換コードの実行後、イベントとともに公開されたデータ。
output.fields オブジェクトの一覧 各キーを、定義された順に。
output.fields (each).key テキスト 変換によって出力または返されたそのままのキー(例:「itemCount」)。
output.fields (each).value テキスト 値が文字列に変換されます。オブジェクトや配列はJSONテキストとして渡されます。
output.json テキスト ペイロード全体をJSON形式で提供します。これは、ペイロードを一括で解析したい加盟店向けです。
eventId テキスト このイベントのIDです。アプリの「イベント履歴」でこれを検索すると、具体的に何が送信されたかを確認できます。

例:完成品のクイズへの反応

  1. アプリで「**トリガー」**を開き、「カスタムストアフロントトリガー」を作成して、イベント名に「quiz_completed」と指定します。表示されるスニペットをコピーしてください。
  2. テーマ内で、クイズが終了した際にスニペットを呼び出し、結果を渡してください。例えば、{ result: "dry-skin" } のようにします。
  3. フローで「**カスタムストアフロントトリガー」**を選択し、条件として「eventName」が「quiz_completedと等しい、を追加します。
  4. output.fields」からデータを読み込む(キーと値のペア)か、「output.json」を「**コードの実行」**ステップで解析します。
  5. ワークフローを有効にしてください。

今後の手順

これらすべてに「**Storefront Behaviour Access」**が必要です。商品を扱うものには「Product Data Access」も必要であり、「Signed-In Customer Visited」には「Customer Data Access」も必要で、「B2B Buyer Visited」には「Company Access」も必要です。