GTMでGAタグ配信時のOptimizely連携方法(GAタグがカスタムHTMLの場合) | Optimizely 正規代理店イー・エージェンシー
  • 最終更新日:2016年07月26日

GTMでGAタグ配信時のOptimizely連携方法(GAタグがカスタムHTMLの場合)

Optimizelyタグはページヘ直貼りをしていて、Googleタグマネージャ(以降GTM)で、GAタグを配信していて、カスタムHTMLを使用している場合の詳しい連携方法をご案内いたします。

上記に当てはまらない場合はこちらへ
Optimizelyタグ、GAタグが共にページに直貼りの場合
旧Google Analyticsの場合
Universal Analyticsの場合
Optimizelyタグが直貼り、GAタグがGTM経由の場合
用意されたGAタグを使用している場合
OptimizelyタグがGTM経由の場合
Optimizely、GA共にGTM経由での配信の場合

GAのカスタムディメンション作成方法

OptimizelyとGAの統合を行うためには、GAの設定画面で、カスタムディメンションを指定する必要があります。

  1. GAのメニューの[アナリティクス設定] から、該当のプロパティの [カスタム定義] < [カスタムディメンション]を選択
  2. ページ内の[新しいカスタムディメンション]作成ボタンをクリック
    ua-004
  3. カスタムディメンションの名前と範囲[セッション]を選択し、[作成]をクリックして下さい。
    ua-003

    ※ 同時に動いている実験毎にカスタムディメンションを使い分けることができない場合は、1つのカスタムディメンションで運用する場合は[ヒット]単位で取得していただき、[ヒット]単位でデータを取得していることを認識の上、分析を行ってください。

  4. 作成されたカスタムディメンションのインデックス番号を確認してください。
    ua-004

GTMでGAタグを「カスタムHTML」で発行する方法

GTMのタグが、カスタムHTMLタグで発行している場合について、ご説明させていただきます。
GTMを介したGAタグが、カスタムHTMLタグではない場合はこちら

  1. GTM上で「カスタムHTMLタグ」を追加します。タグタイプは「Google Analyticsタグ」ではなく、「カスタムHTMLタグ」を選択してください。このタグの記述部分には「Google Universal Analytics」のトラッキングコードと、Optimizelyの「作成」、「送信」のアクティベーションコールを挿入します。

    最新のトラッキングコードは、Googleアナリティクスで、[アナリティクス設定]タブに移動して、[トラッキング情報] > [トラッキングコード]をクリックし取得することができます

    実装の例は次のとおりです。
    以下のコード中の「UA-XXXX-Y」を、実際のあなたのGoogle AnalyticsのプロパティIDと交換してください。

    <script>
    //Universal Analytics Setup
    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
    })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
     
    ga('create', 'UA-XXXX-Y', 'auto');
    
    window.optimizely = window.optimizely || [];
    window.optimizely.push("activateUniversalAnalytics");
    ga('send', 'pageview'); </script>
  2. 上記の例でのGTM設定例は以下のようになります。

    gtm-01
  3. タグの配信するタイミングトリガーを選択してください。この場合ページビューの「すべてのページ」を選択します。

    gtm-02
  4. Webサイト上に戻り、GTMコンテナタグが<body>タグ内に追加されていることを確認してください。

Optimizelyの設定

  1. Optimizelyの「ホーム」画面から、[統合]タブをクリックしてください。
    表示されたリストから[Google Universal Analytics]を選択し、右サイドバーに表示された詳細画面のボタン[オン]をクリックしてください。

    ua-001
  2. Optimizelyの各実験毎の編集画面上で、[オプション] > [統合] > [Google Universal Analytics]にチェックを入れてください。
    ua-008

    ※ この統合を有効にすることで、UA setDimensionコードを実質的に置き換えます。
    もし、サイトに ga(‘set’, ‘dimension1′, dimensionValue); のコードがあると、Optimizely/UAの統合を上書きしてしまうことがありますのでご注意下さい。

  3. 先程作成したGAの[カスタムディメンション]の値をを選択します。
    このカスタムディメンションはOptimizelyの機能ではなく、ユニバーサルアナリティクスのものであることに注意して下さい。このカスタムディメンションの値は、ユニバーサルアナリティクスの別の箇所で使用されておらず、また、Optmizelyの別の実験で使用されていないことを確認して下さい。
  4. もし、デフォルト以外のEvent Trackingを使用している場合、[Custom Tracker]を指定します。
    例えば、以下のコールを使用している場合、

    ga('tracker2.send', 'pageview');

    [Custom Tracker]に「tracker2」を入力すると、OptimzelyはデフォルトのEvent Trackingに代わり「tracker2」と統合します。

  5. 最後に、[適用]をクリックします。

※ もしOptimizelyで、アクティブ化モードを使用した実験を行っている場合、ユニバーサルアナリティクス(Step1)の設定に加えて、Optimizelyの実験がアクティブになった後に、Google Analyticsへ情報を送る必要があります。

カスタムレポートの作成方法

ここでは、ユニバーサルアナリティクス内の実験レポートの確認方法をご説明いたします。

  1. GAの管理画面から、[カスタマイズ] タブをクリックしカスタムレポートを表示させます。

  2. Optimizelyの実験結果を表示させるために、[新しいカスタムレポート]をクリックしてください。カスタムレポートのタイトルを付け、レポートに表示したい指標グループを追加して下さい。
  3. レポートにOptimizelyの実験を適用するには、「ディメンションの詳細」に、先ほど設定したカスタムディメンションを選択してください。

  4. 次に[フィルタ]に、このディメンションを追加し、フィルタリングしたい実験IDを正規表現で一致させます。これでユニバーサルアナリティクス上で特定の実験結果を表示させることができます。
    実験IDは、実験を行っている編集画面URLの末尾の数列となります。
    https://app.optimizely.com/edit?experiment_id=1234567890

  5. [保存]をクリックします。以上で設定は完了です。

以上で、Optimizelyとユニバーサルアナリティクスの統合は完了です。
実験が開始されると、GAのカスタム変数に結果が表示されていきます。
カスタムディメンションは作成後1日程度時間が立たないとデータが入ってきませんので、実験結果のデータがGAに反映されるまで1日以上の余裕を持つ必要がありますので、実験をスタートする前にあらかじめ設定のご確認をお願いします。

Optimizelyのサポートに関するお問い合わせはこちらまで

ヘルプの関連記事

Optimizely⇒UA_GTM 連携方法について
投稿日: 2017年01月10日
SNS ボタンのクリック目標の計測
投稿日: 2016年09月26日
リダイレクト実験:個別URLのテスト
投稿日: 2016年09月16日
CSSだけでテスト作成 : テストバリエーションにのみ適用されるCSSを書く方法
投稿日: 2016年09月16日
テストの実装でよく使われる jQuery の機能のご紹介 vol2
投稿日: 2016年09月14日

ヘルプのよく読まれている記事