でぶててのWEB録

PPC広告とか!タグマネジメントとか!WEB解析とか!だいたいそこらへん。

【YTM】リンククリック時に動くように、タグを設定する方法

Yahoo!タグマネージャーを使って特定のリンク先をクリックした場合にのみ、コンバージョンタグやリターゲティングタグなどを動くように設定する方法。Googleタグマネージャに比べるとちょっと手間がかかるんです(´・ω・`)


※今回も、同僚の @AQRiL_1132 の力を借りて書いています。

f:id:debutete:20151116015343p:plain


大まかな手順は以下の通り。

  1. イベントバインディングについて
  2. 任意のページにイベントバインディングを追加
    1. 特定のURLを「含む」場合
    2. 特定のURLから「始まる」場合(先頭一致)
    3. 特定のURLで「終わる」場合(末尾一致)
  3. 任意のタグに稼動条件を設定する


先に書いた、滞在時間を複数取得する方法に比べると全然簡単!スマホサイトで電話番号をタップした回数をコンバージョンとして設定する(簡易コールトラッキング)ときにも使える方法です。


イベントバインディングについて

イベントバインディングは、YTMのタグを設定したサイト内のマウスやキーボード、ブラウザの挙動(イベント)をYTMに紐づけることです。


Yahoo!タグマネージャーに、標準でセットされているイベントは以下の通り。


イベント名 イベントの説明
ajaxComplete ページ内で発生したajax処理が完了した場合
change 内容が変更された場合
click 内容が変更された場合
error エラーが発生した場合
focus 指定した要素がフォーカスされた場合
blur 指定した要素からフォーカスが外れた場合
keydown 指定した要素にフォーカスがある時にキーが押された場合
keyup 指定した要素にフォーカスがある時にキーが押されたあとに、上がった場合
mousedown 指定した要素上でマウスボタンを押した場合
mouseup 指定した要素上でマウスボタンを離された場合
mouseout 指定した要素内からマウスカーソルが出た場合
mouseover 指定した要素内にマウスカーソルが入った場合
scroll スクロールした場合
load すべての要素の読込が完了した場合

※各イベントの違いは、下記URLを参考にしてください。ブラウザによる挙動の違いもありますんで。



イベントバインディングを設定する

イベントバインディングを追加する

今回は「クリック」したときのイベントになるので、「click」というイベントを使います。


ページ管理 > イベントを設定したいページ > イベントバインディング > イベントバインディングを追加 の順にクリック。ポップアップが表示されるので、新規作成を選択。

それぞれの項目の入力例は、次の通り。

  • イベント名 ⇒ 任意(例:LinkClick_includeURL
  • イベントの説明 ⇒ 任意(例:特定のURLを含む)
  • トリガー ⇒ click
  • バインディング方法 ⇒ ダイレクト
  • エレメントセレクター ⇒ 次項参照

画像は作業順。

f:id:debutete:20151116011303p:plain

f:id:debutete:20151116011314p:plain


リンククリックを取得するためのエレメントセレクター

エレメントセレクターに下表のscriptを入力する。
●●●● には、一致方式に合わせてリンク先のURLを書いてください。


パターン 略称 script
特定のURLを「含む」 含む a[href *='●●●●']
特定のURLから「始まる」 先頭一致 a[href ^='●●●●']
特定のURLで「終わる」 末尾一致 a[href $='●●●●']

ここで、任意のページで「リンク先URLが●●●●の箇所をクリックした」というイベントをYTMで拾うことができるようになります。仮に、全部設定するとこんな感じ。


f:id:debutete:20151116011513p:plain



イベントをタグに紐づける

YTMでGoogleアナリティクスを使う人は、ほぼいないでしょう。


おそらく、電話計測(tel:~)やダウンロード計測(~.pdf)のコンバージョンや、リターゲティングリストの除外用に使うことがほとんどじゃあないかと。ここでは、Googleアドワーズのリターゲティングリストを除外用に使うために、タグを稼動させるとします。


サービスタグ管理 > イベントを設定したい任意のタグ > タグ実行条件 > 条件となるイベントの追加 の順にクリック。あとは、使いたいイベントを選択して保存するだけ。

f:id:debutete:20151116012529p:plain


※あらかじめタグに「イベントを設定した」ページが設定されてからの手順ですので、設定されてなければタグは動きません。ご注意を~^^/



YTMは簡単だけど、手間はかかる

コンバージョンタグやリターゲティングタグの設置であれば、GTMより楽ちんです。タグカタログの量はGTMを圧倒してるので。今回のようにちょっとした応用になると、GTMのほうが楽だったりもします。GTMとYTMのどっちがいいわけではなく、それぞれメリット/デメリットはあるので、理解したうえで使いこなしていければいいんじゃなかなーとか思います。



copy right 2012 でぶてて