トラッキング

ビューの追跡

utag.view() 関数は、ページビュー、仮想ページビュー、およびAjaxページフローを追跡します。この関数を呼び出すと、構成されたベンダータグ内の対応するページ追跡機能がトリガーされます。utag.jsは、ページがロードされるたびに自動的にこの関数をトリガーします。

utag.view()は、ユーザーがサイトをナビゲートする際にURLがリフレッシュされないAjaxページフローで一般的に使用されます。例えば、シングルページチェックアウトやシングルページアプリケーションなどです。

最初のページロード時に宣言されたユニバーサルデータオブジェクト（UDO）、utag_dataは、これらの呼び出しで再利用されません。新しいデータオブジェクトをこの関数に明示的に渡す必要があります。

重要なページビューイベントを識別するために変数tealium_eventを使用し、ページテンプレートを一意に識別するためにpage_typeを使用することがベストプラクティスです。

以下の例では、「商品クイックビュー」ビューを追跡します：

utag.view({
    "tealium_event": "product_view",
    "page_type"    : "product_quick_view",
    "page_name"    : "Quick View: Shirts: Lucky Shirt",
    "product_id"   : ["12345"],
    "product_name" : ["Lucky Shirt"]
});

イベントの追跡

utag.link() 関数は、ページビュー以外のイベント、ページ内のインタラクション、その他の動的ページイベントを追跡します。イベント追跡は、訪問のページ内でのインタラクションに関する情報を収集します。ページビュー追跡が訪問のナビゲーションパスに関する情報を収集するのに対し、イベント追跡はナビゲーションステップの間に訪問が行うことを監視します。

以下の例では、「カートに追加」イベントを追跡します：

utag.link({
    "tealium_event"    : "cart_add",
    "product_id"       : ["12345"],
    "product_name"     : ["Lucky Shirt"],
    "product_quantity" : ["2"],
    "product_price"    : ["12.99"]
});

tealium_event

追跡される各タイプのインタラクションを一意に識別するために、予約変数tealium_eventを使用します。この変数は、Tealium iQ全体でロードルール、拡張機能、およびデータマッピングを構成するために参照されます。他のすべてのイベントデータには、お好みの追加変数名を使用します。

tealium_eventの値の提案には、以下が含まれますが、これに限定されません：

以下の例では、追跡コールに関連する追加情報を追加します：

utag.link({
    "tealium_event"  : "social_share",
    "social_network" : "LinkedIn",
    "shared_link"    : "https://tealium.com/"
});

データレイヤーとTealiumイベントについての詳細を学びましょう。

実装オプション

ページビュー追跡が追跡されるページについてのコンテキストを提供するデータレイヤーオブジェクトを必要とするように、イベント追跡も追跡コールに含まれるデータレイヤーオブジェクトが必要です。追跡コールのデータオブジェクトにイベントに関連する変数を含めます。

次のセクションでは、Tealiumのイベント追跡をウェブサイトに実装する方法について説明します。

jQueryとHTML5

ジェイクエリ拡張を使用して、クリック、展開、選択などのページ内の基本的なインタラクションを追跡します。追跡される要素の情報プロパティを実装するためにHTML5 データ属性を使用します。セマンティックHTMLを使用したウェブページが必要です。

• リンククリック、ボタンクリック、フォームフィールドのインタラクションに最適です。
• Ajaxページフローやフォーム送信には推奨されません。

データ属性を持つ要素は、ページコードで次のように表示されるかもしれません：

<a href="/logout" data-click_name="Sign Out" data-click_category="header">Log out</a> 

このリンクをクリックして追跡し、関連するイベントデータを構成するために、ジェイクエリ拡張でこれらの属性を参照します。

• 特定のデータ属性を持つ要素を識別するためにセレクタを使用します。例えば、a[data-click_name]。
• “JS Code"オプションを使用して、クリックされた要素のデータ属性を参照する変数を構成します。例えば、$(this).data('click_name')。

ページコード

ページコードは、動的ページコンテンツのリフレッシュ、Ajaxページ、モーダルフォームの送信、またはクライアントのウェブサーバーにラウンドトリップリクエスト/レスポンスを必要とするイベントを追跡するために使用されます。

• モーダルフォーム、商品クイックビュー、シングルページウェブサイト、非商品ページからのカート追加に最適です。
• リンク追跡には推奨されません。

ビデオ追跡

ビデオ追跡は、ビデオプラットフォームAPIの仕様に合わせたカスタムソリューションコーディングをしばしば必要とします。

Tealiumの現在のソリューションについては、YouTubeビデオ追跡セットアップガイドで詳しく学びましょう。

シングルページアプリケーション

シングルページアプリケーションのビューとイベントの追跡について学びましょう。