ユニバーサルタグデバッガー

仕組み

ユニバーサルタグ（UTAG）デバッガーは、ユニバーサルデータオブジェクトとevent tracking callsの検証に使用するツールです。UTAGデバッガーはWeb Companionと似ていますが、データレイヤーとutag.js内の各トラッキングイベントでキャプチャされたデータに焦点を当てている点が異なります。

ツールに表示されるデータオブジェクトは、All Tags - Before Load Rulesの範囲にある拡張機能の後、およびAll Tags - After Load Rulesの範囲にある拡張機能の前にキャプチャされます。order of operationsについて詳しく学びましょう。

Tealium Tools拡張機能のインストール

このツールを使用するには、まずTealium Tools拡張機能を使用してChromeブラウザに追加する必要があります。この拡張機能をChromeまたはFirefoxにインストールする方法については、Tealium Tools Browser Extensionを参照してください。

JSONコード

このJSONコードをコピーします。これをTealium Toolsに貼り付けてツールを追加します。

{
    "id" : "teal.sol.debug",
    "title" : "UTAG Debugger",
    "description" : "Universal Tag Debugger",
    "no_ui" : true,
    "scripts" : {
        "utag_monitor" : {
            "js" : "void(window.open(\"\",\"utagmon\",\"width=600,height=600,location=0,menubar=0,status=1,toolbar=0,resizable=1,scrollbars=1\").document.write(\"<script language='JavaScript' id='utagmon' src='//tags.tiqcdn.com/utag/tealium-solutions/main/prod/utag.4.js?opt_show_enrich=0&opt_show_meta=0&opt_show_query=0&opt_show_jspage=0&opt_show_tiq=1&opt_show_cookie=0&_cb=\"+Math.random()+\"'></\"+\"script>\"));",
            "auto_inject" : true
        }
    }
}

JSONをカスタムツールに貼り付ける

ブラウザ拡張機能をインストールした後、以下の手順でJSONをカスタムツールにカット＆ペーストします：

1. ブラウザの右上にあるTealiumアイコンをクリックしてTealium Toolsを開きます。
2. Custom Toolsタブをクリックします。
3. Custom Toolsタブから、以下のJSONコードをカット＆ペーストします：
4. 完了すると、ツール名が表示される新しいボタンがCustom Toolsタブの下に表示されます。

ブックマークレットの作成

以下の手順でツールを起動するブックマークレットを作成することもできます：

1. 以下のコードを使用してブックマークレットを作成します：

   javascript:void(window.open("","utagmon","width=600,height=600,location=0,menubar=0,status=1,toolbar=0,
   resizable=1,scrollbars=1").document.write("<script language='JavaScript' id='utagmon'
   src='//tags.tiqcdn.com/utag/tealium-solutions/main/prod/utag.4.js?
   opt_show_enrich=0&opt_show_meta=0&opt_show_tiq=1&opt_show_dom=0&opt_show_jspage=0&opt_show_cookie=0&_cb="
   +Math.random() +"'></"+"script>"))
   

2. ブックマークレットをブックマークバーにドラッグ＆ドロップします。
   

   

3. ブックマークが使用可能になりました。

UTAGデバッガーツールの使用

UTAGデバッガーツールを使用するには、以下の手順を開始します：

1. 希望のウェブサイトに移動します。
2. Tealium Toolsを開き、Custom Toolsタブをクリックします。
3. Udボタンをクリックします。
   Universal Tag Debuggerツールが表示されます。
   ブックマークを使用する場合は、ツールバーのブックマークレットをクリックするだけです。

   

上部のセクションには、ページ上で検出されたutag.jsファイルが表示され、以下の内容が含まれます：

• account/profile/environmentパス
• utagのバージョン
• 表示エリアに表示するデータを変更するための表示オプションの数

オプション

以下のオプションが利用可能で、ツールの使用とナビゲーションを支援します：

• Bookmarklet – ポップアップの右上隅にあるブックマークレットリンクをツールバーに戻すことで、表示オプションを再保存できます。
• Events – ページ上で検出されたトラッキングイベントはviewイベントまたはlinkイベントになります。これらのチェックボックスを切り替えて表示をフィルタリングします。
• Show Data – UDOデータは常に表示されますが、UTAGによって収集された追加のデータソースは、これらのチェックボックスを切り替えることで表示できます。

データ変数

以下のデータ変数が利用可能です：

• iQ – utag.jsによって収集された組み込みデータ、DOM属性およびutで始まる変数（例：ut.profile）
• Cookie – ページで利用可能なすべてのファーストパーティクッキー
• JS Page – データレイヤーで定義されたJavaScriptページ変数（utag_data以外の変数）
• Querystring – URLで見つかったクエリストリング変数
• Meta – ページで利用可能なすべてのメタデータ値
• AudienceStream – データレイヤーのエンリッチメントによって充填された変数

イベント表示エリア

イベント表示エリアは、ナビゲートするかページ内のイベントをトリガーすると自動的に更新されます。新しいページはutag_viewイベントとしてリストされ、ページ内のイベントはutag_linkイベントとしてリストされます。

上記の例では、訪れたページが2つとトリガーされたイベントが1つ表示されています。これにより、utag_viewエントリが2つとutag_linkが1つ表示されます。最新のアクティビティは常に上部に表示されます。