GoogleAnalytics4で成果分析を行いたい
概要 Google Analytics 4 へ連携したPLAINERのデモの閲覧データ [https://knowledge.plainer.co.jp/article/google-analytics-4-data-integration]を用いて、PLAINERデモの成果寄与度を分析することが可能です (※もしくは、PLAINERのデモへの外部リンクのクリック有無でセグメントを分けることでも、実現可能です。) 分析イメージ デモ
アクセスデータ分析機能に関するよくあるご質問
概要 Google Analytics 4 へ連携したPLAINERのデモの閲覧データ [https://knowledge.plainer.co.jp/article/google-analytics-4-data-integration]を用いて、PLAINERデモの成果寄与度を分析することが可能です (※もしくは、PLAINERのデモへの外部リンクのクリック有無でセグメントを分けることでも、実現可能です。) 分析イメージ デモ
HUBSPOTへの連携 概要 HubSpotのCookieを持っているコンタクトのアクティビティに、デモの閲覧開始・終了を記録可能 (以下の連携コードサンプル内のdocument.title = "任意の名前を設定";の内容や、埋め込んだページのURLが記録されます) 手順 1. Webサイト等に、デモやシナリオをiframeで埋め込み 1. デモの埋め込みコードは、「︙」メニューから自動生成可能です 2. シナリオの埋め込みコードは、以下をサンプルとしてご利用ください。 1. <iframe frameborder="none" style="width:100%; height:100vh;"src="https://product.plainer.co.jp/s/plainer-demo/a1ba01c0-70c4-4916-b7b0-0cccfea64be2"></iframe> 2. デモの埋め込みコードとは別に、下記のJavaScriptを挿入 1. “任意の名前を記載” の箇所は適宜ご修正ください 3. HubSpotとの連携状況をご確認 補足 * 埋め込んだデモやシナリオを編集すると、Webサイト上のデモやシナリオも編集されます。 * 埋め込んだページのURL末尾に、<?pl_uid=email@plainer.co.jp [email@plainer.co.jp]>というパラメータを追加することで、PLAINERのアクセスデータ上でも実名のトラッキングが可能です。 * メールアドレス部分は、送付先のメールアドレスやドメイン、SFAのID等に別途書き換えをお願いいたします。 https://knowledge.plainer.co.jp/article/mail-tracking [https://knowledge.plainer.co.jp/article/mail-tracking] 連携コードサンプル(HUBSPOTのみへの連携の場合) ⚠️設定には、基礎的なHTML/CSS/JaveScriptやMAツールの知識が必要です。個別のご質問にはサポートでお答えしかねます <script> var lastReceivedMessage = null; window.addEventListener('message', function (event) { if (lastReceivedMessage && JSON.stringify(lastReceivedMessage) === JSON.stringify(event.data)) {return;} lastReceivedMessage = event.data; var _hsq = window._hsq || []; switch (event.data.event) { case 'plainer_content_operate_start': document.title = "任意の名前を記載"; _hsq.push(['setPath', '/#demo_start?id=' + event.data.contentId]); _hsq.push(['trackPageView']); break; case 'plainer_guide_view_complete': document.title = "任意の名前を記載"; _hsq.push(['setPath', '/#demo_complete?id=' + event.data.contentId]); _hsq.push(['trackPageView']); break; default: break; } }); </script> 連携コードサンプル(GOOGLEANALYTICS4へも連携したい場合) ⚠️設定には、基礎的なHTML/CSS/JaveScriptやMAツールの知識が必要です。個別のご質問にはサポートでお答えしかねます <script> var lastReceivedMessage = null; 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.contentTotalStep }); var _hsq = window._hsq || []; document.title = "任意の名前を記載"; _hsq.push(['setPath', '/#demo_start?id='+ event.data.contentId]); _hsq.push(['trackPageView']); 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.contentTotalStep }); var _hsq = window._hsq || []; document.title = "任意の名前を記載"; _hsq.push(['setPath', '/#demo_complete?id='+ event.data.contentId]); _hsq.push(['trackPageView']); 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.contentTotalStep, demo_current_step: event.data.contentCurrentStep }); break; default: break; } }); </script> 補足 GoogleAnalytics4への連携は、GoogleAnalytics4やGTM側での設定が必要となります。 概要や手順は以下をご確認ください。 https://knowledge.plainer.co.jp/article/google-analytics-4-data-integration [https://knowledge.plainer.co.jp/article/google-analytics-4-data-integration]
ACCOUNTENGAGEMENT(旧PARDOT)への連携 概要 AccountEngagementのCookieを持っているプロスペクトのアクティビティの「ページビュー」として、デモの閲覧開始・終了を記録可能 手順 1. Webサイト等に、コンテンツやシナリオをiframeで埋め込み 1. コンテンツの埋め込みコードは、コンテンツ一覧の「︙」メニューから自動生成可能です 2. シナリオの埋め込みコードは、以下をサンプルとしてご利用ください。 1. <iframe frameborder="none" style="width:100%; height:100vh;"src="https://product.plainer.co.jp/s/plainer-demo/a1ba01c0-70c4-4916-b7b0-0cccfea64be2"></iframe> 2. デモの埋め込みコードとは別に、下記のJavaScriptを挿入 3. Account Engagementとの連携状況をご確認 補足 * 埋め込んだコンテンツやシナリオを編集すると、Webサイト上に埋め込まれたものも編集されます。 * コンテンツの場合埋め込んだページのURL末尾に、<?pl_uid=email@plainer.co.jp [email@plainer.co.jp]>というパラメータを追加することで、PLAINERのアクセスデータ上でも実名のトラッキングが可能です。 * メールアドレス部分は、送付先のメールアドレスやドメイン、SFAのID等に別途書き換えをお願いいたします https://knowledge.plainer.co.jp/article/mail-tracking [https://knowledge.plainer.co.jp/article/mail-tracking] 連携コードサンプル(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; } }); 連携コードサンプル(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.contentTotalStep }); 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.contentTotalStep }); 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.contentTotalStep, demo_current_step: event.data.contentCurrentStep }); break; default: break; } }); </script> 補足 GoogleAnalytics4への連携は、GoogleAnalytics4やGTM側での設定が必要となります。 概要や手順は以下をご確認ください。 https://knowledge.plainer.co.jp/article/google-analytics-4-data-integration [https://knowledge.plainer.co.jp/article/google-analytics-4-data-integration]
MARKETOへの連携 概要 MarketoのCookieを持っているリードのアクティビティログのWeb Viewとして、デモの閲覧開始・終了を記録可能 (クエリにデモのidを記録) こちらをトリガーとして、スマートキャンペーンを活用することで、閲覧の社内通知(メール配信等)や、デモ閲覧者に絞ったメール配信などが可能に 手順 1. Webサイト等に、デモやシナリオをiframeで埋め込み 1. デモの埋め込みコードは、「︙」メニューから自動生成可能です 2. シナリオの埋め込みコードは、以下をサンプルとしてご利用ください。 1. <iframe frameborder="none" style="width:100%; height:100vh;"src="https://product.plainer.co.jp/s/plainer-demo/a1ba01c0-70c4-4916-b7b0-0cccfea64be2"></iframe> 2. デモの埋め込みコードとは別に、下記のJavaScriptを挿入 3. Marketoとの連携状況をご確認 補足 * 埋め込んだデモやシナリオを編集すると、Webサイト上のデモやシナリオも編集されます。 * 埋め込んだページのURL末尾に、<?pl_uid=email@plainer.co.jp [email@plainer.co.jp]>というパラメータを追加することで、PLAINERのアクセスデータ上でも実名のトラッキングが可能です。 * メールアドレス部分は、送付先のメールアドレスやドメイン、SFAのID等に別途書き換えをお願いいたします。 https://knowledge.plainer.co.jp/article/mail-tracking [https://knowledge.plainer.co.jp/article/mail-tracking] 連携コードサンプル(MARKETOのみへの連携の場合) ⚠️設定には、基礎的なHTML/CSS/JaveScriptやMAツールの知識が必要です。個別のご質問にはサポートでお答えしかねます <script> var lastReceivedMessage = null; 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': Munchkin.munchkinFunction('visitWebPage', { 'url': '/demo_start', 'params': 'id=' + event.data.contentId }); break; case 'plainer_guide_view_complete': Munchkin.munchkinFunction('visitWebPage', { 'url': '/demo_complete', 'params': 'id=' + event.data.contentId }); break; case 'plainer_guide_view_start': break; default: break; } }); </script> ご参考 https://experienceleague.adobe.com/ja/docs/marketo-developer/marketo/javascriptapi/api-reference 連携コードサンプル(GOOGLEANALYTICS4へも連携したい場合) ⚠️設定には、基礎的なHTML/CSS/JaveScriptやMAツールの知識が必要です。個別のご質問にはサポートでお答えしかねます <script> var lastReceivedMessage = null; 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': Munchkin.munchkinFunction('visitWebPage', { 'url': '/demo_start', 'params': 'id=' + event.data.contentId }); window.dataLayer = window.dataLayer || []; window.dataLayer.push({ event: 'demo_start', demo_id: event.data.contentId, demo_duration: event.data.contentTotalStep }); break; case 'plainer_guide_view_complete': Munchkin.munchkinFunction('visitWebPage', { 'url': '/demo_complete', 'params': 'id=' + event.data.contentId }); window.dataLayer = window.dataLayer || []; window.dataLayer.push({ event: 'demo_complete', demo_id: event.data.contentId, demo_duration: event.data.contentTotalStep }); 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.contentTotalStep, demo_current_step: event.data.contentCurrentStep }); break; default: break; } }); </script> 補足 GoogleAnalytics4への連携は、GoogleAnalytics4やGTM側での設定が必要となります。 概要や手順は以下をご確認ください。 https://knowledge.plainer.co.jp/article/google-analytics-4-data-integration [https://knowledge.plainer.co.jp/article/google-analytics-4-data-integration]
GOOGLE ANALYTICS4への連携 概要 デモ閲覧、ステップ進行、デモ完了のそれぞれをGoogle Analyticsのカスタムイベントとして記録可能 デモ閲覧後の回遊やCVなどを分析可能 -------------------------------------------------------------------------------- 手順 1. Google Tag Managerでのカスタムイベントの設定 2. Google Analyticsでのカスタムイベント、ディメンション設定 3. デモ掲載ページ or 一律でGoogle Tag Managerより連携コードを追加 4. Google Tag Manaerプレビューでのデータ連携確認 💡 GTM,GA4でのカスタムイベントの設定において、GTMやGA4側の設定にはお答えできかねる場合がございます。 -------------------------------------------------------------------------------- 各種設定方法 GTM(GOOGLE TAG MANAGER)の設定 カスタムイベントの追加 * GTMにて「タグ」→「Google アナリティクス: GA4 イベント」で、カスタムイベント(demo_start, demo_progress, demo_complete)を追加 イベントパラメータ欄にはdemo_id、demo_duration、demo_current_stepを設定してください * demo_start * demo_id:デモ固有のID 値:{{demo_id}} * demo_duration:デモの総ステップ数 値:{{demo_duration}} * demo_progress * demo_id:デモ固有のID 値:{{demo_id}} * demo_duration:デモのステップ数 値:{{demo_duration}} * demo_current_step:閲覧されたステップの番号 値:{{demo_current_step}} * demo_complete * demo_id:デモ固有のID 値:{{demo_id}} * demo_duration:デモの総ステップ数 値:{{demo_duration}} * 設定例 ※測定IDの欄に設定する内容は、GTMおよびGA4の設定によって左右されます。詳しくは貴社内の担当者様へご確認ください。 トリガーの追加 設定した3つのカスタムイベントそれぞれにトリガーを設定します 以下を参考に、それぞれご設定ください * トリガーのタイプ:カスタムイベント * このトリガーの発生場所:すべてのカスタムイベント * 設定例 ユーザー定義変数(データレイヤーの変数)の追加 カスタムイベントのパラメータに設定した値を、ユーザー定義変数に追加をしてください * demo_id * demo_duration * demo_current_step * 設定例 ※「この関数への参照」の欄は自動的に設定されます。 デモ -------------------------------------------------------------------------------- 連携コードの設定(CMSへのデモ埋め込み時 OR GTMのカスタムHTML) デモの埋め込みコードとは別に下記コードを挿入 (GTMのカスタムHTML、またはページ自体に記載) ※カスタムHTMLとして設定時には、トリガーを「All Pages」で設定してください ⚠️設定には、基礎的なHTML/CSS/JaveScriptやMAツールの知識が必要です。個別のご質問にはサポートでお答えしかねます 連携コードサンプル <script> var lastReceivedMessage = null; 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.contentTotalStep }); 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.contentTotalStep }); 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.contentTotalStep, demo_current_step: event.data.contentCurrentStep }); break; default: break; } }); </script> デモ -------------------------------------------------------------------------------- GA4の設定 カスタム定義の追加 設定→カスタム定義→カスタムディメンションに下記3点を追加 * demo_id:デモ固有のID * demo_duration:デモのステップ数 * demo_current_step:閲覧されたステップの番号 * ※範囲=イベント、イベントパラメータ=(GTMで設定した「イベントパラメータ」と一致する文字列) * ※集計方法のご希望によってはディメンションではなく指標に追加してください カスタムイベントの確認 * GTM側の設定後、GA4側にカスタムイベント3種を設定されていることを確認(GTM→GA4への設定反映は最大で24時間掛かります。GTMのタグが発火していないと設定が反映されていない場合があります。) * demo_start * demo_progress * demo_complete デモ
概要 アクセスデータをダウンロードした際に、文字化けが発生してしまうケースがございます。 以下の手順で修正可能ですので、お試しください 修正手順 * CSVファイルを右クリックし、「プログラムから開く」→「メモ帳」を選択 * メモ帳で開いた際に文字化けしていない事を確認 * 「ファイル」→「名前をつけて保存」を選択 * 「文字コード」を「ANSI」に変更して、保存 * Excel でCSVファイルを開き、文字化けが解消されていることを確認
GA4のアップデートにより、拡張計測機能のパラメータがデフォルトでディメンションとして利用可能になりました。拡張計測機能が有効になっている場合、外部リンクとしてPlainerのデモへのリンクを設置していれば、特に設定の必要はなく、測定が可能です。 測定できているか確認する方法 * 「探索」→「自由形式」→ディメンションで「リンク先URL」を表示 * 「リンク先URL」として、デモのURLが記録されていれば、計測ができております 詳しくは下記のGoogle Analyticsのデモをご確認ください。 デモ画面で確認する [https://app.plainer.co.jp/plainer-demo/demo/b22fea2e-9466-4028-893a-ed06a0371c87] 留意点 * 外部リンクではない形式(ボタンで表示/非表示を切り替えるようコーディングするなど)で設置した場合、Google Tag Managerでトリガーとカスタムイベントの設定が必要です (GTMでトリガーを作成し、GA4のカスタムイベントを発火させる方式を想定。詳細はサポートまでお気軽にお問い合わせください)
読了率の定義 デモコンテンツの読了率は、そのコンテンツに含まれるガイド数の合計に対する、実際にユーザーがそのセッションで見たガイドの数の割合を計算したものです。 例:10ガイドあるコンテンツの内、8ガイドを閲覧した場合は80% その他、アクセスデータ閲覧機能 [https://knowledge.plainer.co.jp/article/feature-analytics]に詳細な記載がございますので、ご確認ください。
閲覧時間について * ページを開いた日時と閲覧終了までの日時の差分を閲覧時間としています * 閲覧終了とは下記のいずれかに該当した場合を指します * ブラウザを閉じた場合 * ブラウザのタブを閉じた場合 * 別ページに遷移した場合 留意点 * アクセス状況によっては閲覧終了が記録できない場合があります。その場合は閲覧したとはみなしていません * 閲覧中に別のウィンドウを操作する、別タブでWebサイトを閲覧するなど、Plainer上のコンテンツを見ていなかった場合も閲覧時間にカウントされます
下記のトラッキングの仕組みの違いにより、Plainerではより正確にアクセスしたかどうかを判定しているため、常にPlainerでのアクセス数がMAでのクリック数、ページビュー数よりも少なくなります。 一般的なMAでのトラッキングの仕組み 一般に、MAによるアクセスの計測では、ユーザーの手元のブラウザで画面が描画されたところまでトラッキングできていません。 リンク先にリダイレクトする、MAツールで生成した一意のアドレスにアクセスがあったかどうかでメールのクリック判定がされています。 そのため、送付先のメール受信サーバーのセキュリティ対策機能等によってはユーザー自身がアクセスしていない場合にもMA上はクリック・アクセスが記録されていることがあります。 PLAINERでのトラッキング Plainerでは実際にユーザーが手元のブラウザで画面が描画された場合のみアクセスと判定しており、一般的にMAよりも正確に閲覧した数が計測されます。