ガイドにパーソナライズ機能を追加する場合は、ガイドのエージェントメタデータを利用して、ユーザーにコンテンツを動的に表示することができます。PendoのガイドではJavaScriptテンプレートの構文を使用します。
- クラシックデザイナー用（2019年2月18日までのお客様）
- Visual Design Studio用（2019年2月18日以降のお客様）- カスタムコードブロックを使用して変数を追加します。
<%=root.metadata.visitor.id%>
<%=root.metadata.account.id%>使用可能な変数
初期化時に（スニペットを介して）渡されるすべてのエージェントメタデータ変数は、ガイド変数として使用できます。
注：変数では大文字と小文字が区別されます。必ず大文字と小文字を正しく使用してください。各変数で大文字と小文字が正しく使用されているかどうかは、アプリケーションの［データマッピング（Data Mappings）］ページで確認できます。
ガイドの種類に応じて、次の変数も利用できます：root.step.index- 0から始まるステップ番号。たとえば、ガイドに3つのステップがある場合、root.step.indexは0、1、もしくは2となります。
root.step.number- 1から始まるステップ番号。たとえば、ガイドに3つのステップがある場合、root.step.numberは1、2、もしくは3となります。
root.step.isFirst- 現在のステップが最初のステップかどうかを示します。
root.step.isLast- 現在のステップが最後のステップかどうかを示します。
root.guide.name- ガイドの名前
root.guide.publishedAt- ガイドの公開時期（タイムスタンプ）
root.guide.showsAfter- ガイドの表示開始予定時期（タイムスタンプ）
root.guide.stepCount- ガイドの総ステップ数
例1
以下のコード例では、ガイド完了の進行状況をレポートし、アクティブなステップに基づいて要素の表示と非表示を切り替える方法を示します。
進捗状況の通知：
<p>Step <%= root.step.number%> of <%= root.guide.stepCount%></p>最初のステップでない場合にBackボタンを表示：
<% if (!root.step.isFirst) { %>
<button class="_pendo-guide-previous-button_">Back</button>
<% } %>最後のステップでない場合はNextボタン、最後のステップの場合はDoneボタンを表示：
<% if (!root.step.isLast) { %>
<button class="_pendo-guide-next-button_">Next</button>
<% } else { %>
<button class="_pendo-dismiss-guide-button_">Done</button>
<% } %>例2
次のコード例は、ガイドのテキスト内のすべてのリンクに影響を与えます。リンクはテキストのビルディングブロックを使用して作成する必要があります。ユーザーがリンクをクリックすると、次の2つのことが起こります。
- 新しいタブでリンクが開きます。
- リンクの末尾にはクエリパラメータが追加されています。このコード例では、リンクは
?visitor={visitorId}で終わっており、{visitorId}が訪問者IDになります。
(function (guide, step, dom) {
var textLinkElement = dom('._pendo-text-link');
if (!pendo._.isUndefined(textLinkElement) &&
!pendo._.isUndefined(pendo.visitorId)) {
var previousUrlLink = textLinkElement[0].href;
var newUrlLink = previousUrlLink + `?visitor=${pendo.visitorId}`;
textLinkElement[0].href = newUrlLink;
}
dom('._pendo-button-primaryButton').on('click', function () {
window.open(textLinkElement[0].href);
pendo.onGuideDismissed();
});
dom(textLinkElement).on('click', function () {
pendo.onGuideDismissed();
});
})(guide, step, pendo.dom);
重要：コード例を変更またはカスタマイズする場合は、お客様がそれをテストし検証する責任を負うものとします。このコードスニペットは無料でご利用いただけますが、保証、SLA、サポートはありません。
よくある質問
Segment.ioもしくはSalesforceから渡された特性やメタデータを使用できますか？
できません。ガイド変数は、Pendoスニペットを介してページ上で渡されるメタデータのみで機能します。Segment.ioやSalesforceのデータは使用できません。どのメタデータを使用できるかを確認するには、アプリのページのコンソールでpendo.validateInstall()を実行してみてください。