コンテンツにスキップ

Shopify標準統合セットアップ

このページでは、Shopifyオンラインストアを使用するユーザー向けの標準統合を使用して、BrazeとShopifyを統合する方法について説明します。Shopifyヘッドレスサイトを使用する場合、またはよりカスタマイズされたソリューションを実装する場合は、Shopifyカスタム統合セットアップを参照してください。

ステップ1:Shopifyストアを接続する

  1. Brazeで、パートナー連携 > テクノロジーパートナーに移動し、「Shopify」を検索します。
  2. Shopifyパートナーページで、Begin setupを選択して連携プロセスを開始します。

    設定を開始するボタンがあるShopify連携ページ。

  3. Shopifyアプリストアで、Brazeアプリケーションをインストールします。

    アプリケーションをインストールするボタンがあるBrazeアプリストアページ。
  1. Brazeアプリをインストールした後、Shopifyに接続するワークスペースを確認するためにBrazeにリダイレクトされます。Shopifyストアは1つのワークスペースにのみ接続できます。切り替えが必要な場合は、正しいワークスペースを選択してください。

    正しいワークスペースにいることを確認するウィンドウ。
  1. Begin setupを選択します。

    ドメインを入力するフィールドと設定を開始するボタンがある「Integration settings」画面。

ステップ2: Braze Web SDKを有効にする

Shopifyオンラインストアでは、標準設定を選択してBraze Web SDKとJavaScript SDKを自動的に実装できます。

標準設定またはカスタム設定で実装するオプションが表示された「Web SDKを有効にする」ステップ。

標準設定のオンボーディングパスを選択した後、Brazeがいつ初期化してSDKを読み込むかを以下のオプションから選択する必要があります。

  • サイト訪問時(セッション開始など)
    • 識別済みユーザーと匿名ユーザーの両方をトラッキングします
  • アカウント登録時(アカウントログインなど)
    • 識別済みユーザーのみをトラッキングします
    • サイト訪問者がアカウントを登録またはログインした時点からデータのトラッキングを開始します

ステップ3:Shopifyデータを設定する

標準データの設定

トラッキングするShopifyデータを選択します。

行動イベントとユーザー属性をトラッキングするためのチェックボックスが表示された「Shopifyデータのトラッキング」セクション。

標準連携では、以下のイベントがデフォルトで有効になっています。

Braze推奨イベント Shopifyカスタムイベント Shopifyカスタム属性
  • Product viewed
  • Cart updated
  • Checkout started
  • Order placed
  • shopify_account_login
  • shopify_paid_order
  • shopify_order_canceled
  • shopify_order_refunded
  • shopify_order_fulfilled
  • shopify_order_partially_fulfilled
  • shopify_tags
  • shopify_total_spent
  • shopify_order_count
  • shopify_last_order_id
  • shopify_last_order_name
  • shopify_zipcode
  • shopify_province

連携を通じてトラッキングされるデータの詳細については、Shopifyデータ機能を参照してください。

過去データのバックフィル設定

Track Shopify dataステップで、連携の一部として初回の過去データの読み込みを含めるチェックボックスを選択します。

インポートされる内容、収益レポートの動作、設定のスクリーンショット、およびアクティブなキャンペーンやキャンバスですでにBrazeを使用している場合のガイダンスについては、過去データのバックフィルを参照してください。

(上級)カスタムデータトラッキングの設定

Braze SDKを使用すると、この連携の標準イベント以外のカスタムイベントやカスタム属性をトラッキングできます。カスタムイベントは、ストアでのユニークなインタラクションをキャプチャします。例えば次のようなものです:

(上級)カスタムデータトラッキングの設定
カスタムイベント カスタム属性
  • カスタム割引コードの使用
  • パーソナライズされた商品レコメンデーションとのインタラクション
  • 注文へのギフトメッセージの追加
  • お気に入りのブランドや商品
  • 好みのショッピングカテゴリ
  • メンバーシップまたはロイヤルティのステータス

