Googleタグマネージャー側の設定を行う

アナリティクス上でカスタムディメンションを作成した次には、Googleタグマネージャーの設定です。

Googleタグマネージャーを使わずにするのであれば、執筆者Aの記事の時には以下のコードを挿入する必要があります。

ga('set', 'dimension1', '執筆者A');

他の執筆者の時も同様です。

Googleタグマネージャーを利用すれば、内部のコードをいじることなくブラウザ上で別々のタグを入れる設定をすることができます。

タグの設定をする

Googleタグマネージャーの管理画面を開き、「新しいタグを追加」をクリックすると次のような画面が表示されます。

gtm1.png

まず上部の「タグの設定」を選択し、タグタイプを選ぶ場面では「ユニバーサルアナリティクスを」を選択します。次に詳細設定をクリックします。

Screenshot_2016-11-25_at_15.22.43.png

トラッキングIDにGoogle アナリティクスのIDを入力します(UA-XXXXXX-XX)。

次に詳細設定の中にある「+カスタムディメンション」を選択します。

インデックスには先ほど作成した際に確認した番号を入力します(1〜20)。

ディメンションの値には「執筆者名」となる変数を入力します。この変数を入力する箇所が一番複雑であるため順を追って説明します。

「執筆者名」となる変数とは

今から作成するタグはトラッキングする全ページに挿入します。当然ですが、ページによって執筆者が異なります。そのため、カスタムディメンションの値は執筆者に応じて「執筆者A」「執筆者B」といったように変化する必要があります。そこで変数を入力します。

「執筆者名」用の変数を入力する

入力欄の右にあるブロック型のマークをクリックすることで、変数の設定ができます。

Screenshot_2016-11-25_at_15.32.00.png

クリックすると次のような画面が開きます。ここにはあらかじめ用意されている変数が並んでいます。
例えば、Page URLを選択するとページごとにURLを表す変数を入力することができます。

執筆者名という変数は存在しないので新規作成するために、ページ右上にある「+」をクリックします。

Screenshot_2016-11-25_at_15.33.32.png

変数を設定する

Screenshot_2016-11-25_at_15.36.06.png

クリック下先のページで変数の設定を行います。変数タイプはDOM要素を選択します。DOMとは、Document Object Modelの略で、簡単にいえばDOM要素とはHTMLタグ

  • など文書の構造を表すための装飾)に関わるもののことです。

    このDOM要素を指定することで執筆者名を取得するのですが、用語だけではわかりにくいと思うので例とともに説明します。

    例えば次のように執筆者名がHTMLで表現されていたとします。

    <span id=”author” class=”author-name”>執筆者A</span>
    

    このような場合は「id=”author”であるspanタグの中身」と指定することでそれぞれの執筆者名が取得できます。また「classが”author-name”であるspanタグの中身」としても取得できます。

    ferretでこのタグを確認してみましょう。

    利用しているブラウザがChromeの場合では、右クリックを押して「検証」を選択することでタグが確認できます。

    Screenshot_2016-11-25_at_15.46.08.png

    画像の文字が小さくてわかりにくいかもしれませんが、この場合であれば、li.author.gtm-click-senderというセレクタによって執筆者名のタグが指定できるのがわかります。

    Googleタグマネージャーに戻り、セレクタを入力し属性名を空にしておくことで執筆者名を取得するための変数の設定は終了です。
    変数名に「執筆者名」とつけて保存して次の項目に進みましょう。

    属性名について補足しておきます。執筆者Aという形であれば、取得するのはテキストタグで囲まれている部分)であるため、属性名は空にしておきます。

    という場合であれば、取得するのは「content」というmetaタグの属性の値「執筆者A」であるため、属性名は「content」と設定します。

    ※この記事ではページ上に執筆者の情報があることを前提にしています。そもそもページ上に執筆者名がない場合(内部的に管理されている場合)はこの方法は利用できないため御了承ください。

    トリガーの設定をする

    挿入するタグの設定は以上で済んだため、次にトリガーを設定します。こちらはタグほど複雑ではなく、「All Pages」を選択してすべてのページに適応させれば完了です。

    これでタグを保存することで、すべての設定が終わります。