Treasure DataはGoogle Tag Manager (GTM) と連携して、データを一箇所に収集します。この統合により、Googleの管理ツールがお客様のニーズに合わせてより強力になります。
- JavaScript / HTMLの基本知識
- Treasure Dataの基本知識
コンテナを作成したら、その中にCustom HTML Tagとして新しいタグを作成できます。タグとは、他のプラットフォームにデータを送信するように設定されたコードです。タグは、ウェブサイトのソースコードを編集することなく、さまざまなサードパーティツールを組み合わせるために使用されます。
- Google Tag Managerを開きます。
- コンテナを選択します。
- Configure Tagセクションに以下の行を追加し、write-only APIキーとデータベース名を設定します。以下のタグはAll Pagesトリガーに関連付けて実行する必要があります。
<!-- Treasure Data -->
<script type="text/javascript">
!function(t,e){if(void 0===e[t]){e[t]=function(){e[t].clients.push(this),this._init=[Array.prototype.slice.call(arguments)]},e[t].clients=[];for(var r=function(t){return function(){return this["_"+t]=this["_"+t]||[],this["_"+t].push(Array.prototype.slice.call(arguments)),this}},s=["addRecord","blockEvents","fetchServerCookie","fetchGlobalID","fetchUserSegments","resetUUID","ready","setSignedMode","setAnonymousMode","set","trackEvent","trackPageview","trackClicks","unblockEvents"],n=0;n<s.length;n++){var c=s[n];e[t].prototype[c]=r(c)}var o=document.createElement("script");o.type="text/javascript",o.async=!0,o.src=("https:"===document.location.protocol?"https:":"http:")+"//cdn.treasuredata.com/sdk/2.5/td.min.js";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(o,a)}}("Treasure",this);
// Configure an instance for your database
var td = new Treasure({
host: 'in.treasuredata.com',
writeKey: 'YOUR_WRITE_ONLY_APIKEY_IS_HERE',
database: 'DATABASE_NAME'
});
// Enable cross-domain tracking
td.set('$global', 'td_global_id', 'td_global_id');
// track pageview information to 'pageviews' table
td.trackPageview('pageviews');
</script>画面は次のようになります。

Click Triggerを設定することで、ユーザーがクリックしたリンクを追跡できます。これにより、データと{{Click URL}}変数を含む追加のJavaScriptタグがTreasure Dataに送信されます。{{Click URL}}変数には、リンクのURL情報が含まれています。Click Triggerを使用して、ページビューを追跡できない外部サイトへのリンクをユーザーがクリックしたときを追跡できます。Google Tag Managerの変数により、トラッキングがより適応性の高いものになります。変数は変化する値を保持するコンテナのようなもので、ウェブサイトのコンテキストから情報を取得してタグに渡すことができるため、トラッキングと分析の設定がよりカスタマイズ可能になります。
- ワークスペースから、Variablesを選択します。
- Configureを選択します。
- 変数パネルのClicksセクションで、Click URLを選択します。

タグはトリガーに関連付けられます。トリガーとは、ウェブサイト上でタグを実行するタイミングと場所を決定するルールまたは条件です。トリガーはイベントリスナーとして機能し、ウェブサイトのアクティビティを監視します。トリガーは、関連付けられたタグに実行するよう信号を送ります。トリガーは、タグがいつ、どこでアクティブ化または実行されるかを制御します。
- ワークスペースから、Triggersを選択します。
- Newを選択します。
- Trigger Configuration Panelで、Click - Just Linksを選択します。References to this Triggerの下にClicksタグが選択され、トリガーへの参照が実行されるようになります。

- References to this Triggerパネルで、Clicksを選択します。
- Tag Typeの下でCustom HTMLを選択します。
3. HTMLセクションに、以下のコードを挿入します。
<script type="text/javascript">
!function(t,e){if(void 0===e[t]){e[t]=function(){e[t].clients.push(this),this._init=[Array.prototype.slice.call(arguments)]},e[t].clients=[];for(var r=function(t){return function(){return this["_"+t]=this["_"+t]||[],this["_"+t].push(Array.prototype.slice.call(arguments)),this}},s=["addRecord","blockEvents","fetchServerCookie","fetchGlobalID","fetchUserSegments","resetUUID","ready","setSignedMode","setAnonymousMode","set","trackEvent","trackPageview","trackClicks","unblockEvents"],n=0;n<s.length;n++){var c=s[n];e[t].prototype[c]=r(c)}var o=document.createElement("script");o.type="text/javascript",o.async=!0,o.src=("https:"===document.location.protocol?"https:":"http:")+"//cdn.treasuredata.com/sdk/2.4/td.min.js";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(o,a)}}("Treasure",this);
// Configure an instance for your database
var td = new Treasure({
host: 'in.treasuredata.com',
writeKey: 'YOUR_WRITE_ONLY_APIKEY_IS_HERE',
database: 'DATABASE_NAME'
});
// Enable cross-domain tracking
td.set('$global', 'td_global_id', 'td_global_id');
// Track click information to 'clickviews' table
var click_url = {{Click URL}};
td.set('clickviews', {click_url: click_url});
td.trackPageview('clickviews');
</script>これにより、pageviewsテーブルに追加のclick_urlカラムが表示されます。

All Pagesとclick_triggerの2つのTDタグが登録されているはずです。

Google Tag Managerに関連するレコードが表示される場合があります。これらのレコードに含まれるデータの例については、以下の表を参照してください。
| td_title | td_referer | td_host | td_url |
|---|---|---|---|
| gtm-msr | https://gtm-msr.appspot.com/render?id=xxxxxxx | gtm-msr.appspot.com | https://gtm-msr.appspot.com/render2?id=xxxxx |
- クエリ結果からデータを除外するには、次のいずれかを選択します:
- td_titleまたはtd_hostを使用して結果をフィルタリングする。
- テーブルにデータを記録したくない場合は、コードに以下を追加します:
<script type="text/javascript">
if (document.location.href.search('gtm-msr.appspot') == -1) {
/* Attribution code here */
}
</script>