カスタムデータをトラッキングすることで、ユーザー行動に関するより深いインサイトが得られ、さらなるパーソナライゼーションをサポートします。カスタムイベントを実装するには、theme.liquidファイルでストアフロントのテーマコードを編集する必要があります。開発者の支援が必要になる場合があります。

例えば、以下のJavaScriptスニペットは、現在のユーザーがニュースレターを購読しているかどうかを確認し、それをBrazeのプロファイルにカスタムイベントとして記録します:

braze.logCustomEvent(
  subscribed_to_newsletter,
  {
    newsletterName: News and Offers,
    customerEmail: customer_1@example.com,
    sendOffers: true
  }
);

イベントやカスタム属性を記録するには、ユーザーのデバイスでSDKが初期化(アクティビティをリスニング)されている必要があります。カスタムデータの記録について詳しくは、UserオブジェクトおよびlogCustomEventオブジェクトを参照してください。

ステップ4:ユーザーの管理方法を設定する

ドロップダウンからexternal_idタイプを選択します。

「Collect subscribers」セクション。

デフォルトでは、BrazeはShopifyからのメールを自動的に小文字に変換してから、external IDとして使用します。メールまたはハッシュメールをexternal IDとして使用している場合は、メールアドレスも小文字に変換されていることを確認してから、external IDとして割り当てるか、他のデータソースからハッシュしてください。これにより、external IDの不一致を防ぎ、Brazeでの重複ユーザープロファイルの作成を回避できます。

ステップ4.1:braze.external_idメタフィールドを作成する

  1. Shopifyの管理パネルで、Settings > Metafields and metaobjectsに移動します。
  2. Customers > Add definitionを選択します。
  3. Namebraze.external_idと入力します。
  4. 自動生成されたネームスペースとキー(custom.braze_external_id)を選択して編集し、braze.external_idに変更します。
  5. TypeID Typeを選択します。

メタフィールドが作成されたら、顧客に対して入力します。次のアプローチをお勧めします。

  • 顧客作成webhookをリッスンする: customer/createイベントをリッスンするwebhookを設定します。これにより、新しい顧客の作成時にメタフィールドを書き込むことができます。
  • 既存の顧客をバックフィルする: Admin APIまたはCustomer APIを使用して、以前に作成した顧客のメタフィールドをバックフィルします。

潜在的な競合

Shopifyのcustomers/create webhookは、braze.external_idメタフィールドがユーザープロファイルに書き込まれる前に発火する場合があります。この場合:

  1. メタフィールドが存在しない場合、Brazeは設定されたエンドポイント(ステップ4.2)を呼び出してexternal IDを取得します。
  2. その呼び出しも失敗またはタイムアウトした場合、BrazeはShopify顧客IDをexternal IDとして一時的なユーザープロファイルを作成します。
  3. メタフィールドが存在する後続のイベント(customers/updateecommerce.order_placedイベントのorders/createなど)では、Brazeは自動的に不一致を検出し、一時的なプロファイルを正しいexternal IDとマージします。

つまり、一時的な重複プロファイルが発生する可能性がありますが、自動的に修正されます。これらのプロファイルを手動でマージする必要はありません。

ステップ4.2:external IDを取得するエンドポイントを作成する

Brazeが呼び出してexternal IDを取得できる公開エンドポイントを作成する必要があります。これにより、Shopifyがbraze.external_idメタフィールドを直接提供できないシナリオでも、BrazeがIDを取得できます。

エンドポイント仕様

メソッド: GET

Brazeは、次のパラメーターをエンドポイントに送信します。

パラメーター 必須 データタイプ 説明
shopify_customer_id はい 文字列 Shopify顧客ID。
shopify_storefront はい 文字列 リクエストのストアフロント名。例: <storefront_name>.myshopify.com
email_address いいえ 文字列 ログインユーザーのメールアドレス。

