パーソナライゼーションのユースケース:買い物かごの放棄メール personalization-use-case-helper-functions
この例では、メールメッセージの本文をパーソナライズします。このメッセージは、買い物かごに商品が残っているが購入を完了していない顧客をターゲットにします。
次のタイプのヘルパー関数を使用します。
➡️ ヘルパー関数の使用方法については、このビデオをご覧ください
開始する前に、次の要素の設定方法を理解しておく必要があります。
次の手順に従います。
手順 1:最初のイベントと関連ジャーニーの作成 create-context
買い物かごの内容は、ジャーニーからのコンテキスト情報です。したがって、買い物かご固有の情報をメールに追加する前に、最初のイベントとメールをジャーニーに追加する必要があります。
-
スキーマに
productListItems
配列が含まれるイベントを作成します。 -
この配列のすべてのフィールドを、このイベントのペイロードフィールドとして定義します。
製品リスト項目のデータタイプについて詳しくは、Adobe Experience Platform のドキュメントを参照してください。
-
このイベントで開始されるジャーニーを作成します。
-
ジャーニーに メール アクティビティを追加します。
手順 2: メールの作成 configure-email
-
メール アクティビティで、「コンテンツを編集」をクリックしたあと、「E メールデザイナー」をクリックします。
-
E メールデザイナーホームページの左側のパレットから、3 つの構造コンポーネントをメッセージの本文にドラッグ&ドロップします。
-
HTML コンテンツコンポーネントを、それぞれの新規構造コンポーネントにドラッグ&ドロップします。
手順 3: 顧客の名(大文字)の挿入 uppercase-function
-
E メールデザイナーのホームページで、顧客の名を追加する HTML コンポーネントをクリックします。
-
コンテキストツールバーで、「ソースコードを表示」をクリックします。
-
HTML を編集 ウィンドウで、
upperCase
文字列関数を追加します。-
左側のメニューで、「ヘルパー関数」を選択します。
-
検索フィールドを使用して、「uppercase」を検索します。
-
検索結果から、
upperCase
関数を追加します。それには、{%= upperCase(string) %}: string
の横のプラス記号(+)をクリックします。式エディターには、次の式が表示されます。
code language-handlebars {%= upperCase(string) %}
-
-
式から「string」プレースホルダーを削除します。
-
名トークンを追加します。
-
左側のメニューで、「プロファイル属性」を選択します。
-
ユーザー/姓名 を選択します。
-
式に 名 トークンを追加します。
式エディターには、次の式が表示されます。
code language-handlebars {%= upperCase(profile.person.name.firstName) %}
ユーザー名データタイプについて詳しくは、Adobe Experience Platform のドキュメントを参照してください。
-
-
「 検証」をクリックしてから、「保存」をクリックします。
-
メッセージを保存します。
手順 4:買い物かご内の商品リストの挿入 each-helper
-
メッセージコンテンツを再度開きます。
-
E メールデザイナーのホームページで、買い物かごの内容を一覧表示する HTML コンポーネントをクリックします。
-
コンテキストツールバーで、「ソースコードを表示」をクリックします。
-
HTML を編集 ウィンドウで、
each
ヘルパーを追加します。-
左側のメニューで、「ヘルパー関数」を選択します。
-
検索フィールドを使用して、「each」を検索します。
-
検索結果から、
each
ヘルパーを追加します。式エディターには、次の式が表示されます。
code language-handlebars {{#each someArray as |variable|}} {{/each}}
-
-
式に
productListItems
配列を追加します。-
式から「someArray」プレースホルダーを削除します。
-
左側のメニューで、「コンテキスト属性」を選択します。
コンテキスト属性 は、ジャーニーコンテキストがメッセージに渡された後でのみ使用できます。
-
Journey Optimizer/イベント/event_name を選択し、productListItems ノードを展開します。
この例では、event_name はイベントの名前を表します。
-
式に 製品 トークンを追加します。
式エディターには、次の式が表示されます。
code language-handlebars {{#each context.journey.events.event_ID.productListItems.product as |variable|}} {{/each}}
この例では、event_ID はイベントの ID を表します。
-
式を次のように変更します。
- 「.product」文字列を削除します。
- 「variable」プレースホルダーを「product」に置き換えます。
次の例は、変更された式を示しています。
code language-handlebars {{#each context.journey.events.event_ID.productListItems as |product|}}
-
-
次のコードを、
{{#each}}
開始タグと{/each}}
終了タグの間に貼り付けます。code language-html <table> <tbody> <tr> <td><b>#name</b></td> <td><b>#quantity</b></td> <td><b>$#priceTotal</b></td> </tr> </tbody> </table>
-
商品名、数量および価格のパーソナライゼーショントークンを追加します。
- HTML テーブルからプレースホルダー「#name」を削除します。
- 前の検索結果から、名前 トークンを式に追加します。
次の手順を 2 回繰り返します。
- プレースホルダー「#quantity」を 数量 トークンに置き換えます。
- プレースホルダー「#priceTotal」を 合計価格 トークンに置き換えます。
次の例は、変更された式を示しています。
code language-handlebars {{#each context.journey.events.event_ID.productListItems as |product|}} <table> <tbody> <tr> <td><b>{{product.name}}</b></td> <td><b>{{product.quantity}}</b></td> <td><b>${{product.priceTotal}}</b></td> </tr> </tbody> </table> {{/each}}
-
「検証」をクリックしてから、「保存」をクリックします。
手順 5:製品固有のメモの挿入 if-helper
-
E メールデザイナーのホームページで、メモを挿入する HTML コンポーネントをクリックします。
-
コンテキストツールバーで、「ソースコードを表示」をクリックします。
-
HTML を編集 ウィンドウで、
if
ヘルパーを追加します。-
左側のメニューで、「ヘルパー関数」を選択します。
-
検索フィールドを使用して、「if」を検索します。
-
検索結果から、
if
ヘルパーを追加します。式エディターには、次の式が表示されます。
code language-handlebars {%#if condition1%} render_1 {%else if condition2%} render_2 {%else%} default_render {%/if%}
-
-
式から次の条件を削除します。
code language-handlebars {%else if condition2%} render_2
次の例は、変更された式を示しています。
code language-handlebars {%#if condition1%} render_1 {%else%} default_render {%/if%}
-
製品名トークンを条件に追加します。
-
式から「condition1」プレースホルダーを削除します。
-
左側のメニューで、「コンテキスト属性」を選択します。
-
Journey Orchestration/イベント/event_name を選択し、productListItems ノードを展開します。
この例では、event_name はイベントの名前を表します。
-
式に 名前 トークンを追加します。
式エディターには、次の式が表示されます。
code language-handlebars {%#if context.journey.events.`event_ID`.productListItems.name%} render_1 {%else%} default_render {%/if%}
-
-
式を次のように変更します。
-
式エディターで、
name
トークンの後に製品名を指定します。次の構文を使用します。ここで、product_name は製品の名前を表します。
code language-javascript = "product_name"
この例では、製品名は「Juno Jacket」です。
code language-handlebars {%#if context.journey.events.`event_ID`.productListItems.name = "Juno Jacket" %} render_1 {%else%} default_render {%/if%}
-
「render_1」プレースホルダーをメモのテキストに置き換えます。
例:
code language-handlebars {%#if context.journey.events.`event_ID`.productListItems.name = "Juno Jacket" %} Due to longer than usual lead times on the Juno Jacket, please expect item to ship two weeks after purchase. {%else%} default_render {%/if%}
-
式から「default_render」プレースホルダーを削除します。
-
-
「 検証」をクリックしてから、「保存」をクリックします。
-
メッセージを保存します。
手順 6:ジャーニーのテストと公開 test-and-publish
-
「テスト」トグルをオンにしてから、「イベントをトリガー」をクリックします。
-
イベント設定 ウィンドウで、入力値を入力し、「送信」をクリックします。
テストモードは、テストプロファイルでのみ機能します。
メールがテストプロファイルのアドレスに送信されます。
この例では、Juno Jacket に関するメモがメールに含まれています。これは、この製品が買い物かごに入っているからです。
-
エラーがないことを確認し、ジャーニーを公開します。
関連トピック related-topics
Handlebars 関数 handlebars
ユースケース use-case
チュートリアルビデオ video
ヘルパー関数の使用方法を説明します。