Marketoへの連携

概要

MarketoのCookieを持っているリードのアクティビティログのWeb Viewとして、デモの閲覧開始・終了を記録可能 (クエリにデモのidを記録)

こちらをトリガーとして、スマートキャンペーンを活用することで、閲覧の社内通知(メール配信等)や、デモ閲覧者に絞ったメール配信などが可能に

手順

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>
デモの埋め込みコードとは別に、下記のJavaScriptを挿入
Marketoとの連携状況をご確認

補足

埋め込んだデモやシナリオを編集すると、Webサイト上のデモやシナリオも編集されます。
埋め込んだページのURL末尾に、<?pl_uid=email@plainer.co.jp>というパラメータを追加することで、PLAINERのアクセスデータ上でも実名のトラッキングが可能です。
- メールアドレス部分は、送付先のメールアドレスやドメイン、SFAのID等に別途書き換えをお願いいたします。
- 詳しくはこちらをご覧ください

連携コードサンプル（Marketoのみへの連携の場合）

⚠️設定には、基礎的なHTML/CSS/JaveScriptやMAツールの知識が必要です。個別のご質問にはサポートでお答えしかねます

<script>
(function () {
  var PLAINER_ORIGIN = 'https://product.plainer.co.jp';
  var lastEventKey = '';

  function trackMarketo(path, contentId, retryCount) {
    retryCount = retryCount || 0;

    if (
      window.Munchkin &&
      typeof window.Munchkin.munchkinFunction === 'function'
    ) {
      window.Munchkin.munchkinFunction('visitWebPage', {
        url: path,
        params: 'id=' + encodeURIComponent(contentId)
      });
      return;
    }

    // Munchkinが非同期で読み込まれる場合に備えて再試行します
    if (retryCount < 120) {
      setTimeout(function () {
        trackMarketo(path, contentId, retryCount + 1);
      }, 500);
    }
  }

  window.addEventListener('message', function (event) {
    if (event.origin !== PLAINER_ORIGIN) return;

    var data = event.data;
    if (!data || typeof data !== 'object') return;
    if (typeof data.contentId !== 'string') return;

    var path;

    switch (data.event) {
      case 'plainer_content_operate_start':
        path = '/demo_start';
        break;

      case 'plainer_guide_view_complete':
        path = '/demo_complete';
        break;

      default:
        return;
    }

    var eventKey = [
      data.event,
      data.contentId,
      data.contentCurrentStep
    ].join(':');

    if (eventKey === lastEventKey) return;
    lastEventKey = eventKey;

    trackMarketo(path, data.contentId, 0);
  }, false);
})();
</script>

ご参考

https://experienceleague.adobe.com/ja/docs/marketo-developer/marketo/javascriptapi/api-reference

連携コードサンプル（GoogleAnalytics4へも連携したい場合）

⚠️設定には、基礎的なHTML/CSS/JaveScriptやMAツールの知識が必要です。個別のご質問にはサポートでお答えしかねます

<script>
(function () {
  var PLAINER_ORIGIN = 'https://product.plainer.co.jp';
  var lastEventKey = '';

  function trackMarketo(path, contentId, retryCount) {
    retryCount = retryCount || 0;

    if (
      window.Munchkin &&
      typeof window.Munchkin.munchkinFunction === 'function'
    ) {
      window.Munchkin.munchkinFunction('visitWebPage', {
        url: path,
        params: 'id=' + encodeURIComponent(contentId)
      });
      return;
    }

    if (retryCount < 120) {
      setTimeout(function () {
        trackMarketo(path, contentId, retryCount + 1);
      }, 500);
    }
  }

  function pushDataLayer(payload) {
    window.dataLayer = window.dataLayer || [];
    window.dataLayer.push(payload);
  }

  window.addEventListener('message', function (event) {
    if (event.origin !== PLAINER_ORIGIN) return;

    var data = event.data;
    if (!data || typeof data !== 'object') return;
    if (typeof data.contentId !== 'string') return;

    var eventKey = [
      data.event,
      data.contentId,
      data.contentCurrentStep
    ].join(':');

    if (eventKey === lastEventKey) return;

    switch (data.event) {
      case 'plainer_content_operate_start':
        lastEventKey = eventKey;

        trackMarketo('/demo_start', data.contentId, 0);

        pushDataLayer({
          event: 'demo_start',
          demo_id: data.contentId,
          demo_duration: data.contentTotalSteps
        });
        break;

      case 'plainer_guide_view_start':
        lastEventKey = eventKey;

        pushDataLayer({
          event: 'demo_progress',
          demo_id: data.contentId,
          demo_duration: data.contentTotalSteps,
          demo_current_step: data.contentCurrentStep
        });
        break;

      case 'plainer_guide_view_complete':
        lastEventKey = eventKey;

        trackMarketo('/demo_complete', data.contentId, 0);

        pushDataLayer({
          event: 'demo_complete',
          demo_id: data.contentId,
          demo_duration: data.contentTotalSteps
        });
        break;

      default:
        break;
    }
  }, false);
})();
</script>

※2026年7月修正：サンプルコードにつきまして、contentTotalStepsをcontentTotalStepと記載していたため修正いたしました。

補足

GoogleAnalytics4への連携は、GoogleAnalytics4やGTM側での設定が必要となります。

概要や手順はこちらをご確認ください。

Marketoへの連携方法のご案内

Marketoへの連携

概要

手順

補足

連携コードサンプル（Marketoのみへの連携の場合）

ご参考

連携コードサンプル（GoogleAnalytics4へも連携したい場合）

補足