このフィールドは、特定のwebhookシナリオでは欠落している場合があります。エンドポイントロジックでは、ここでのnull値を考慮する必要があります(たとえば、内部ロジックで必要な場合は、shopify_customer_idを使用してメールを取得します)。

サンプルエンドポイント

GET https://mystore.com/custom_id?shopify_customer_id=1234&[email protected]&shopify_storefront=dev-store.myshopify.com

期待される応答

Brazeは、external IDのJSONを返す200ステータスコードを期待します。

{
  "external_id": "my_external_id"
}

検証

shopify_customer_idemail_address(存在する場合)がShopifyの顧客値と一致することを検証することが重要です。Shopify Admin APIまたはCustomer APIを使用してこれらのパラメーターを検証し、正しいbraze.external_idメタフィールドを取得できます。

障害時の動作とマージ

200以外のステータスコードは失敗と見なされます。

  • マージへの影響: エンドポイントが失敗した場合(非200を返すかタイムアウトした場合)、Brazeはexternal IDを取得できません。その結果、ShopifyユーザーとBrazeユーザープロファイルのマージはその時点では行われません。
  • リトライロジック: Brazeは標準的な即時ネットワークリトライを試みる場合がありますが、失敗が続く場合、マージは次の該当イベント(例えば、ユーザーが次にプロファイルを更新するかチェックアウトを完了するとき)まで延期されます。
  • サポート性: タイムリーなユーザーマージをサポートするために、エンドポイントの高可用性を確保し、オプションのemail_addressフィールドを適切に処理するようにしてください。

ステップ4.3:external IDを入力する

ステップ4を繰り返し、Brazeのexternal IDタイプとしてカスタムexternal IDを選択した後、エンドポイントURLを入力します。

考慮事項

  • Brazeがエンドポイントにリクエストを送信した時点でexternal IDが生成されていない場合、changeUser関数の呼び出し時にShopifyの顧客IDがデフォルトで使用されます。このステップは、匿名ユーザープロファイルと識別済みユーザープロファイルを統合するために重要です。その結果、ワークスペース内に異なるタイプのexternal IDが一時的に共存する期間が発生する場合があります。
  • braze.external_idメタフィールドでexternal IDが利用可能になると、インテグレーションはこのexternal IDを優先的に割り当てます。
    • Shopifyの顧客IDが以前Brazeのexternal IDとして設定されていた場合、braze.external_idメタフィールドの値に置き換えられます。

ステップ4.4:ShopifyからメールやSMSのオプトインを収集する(オプション)

ShopifyからメールまたはSMSマーケティングのオプトインを収集するオプションもあります。

メールやSMSチャネルを使用している場合、メールやSMSマーケティングのオプトイン状態をBrazeに同期できます。Shopifyからメールマーケティングのオプトインを同期すると、Brazeはその特定のストアに関連付けられているすべてのユーザーのメール購読グループを自動的に作成します。この購読グループに一意の名前を作成する必要があります。

メールまたはSMSマーケティングのオプトインを収集するオプションが表示された「Collect subscribers」セクション。

ステップ5:商品を同期する(オプション)

Shopify ストアのすべての商品を Braze カタログに同期して、より詳細なメッセージングパーソナライゼーションを実現できます。自動更新はほぼリアルタイムで行われるため、カタログには最新の商品詳細が反映されます。詳しくは、Shopify 商品同期をご確認ください。

「Shopify Variant ID」が「カタログ商品識別子」として設定されたセットアッププロセスのステップ4。

ステップ6:チャネルを有効化する(オプション)

Shopify 標準連携では、追加の開発なしに、連携設定からアプリ内メッセージとバナーを有効にできます。

アプリ内メッセージ

チャネルを有効化ステップで、連携設定の一部としてアプリ内メッセージを選択すると、メールや SMS のキャプチャフォーム、プロモーションポップアップ、アンケートなどのユースケースが利用可能になります。作成方法については、アプリ内メッセージを参照してください。

