Account Engagement(旧Pardot)への連携
概要
AccountEngagementのCookieを持っているプロスペクトのアクティビティとして、デモの閲覧開始・初回操作・ガイド進行・全ガイド完了といった操作イベントを記録できます。
各イベントには総ステップ数・現在ステップ数が含まれるため、サイト側のJavaScriptで閲覧率(%)を計算し、任意の閾値で Account Engagement や他のMA/CRMにアクティビティを記録することも可能です。
手順
Webサイト等に、コンテンツやシナリオをiframeで埋め込み
コンテンツの埋め込みコードは、コンテンツ一覧の「︙」メニューから自動生成可能です
シナリオの埋め込みコードは、以下をサンプルとしてご利用ください。
<iframe frameborder="none" style="width:100%; height:100vh;"src="https://product.plainer.co.jp/s/plainer-demo/a1ba01c0-70c4-4916-b7b0-0cccfea64be2"></iframe>
デモの埋め込みコードとは別に、下記のJavaScriptを挿入
Account Engagementとの連携状況をご確認
補足
埋め込んだコンテンツやシナリオを編集すると、Webサイト上に埋め込まれたものも編集されます。
コンテンツの場合埋め込んだページのURL末尾に、
?pl_uid=email@plainer.co.jpというパラメータを追加することで、PLAINERのアクセスデータ上でも実名のトラッキングが可能です。メールアドレス部分は、送付先のメールアドレスやドメイン、SFAのID等に別途書き換えをお願いいたします
詳しくはこちらをご覧ください
送信されるpostMessageイベント一覧
埋め込んだコンテンツ/シナリオは、閲覧者の操作に応じて親ウィンドウへ postMessage でイベントを送信します。サイト側で window.addEventListener("message", ...) を使って受け取り、MA/CRMへ連携できます。
イベント名 | 送信タイミング | contentCurrentStep |
| 閲覧開始 | 1 |
| 初回操作 | 1 |
| ガイド進行(ステップごと) | 現在のステップ数 |
| 全ガイド完了 | 総ステップ数と一致 |
各イベントの event.data ペイロードには以下が含まれます。
event:イベント名(上記いずれか)contentId:コンテンツIDscenarioId:シナリオID(シナリオ埋め込み時のみ)contentTotalSteps:総ステップ数contentCurrentStep:現在のステップ数
※ これらのイベントは公開済みのコンテンツ/シナリオからのみ送信されます。
ユースケース例(閲覧率での連携)
contentCurrentStep と contentTotalSteps から閲覧率を算出できます。
閲覧率(%) = contentCurrentStep ÷ contentTotalSteps × 100
これを使うと、たとえば次のような連携が可能です。
デモの閲覧率が一定(例:50%)を超えたプロスペクトに、Account Engagement/HubSpot等でアクティビティを記録する
全ガイド完了(
plainer_guide_view_complete)したプロスペクトをスコアリング対象にする初回操作(
plainer_content_operate_start)の有無で「触っただけ」か「実際に操作した」かを区別する
連携コードサンプル(Account Engagementのみへの連携の場合)
⚠️設定には、基礎的なHTML/CSS/JaveScriptやMAツールの知識が必要です。個別のご質問にはサポートでお答えしかねます
<script>
var lastReceivedMessage = null;
var url = location.href;
var urlWithoutParams = url.split(?)[0];
if (urlWithoutParams.endsWith(/)) {
urlWithoutParams = urlWithoutParams.slice(0, -1);
}
window.addEventListener(message, function (event) {
if (lastReceivedMessage && JSON.stringify(lastReceivedMessage) === JSON.stringify(event.data)) {
return;
}
lastReceivedMessage = event.data;
switch (event.data.event) {
case plainer_content_operate_start:
piTracker(urlWithoutParams + /demo_start/ + event.data.contentId);
break;
case plainer_guide_view_complete:
piTracker(urlWithoutParams + /demo_complete/ + event.data.contentId);
break;
default:
break;
}
});
</script>
連携コードサンプル(GoogleAnalytics4へも連携したい場合)
⚠️設定には、基礎的なHTML/CSS/JaveScriptやMAツールの知識が必要です。個別のご質問にはサポートでお答えしかねます
<script>
var lastReceivedMessage = null;
var url = location.href;
var urlWithoutParams = url.split(?)[0];
if (urlWithoutParams.endsWith(/)) {
urlWithoutParams = urlWithoutParams.slice(0, -1);
}
window.addEventListener(message, function (event) {
if (lastReceivedMessage && JSON.stringify(lastReceivedMessage) === JSON.stringify(event.data)) {
return;
}
lastReceivedMessage = event.data;
switch (event.data.event) {
case plainer_content_operate_start:
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
event: demo_start,
demo_id: event.data.contentId,
demo_duration: event.data.contentTotalSteps
});
piTracker(urlWithoutParams + /demo_start/ + event.data.contentId);
break;
case plainer_guide_view_complete:
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
event: demo_complete,
demo_id: event.data.contentId,
demo_duration: event.data.contentTotalSteps
});
piTracker(urlWithoutParams + /demo_complete/ + event.data.contentId);
break;
case plainer_guide_view_start:
window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
event: demo_progress,
demo_id: event.data.contentId,
demo_duration: event.data.contentTotalSteps,
demo_current_step: event.data.contentCurrentStep
});
break;
default:
break;
}
});
</script>
※2026年7月修正: サンプルコードにつきまして、contentTotalStepsをcontentTotalStepと記載していたため修正いたしました。
