テンプレートを編集してスロットの設定を作成する
学習の目的
この単元を完了すると、次のことができるようになります。
- B2C Commerce のページテンプレートと、商品のおすすめを表示するコンテンツスロットとのつながりを説明する。
- SFRA、Composable、Site Genesis の各ストアフロントにおけるテンプレート作成プロセスとスロット設定プロセスの違いを説明する。
- Business Manager でコンテンツスロットを設定して、商品のおすすめを表示する。
- 特定のスロットコンテキストやストアフロントページに対応する Recommender 種別を特定する。
商品のおすすめを表示するようにストアフロントページを設定する
Recommender を設定したら、その Recommender が生成するおすすめを表示するようにストアフロントページを設定できます。
開発者は、さまざまなツールを使用して B2C Commerce ストアフロントを構築します。その中でも特に重要なのがテンプレートです。B2C Commerce ではテンプレートを使用して、データとページ情報を動的な HTML ベースの Web ページに変換し、ブラウザーに表示する方法を定義します。
この単元では、ページテンプレート、コンテンツスロット、Einstein Product Recommender が連携して、買い物客にパーソナライズされた商品のおすすめを表示するためのコンテンツスロット設定を作成するしくみを説明します。また、開発者と連携してページテンプレートを作成する方法と、Business Manager でコンテンツスロットを作成する方法についても学習します。
おすすめ用のページテンプレートを作成する
B2C Commerce Einstein Product Recommender の展開では、テンプレートが重要な役割を果たします。テンプレートは、パーソナライズされた商品のおすすめをストアフロントに統合して表示するための基盤となるフレームワークです。
Salesforce B2C Commerce で Einstein Product Recommendations 用のテンプレートを開発するには、マーチャンダイザーと開発者が連携する必要があります。具体的な要件は、B2C Commerce 開発者がストアフロントの構築に使用するアプローチ (Storefront Reference Architecture (SFRA)、Composable Commerce、Site Genesis) によって異なります。それぞれのアプローチと、開発者とマーチャンダイザーのタスクの違いを見ていきましょう。
SFRA ストアフロント
SFRA ストアフロントでは ISML ベースのテンプレートを使用しますが、モジュール型のアプローチに従い、スロット設定は Business Manager で管理されます。
-
テンプレート: 開発者は、ページ機能とロジックを分離する Internet Store Markup Language (ISML) ベースのテンプレートを作成します。SFRA の事前定義済みカートリッジとコンポーネントは、表示ロジックを使用してテンプレートを解析します。たとえば、ビジネスロジックはテンプレートではなく、コントローラーやモデルで処理されます。
開発者はapp_storefront_baseカートリッジを基盤として使用し、カスタマイズに合わせて拡張します。
-
スロット設定: マーチャンダイザーは Business Manager を通してコンテンツスロット設定を作成して管理します。
Composable ストアフロント
Composable ストアフロントは異なるしくみで動作します。開発者は最新のフロントエンドフレームワークを使用して、テンプレートを作成および管理します。
-
テンプレート: 開発者は、React、Angular、Vue.js などの最新フレームワークを使用するテンプレートを構築します。Composable はフロントエンドをバックエンドから切り離し、Salesforce Commerce API (SCAPI) を介して Recommender とコンテンツスロットのデータを利用します。
-
スロット設定: マーチャンダイザーは Business Manager を通してコンテンツスロット設定を作成して管理します。
Site Genesis ストアフロント
開発者は ISML ファイルと Business Manager を直接使用してテンプレートとスロットを管理します。
-
テンプレート: 開発者は Internet Store Markup Language (ISML) ファイル内で直接作業します。既存のテンプレートを変更して、Recommender コンテンツスロットを含めます。開発者は ISML タグを使用して、動的コンテンツ、表示ロジック、スロット設定を定義します。
-
スロット設定: マーチャンダイザーは Business Manager を通してコンテンツスロット設定を作成して管理します。
マーチャンダイザーは、ストアフロント開発の各アプローチについて、種別、戦略、ルール、アンカーなどのおすすめロジックの詳細を開発者に提供します。
さらに、コンテンツスロットに関連する重要な要素についても、開発者と協力して決定します。
-
配置: ページ上でおすすめを表示する場所
-
タイトル: おすすめのタイトル。買い物客に見やすく、おすすめとの関連性があり、サイトのデザインやトーンに合うタイトルを付けます。
-
ドロップダウン: (省略可能) ドロップダウンがおすすめレイアウトの一部である場合は、おすすめ戦略に合ったドロップダウンの詳細を含めます。
-
表示項目: おすすめ商品の表示属性。たとえば、商品名、説明、価格、評価です。
コンテンツスロットは、テンプレートに定義されるページ上の具体的な場所です。Business Manager でコンテンツスロット設定を作成します。これにより、場所内に何をいつどのくらいの期間表示するかを指定します。コンテンツスロット内には商品、カテゴリ、コンテンツアセット、静的 HTML を表示できます。コンテンツアセットは、画像、マーケティンググラフィック、商品検索結果セット、商品カルーセル、そして Product Recommender と組み合わせた場合の商品おすすめなどのページ要素です。
Recommender では、Einstein Product Recommendations の結果に基づいてコンテンツスロットに表示するおすすめ商品を識別します。
コンテンツスロットを使用して、ストアフロントページに商品のおすすめを表示します。コンテンツスロットの設定についての情報は、「B2C Commerce でのスロット設定の管理と作成」を参照してください。
商品のおすすめ用にコンテンツスロットを設定する場合:
- グローバルコンテキストを持つコンテンツスロットを選択します。
- [Content Type (コンテンツタイプ)] 項目を [Recommendation (おすすめ)] に設定します。
- [Recommender] 項目の値を選択します。
- slots/recommendation フォルダーから適切な表示テンプレートを選択します。
[Recommender] 項目には、Einstein Configurator ツールで定義できる Recommender と呼ばれる、名前付きのビジネスルールのリストが含まれます。これらのルールは、Commerce Cloud Einstein が商品のおすすめを出力する方法を制御します。
コンテンツスロットを設定する
グローバルとカテゴリの両方のコンテンツスロットを、おすすめを表示するように設定できます。コンテンツスロットは次のようにストアフロントページにマッピングされます。各ページでは次の Recommender 種別を使用できます。
スロットコンテキスト |
ストアフロントページ |
商品から商品 |
カテゴリ内の商品 |
すべてのカテゴリ内の商品 (アンカー不要) |
最近見た商品 (アンカー不要) |
セットを完成 |
|---|---|---|---|---|---|---|
グローバル |
ホームページ |
✓ |
✓ |
|||
グローバル |
カテゴリのランディングページ |
✓ |
✓ |
|||
カテゴリ |
カテゴリのランディングページ |
✓ |
✓ |
|||
グローバル |
商品情報ページ |
✓ |
✓ |
✓ |
||
グローバル |
買い物カゴ |
✓ |
✓ |
✓ |
✓ |
|
グローバル |
ほしい物リスト |
✓ |
✓ |
✓ |
✓ |
|
グローバル |
注文手続き |
✓ |
✓ |
✓ |
✓ |
|
グローバル |
マイアカウント |
✓ |
✓ |
|||
グローバル |
私のおすすめ |
✓ |
✓ |
|||
グローバル |
404 エラー |
✓ |
✓ |
次は、商品情報ページのグローバルスロットの設定を作成する方法を学びます。グローバルでもカテゴリでも設定の作成と管理の手順は同じです。
開発者がすでにテンプレートを作成しているとします。
- Business Manager で [App Launcher (アプリケーションランチャー)] をクリックし、[Merchant Tools (マーチャントツール)] | [Site (サイト)] | [Online Marketing (オンラインマーケティング)] | [Content Slots (コンテンツスロット)] を選択します。
![Business Manager の [Content Slots (コンテンツスロット)] ページ](https://res.cloudinary.com/hy4kyit2a/f_auto/fl_lossy/q_70/learn/modules/cc-einstein-product-recommendations/cc-einstein-edit-templates-create-slot-configs/images/ja-JP/17ecc6546afcd958109ab4433968980c_kix.scyfmzpvgqlo.png)
-
home-categories-m スロットを選択します。
- 新規の設定を作成するには、[New (新規)] をクリックします。
![Business Manager の [New Content Slots (新規コンテンツスロット)] ページ](https://res.cloudinary.com/hy4kyit2a/f_auto/fl_lossy/q_70/learn/modules/cc-einstein-product-recommendations/cc-einstein-edit-templates-create-slot-configs/images/ja-JP/fb099a068c2fc0637854e7701e3566be_kix.ovfbweyoryxg.png)
- 設定を有効にします。
- デフォルトとして選択し、説明を入力します。
- コンテンツタイプとして [Recommendation (おすすめ)] を選択します。
- Recommender を選択します。(メモ: 表示されるのはプライマリインスタンスグループ (PIG) インスタンス上にある Recommender のみです。Sandbox インスタンスでは Einstein Product Recommendations が有効になっていません。)
- テンプレート pdp.isml を選択して [Save (保存)] をクリックします。
-
[Add Schedule (スケジュールの追加)] をクリックし、スケジュールの種別を選択します。スロットの間隔を 1 時間 (60 分) 未満にすることはできません。時刻の条件は、常にタイムゾーンと夏時間の考慮を前提としています。
- 顧客グループ [Big Spenders (高額利用者)] を割り当てます。
-
[Rank (ランク)] 列内をクリックしてスロットのランクを指定します。これにより、複数のスロットの設定がスケジュールされた場合にどのスロットを表示するかを B2C Commerce に指示します。複数のスロットの設定に同じランクが指定されている場合、B2C Commerce では最後に編集された設定を使用します。ランクが小さいほど、優先度が高くなります。
-
[Apply (適用)] をクリックします。
- プレビューアイコンをクリックしてストアフロントでスロットを表示します。
まとめ
この単元では、開発者と連携してコンテンツスロット用のページテンプレートを作成する方法について学習しました。また、コンテンツスロットを作成し、テンプレートとストアフロントで有効化する方法についても学習しました。
リソース
- Salesforce ヘルプ: Web キャンペーンのテンプレートについて
- Salesforce 開発者: Templates (テンプレート)
- Salesforce 開発者: B2C Commerce Einstein API