チャネルを有効化する設定ステップ。ブラウザ内メッセージングが利用可能なオプションとして表示されています。

バナー

バナーは、プロモーション、お知らせ、ターゲットオファーなど、パーソナライズされたコンテンツを Shopify ストアフロントに表示します。

設定

チャネルを有効化バナーを有効にしてバナー配置を作成を選択し、保存します。

Shopify 連携設定のチャネルを有効化ステップで、バナーのチェックボックスが選択されている画面。

Braze は、接続されたすべての Shopify ストアで共有される以下のバナー配置を、ワークスペースごとに1回自動的に作成します。

  • グローバルヘッダー
  • ホームボディ
  • グローバルフッター
  • 商品情報バナー
  • 商品ボディ
  • コレクションボディ
  • カートボディ
  • カートサマリー

デフォルトの配置 ID がご利用の設定に合わない場合や、追加の配置を使用したい場合は、手動で配置を作成する必要があります。各配置 ID は、対応する Shopify アプリブロックで設定されているものと一致する必要があります。公開後に配置 ID を変更した場合は、アプリブロックも一致するように更新してください。そうしないと、バナーがレンダリングされなくなります。

バナーを作成する

ドラッグ&ドロップエディター、HTML、またはテンプレートを使用して、バナーを作成キャンペーンまたはキャンバスを作成します。

ステップ1:バナーを Shopify テーマに追加する
  1. キャンペーンまたはキャンバスを小規模なオーディエンス(自分のアカウントのみを含むテストセグメント(例:自分の external_iddevice_id)、またはターゲティングに含まれるテストグループなど)に対してローンチします。これにより、ショッパーに公開することなく、ライブサイトでバナーを確認できます。
  2. Shopify テーマエディターで、バナーを配置したいページを開き、メニューからアプリ > ブロックを追加 > アプリ > Braze を選択します。

Shopify テーマエディターでアプリメニューが開かれ、バナーを追加するために Braze アプリブロックが選択されている画面。

  1. アプリブロック設定で、バナー配置から選択した配置の placement_id(例:global_header)を入力します。

Shopify テーマエディターの Braze バナーアプリブロック設定で、placement_id フィールドが表示されている画面。

  1. (オプション)アプリブロックの幅(コンテナの %)を調整し、固定の高さをピクセル単位で追加します。デフォルトでは、最大高さがバナーのコンテンツに合わせて調整されます。テーマでスロットの上限が必要な場合(例:高さのあるバナーがページコンテンツを押し下げるのを防ぐ場合)は、固定の高さを設定してください。
ステップ2:テストしてローンチする

テストユーザーとしてストアにアクセスし、バナーが正しい配置にレンダリングされ、期待通りに表示されることを確認します。その後、キャンペーンまたはキャンバスのターゲティングを編集して、フルオーディエンスにリーチします。パフォーマンスを測定するには、バナー分析を参照してください。

Content Cardsとフィーチャーフラグ

Content Cards やフィーチャーフラグを追加するには、開発者と協力して、必要な SDK コードを theme.liquid ファイルに直接挿入してください。詳細な手順については、Braze SDKの統合を参照してください。

Web プッシュ通知

Web プッシュは現在 Shopify 連携ではサポートされていません。web push for the Shopify integrationにご興味がある場合は、製品フィードバックを送信してください。

ステップ7:設定を完了する

  1. 設定が完了したら、Finish Setup を選択します。
  2. Shopify テーマ設定で Braze アプリ埋め込みを有効にします。Open Shopify を選択すると、Shopify アカウントにリダイレクトされ、ストアのテーマ設定でアプリ埋め込みを有効にできます。

Shopify で Braze アプリ埋め込みを有効にする必要があることを示すバナーと、Shopify を開くボタン。

  1. アプリ埋め込みを有効にすると、設定は完了です! 連携設定、初期データ同期のステータス、およびアクティブな Shopify イベントを確認できることを確認してください。

    連携設定を表示している Shopify パートナーページ。
New Stuff!