adobeのLaunchでGTMのトリガーや変数を利用する

7732 ワード
adobe gtm 初心者 launch adobe テキストリンク

はじめに

　GTMで運用していたDTMタグをLaunchに移行したのですが、一部のタグがGTMのカスタムイベントやカスタム変数に依存していたため移行後もGTMの設定を利用することにしました。ここでは、「GTM変数をLaunchの変数にする方法」「GTMトリガと同じタイミングでLaunchルールを発火させる方法」をまとめました。

GTM変数をLaunchの変数にする方法

GTMで以下のように定義された変数をLaunchで使用する方法を説明します。

項目名 値
変数名 Example 1
変数のタイプ データレイヤーの変数
データレイヤーの変数名 example_1

  • Launch側でデータエレメントを以下のように設定します。

  • 以下は上図④のソースコードです。


return google_tag_manager['GTM-XXXXXXX'].dataLayer.get('example_1');

GTMトリガと同じタイミングでLaunchルールを発火させる方法

　GTMのトリガ及びカスタムイベントは直接Launchで受信できないので、GTMに別途カスタムイベントを起こしてもらうようにします。
　カスタムイベントのトリガはLaunchで準備し、GTMはイベントを起動するだけになります。

GTM側 - カスタムイベントを起こす

  • 変数を設定します。
項目名 値
変数名 Launch Event
変数のタイプ データレイヤーの変数
データレイヤーの変数名 launch_event
  • 下記のコードをタグとして保存します。移行前に使っていたトリガで発火させます。

<script>
var eventTrigger = {{Launch Event}};
if(eventTrigger){
    var dom = {{Click Element}};
    eventTrigger(dom);
}
</script>

Launch側 - カスタムイベントのトリガを準備する

　GTM側で実行されるトリガ関数は、前もってLaunchからデータレイヤーにプッシュしておきます。

  • ルールを以下のように設定します。

  • 以下は上図④のソースコードです。


try {
  if(!google_tag_manager['GTM-XXXXXXX'].dataLayer.get('launch_event')){
    throw 'launch_evnt is not exist.';
  }
} catch(ex) { 
  window['dataLayer'] = window['dataLayer'] || [];
  dataLayer.push({
    'launch_event':
    (function(dom){
      var e;
      try {
        e = new CustomEvent('event_valueChanged', {'bubbles':false, 'cancelable':true});
      } catch (ex) {
        e = window.document.createEvent('CustomEvent');
        e.initCustomEvent('event_valueChanged', false, true, void 0);
      }
      dom.dispatchEvent(e);
    })
  });
}

Launch側 - カスタムイベントを受信する

  • ルールを以下のように設定します。

以上