ティーリアムジェネリックタグ
この記事では、ほぼすべてのサードパーティベンダーの画像、iframe、またはスクリプトスタイルのタグをページに実装するために使用される、一番合うジェネリックタグコンテナであるティーリアムジェネリックタグの構成と構成方法を説明します。
タグの種類
このタグは、画像、iframe、またはスクリプトの3つのタイプをサポートしています。タグの構成を行う際には、どのタイプのタグを扱っているかを特定することが重要です。そのため、以下に示すようなパターンにタグのコードが一致する場合は、タグの構成で対応するタグのタイプを選択してください。
画像
画像タグのコードスニペットは通常、以下のいずれかを含みます:
new Image()
<img src="https://
document.write("<img src=" ... ">");
Iframe
Iframeタグのコードスニペットは通常、以下のいずれかを含みます:
document.createElement('iframe')
<iframe src="https://
document.write("<iframe src=" ... "></iframe");
スクリプト
スクリプトタグのコードスニペットは通常、以下のいずれかを含みます:
<script type="text/javascript" src="//example.com/tag.js"></script>
document.createElement('script')
タグのコンポーネント
ジェネリックタグを構成するためには、タグを構成する以下のコンポーネントを理解する必要があります。
ベースURL
ベースURLは、ホスト名、パス名、およびピクセルの場所を指すファイルです。?
文字やクエリストリングパラメータは含まれません。
上記のサンプルピクセルでは、ベースURLは次のとおりです://www.example.com/tag.gif
静的および動的パラメータ
多くのタグでは、URLのクエリストリングを使用してデータを収集します。これらは、?
文字の後にURLに表示されるキー/値のペアです。例では、パラメータは次のとおりです:
cid=112233&rg=us&rnd=' + rnd_nocache + '&ref=' + referrer
静的パラメータは、スニペットで見ることができ、ページごとに変わらない値を持つものです。この例では、静的パラメータは次のとおりです:
cid=112233
rg=us
動的パラメータは、ページごとに変わる値を使用して構成することができます。この例では、動的パラメータは次のとおりです:
rnd=
ref=
動的パラメータは、データマッピングを使用して構成する必要があります。マッピングとして構成されたすべての変数は、タグURLのクエリストリングパラメータにキー/値のペアとして追加されます。
キャッシュバスト
ベンダータグでは、クエリストリングにキャッシュバスト変数を必要とすることが一般的です。この値はランダムに生成され、URLに追加されることで、ブラウザがリクエストをキャッシュするのを防ぎます。例では、キャッシュバスティング変数としてrnd
が含まれています。
この機能はジェネリックタグに組み込まれています。キャッシュバスト構成を有効にし、キャッシュバストパラメータの名前を指定するだけで、ジェネリックタグがランダムな値を生成し、割り当ててくれます。
タグの構成
まず、タグマーケットプレイスに移動し、プロファイルにジェネリックタグを追加します。
タグを追加したら、以下の構成を行います:
- タイトル(必須):デフォルトはTealium Generic Tagです。これを任意のカスタム名に置き換えることができます。
- タイプ(必須):タグのタイプを選択します。
- ベースURL(必須):ベースURL(プロトコルを除く)を入力します。
- HTTPS URL:HTTPS URLがベースURLと異なる場合にこのフィールドを使用します。
- ベースURLとHTTPS URLが同じ場合は、ベースURLフィールドに
//
をプレフィックスとして追加し、HTTPS URLフィールドは空白のままにします。これにより、タグは現在のロケーションプロトコルに基づいてHTTPとHTTPSを適切に適用します。 - URLが異なる場合は、それぞれのフィールドを構成します。
- ベースURLとHTTPS URLが同じ場合は、ベースURLフィールドに
- クエリストリングデリミタ:URLからクエリストリング部分を分離するデリミタ文字です。デフォルトは
?
ですが、これを変更することもできます。 - パラメータデリミタ:クエリストリング内の各キー値ペアを分離するデリミタ文字です。デフォルトは
&
ですが、これを変更することもできます。 - キー/値デリミタ:キーとその値を分離するデリミタ文字です。デフォルトは
=
ですが、これを変更することもできます。 - クエリストリング:定義されたデリミタを使用して、静的および動的クエリストリングパラメータを入力します。
動的値の置換
このタグは動的値の置換をサポートしており、ベースURL、HTTPS URL、またはクエリストリング構成フィールドで直接データレイヤー変数を参照することができます。これにより、データレイヤーに基づいた動的なタグを作成する柔軟性が提供されます。フィールドでデータレイヤー変数を使用するには、変数名を@@
で囲んで参照します。例えば、URLのパスにaccount_id
という名前のデータレイヤー変数を挿入するには、次のような値を入力します://example.com/path/@@account_id@@/i.gif
各種類のデータレイヤー変数は、以下のプレフィックスを使用して置換することができます:
- Javascriptページ変数:
@@js_page.variable@@
- メタタグ:
@@meta.variable@@
- クエリストリングパラメータ:
@@qp.variable@@
- クッキー値:
@@cp.variable@@
ロードルール
ロードルールは、このタグのインスタンスをサイトのどこに、いつロードするかを決定します。
データマッピング
マッピングは、データレイヤー変数からベンダータグの対応する宛先変数にデータを送信するプロセスです。変数をタグの宛先にマッピングする方法については、データマッピングを参照してください。
ジェネリックタグはカスタムマッピングのみをサポートしています。テキストフィールドでカスタム宛先名を定義することができます。
コールバック関数
タグがメインライブラリのロード後に実行するコードを必要とする場合、コールバック関数を使用できます。ジェネリックタグは、タグスコープのJavascript Code extension内で再定義できる内部コールバックプロパティu.callback
を定義しています。新しい拡張機能を作成し、コールバックコードを追加し、それをジェネリックタグにスコープするだけで、このコードはタグコードがページ上で実行された後に実行されます。
u.callback
関数は、ジェネリックタグのタイプがimage
に構成されている場合は使用できません。
例:
// このコードをタグにスコープされたJavascript Code extensionに入れます。
u.callback = function() {
console.log("The tag has loaded, now do cool stuff!");
}
HTML属性のマッピング
タグのタイプがScript
またはIframe
の場合、カスタム値または変数をカスタム宛先にマッピングすることで、タグに属性を追加することができます。
例えば、以下のスクリプトはdata-id
属性を使用しています。
<script async data-id="1234567890" src="https://example.com/js/embed.js"></script>
data-id
属性の値を提供するには、カスタム値をattribute.data-id
カスタム宛先にマッピングします。次の図に示すように:
最終更新日 :: 2024年June月20日