顧客アカウントページのポイント

顧客アカウントページにBON Loyalty拡張機能を設定する方法をご紹介します。

重要:この機能はCustomer Account Loginタイプを使用している店舗で利用可能です。Legacyアカウントには対応していません。

顧客アカウントページでのポイント表示とは何ですか?

アプリ埋め込みとは、テーマ上に重ねて表示するアプリ要素や、オンラインストアに追加するコードで、顧客には直接見えない機能です。ストアの隅に表示されるチャットバブルアプリや、ロイヤルティポイントとリワードを表示するコールアウトカードなどがあります。 

BON Loyaltyでは、プロフィールアカウント注文ステータスサンキューページの各ページでロイヤルティプログラムを表示するための4つの方法をご利用いただけます。

プロフィールページでのBON customer-account-ui

  • プロフィールページにbon-customer-account-uiのアプリ埋め込みを追加するには、テーマ > カスタマイズに移動してください。
  • ページ一覧でチェックアウトと顧客アカウントを選択します。
  • アプリ に進み、bon-customer-account-ui という拡張機能を見つけます。これを プロフィールページ に追加し、好みに合わせて位置を調整します。

アカウントページでのBON full-page-extension

上記でbon-customer-account-uiのアプリ埋め込みを追加した後は、bon-loyalty-fullpage-extensionの追加も忘れずに行ってください。この拡張機能により、新しい顧客アカウントページ上で、会員ステータスの進捗確認、会員ティアの閲覧、ポイントの確認および利用ができる専用タブが追加され、顧客のショッピング体験が向上します。これらの機能はすべてbon-loyalty-fullpage-extensionでご利用いただけます。

  • このフルページ拡張機能の動作については、こちらの動画をご参照ください。
bon-loyalty-fullpage-extension
  • こちらは、実際の新しい顧客アカウントページ上でのbon-loyalty-fullpage-extensionの表示例です。
bon-loyalty-fullpage-extension on the new customer account page

重要必要なすべてのプログラム(例:VIPランク、ポイント獲得プログラム、ポイント交換プログラム)を有効化していることを必ず確認してください。ブランド向けのカスタマイズ(色、フォント、文字色など)はShopifyテーマに合わせて同期され、手動で変更することはできません。

サンキューページでのBON referral-program-extension

サンキューページでは、bon-referral-program-extensionを追加することで、顧客が紹介リンクに簡単にアクセスし、友人や家族と共有できるようになります。これにより、オーガニックトラフィックの増加につながります。

  • チェックアウトと顧客アカウントの編集タブを開いている状態で、アプリ(Apps)bon-referral-program-extensionを選択 > 追加してサンキューページに配置してください。

重要な注意事項:現在、Shopifyではサンキューページのテーマプレビュー上にアプリ埋め込み拡張機能を表示することはできませんbon-referral-program-extensionをサンキューページに追加した後は、テスト注文を行い実際のサンキューページ上での表示を顧客視点でご確認ください。

こちらは、実際のサンキューページ上でのbon-referral-program-extensionの表示例です。

注文ステータスページでのBON referral-program-extensionおよびorder-point-rewards

bon-referral-program-extensionおよびbon-order-point-rewardsのアプリ埋め込みにより、注文ステータスページ上で、顧客は友人を簡単に紹介でき、さらに直近の注文で獲得したポイント数を確認することができます。

重要な注意事項:BON > ポイントプログラムポイント利用にて、紹介プログラムおよびリワードが有効化されていることをご確認ください。さらに、Shopify > 設定 > 顧客アカウントにて、顧客アカウントのログインタイプが選択されていることを確認してください。これらが設定されていない場合、拡張機能は表示されません。 ```

  • チェックアウトと顧客アカウントの編集タブを開いている状態で、アプリ(Apps)bon-referral-program-extensionを選択 > 追加して注文ステータスページに配置してください。
  • 内容を編集するには、左側のテキスト入力欄に入力してデフォルトテキストを調整できます。編集中は、{{_}}内の属性を変更しないようご注意ください。ハイパーリンクテキストに含まれるリンクはデフォルトで設定されており、変更することはできません。
Edit content of the referral-program-extension on the Order status page
  • チェックアウトと顧客アカウントの編集タブを開いている状態で、アプリ(Apps)bon-order-point-rewardsを選択 > 追加して注文ステータスページに配置してください。
bon-order-point-rewards

拡張機能の内容をカスタマイズし、多言語で表示する方法

1. 拡張機能の内容をカスタマイズする

埋め込みコンテンツのテキストは、ブランドに合わせて編集することができます:

  • Branding (ブランディング) > アプリ拡張機能 > 顧客アカウントページでのポイント表示 に移動してください。
  • 調整したい拡張機能を選択 > 設定の「表示テキスト」から、内容を自由にカスタマイズできます。

注意

  • 編集中は、{{_}}内の属性は変更しないでください。これらはBON Loyaltyの動的な値を表示するために使用されます。
  • 名と姓の両方を表示したくない場合は、メッセージに応じて{{first_name}}または{{last_name}}のいずれかの属性を使用</strongすることも可能です。
  • bon-customer-account-ui拡張機能の「View your rewards」リンクは変更できません。このリンクは自動的に、アカウントページ上のbon-loyalty-fullpage-extensionへ遷移します。

2. 拡張機能の内容を多言語で表示する

異なる市場の顧客に対応するため、拡張機能を多言語で表示することができます。

設定の「表示テキスト」から、言語タブを切り替えて翻訳内容を調整できます。

注意:BONの多言語表示機能は、Basicプラン以上でご利用いただけます。

このガイドは役に立ちましたか?