1.タグマネジメントの基本 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 1 タグマネジメント 現在、インターネット広告業界では、各サービス・ソリューションごとに効果測定⽤用のタグ が多数流流通しているため、管理理が煩雑化している状況にあります。 各サービス・ソリューションのタグを⼀一元管理理することで、煩雑化したタグの管理理がシンプ ルに⾏行行え、より効率率率のよい広告運⽤用につなげることが可能になります。 A社タグ D社タグ B社タグ E社タグ ウェブサイトA C社タグ 複数タグを 集約して管理理 ü ウェブページに複数タグを設置する⼯工数や費⽤用が軽減 ü 複数タグを設置しないため、ウェブページ表⽰示速度度低下の懸念念も解決 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 2 タグ読み込みの⾼高速化・安定化 (同期処理理/⾮非同期処理理) 「Yahoo! JAPANユニバーサルタグ」は各種タグを⾮非同期で実⾏行行するため、順列列での実⾏行行と ⽐比べ読み込み時間が短縮されます。 また、⾮非同期での実⾏行行のため、順番にタグを実⾏行行する通 常の⽅方法において、上位設置タグが停⽌止した場合に下位設置タグが読み込まれないリスクを 回避できます。 同期処理理 ⾮非同期処理理 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 3 タグコンテナ タグコンテナ⽅方式は、ほぼ全てのタグマネジメントシステムを提供している企業が採⽤用する ⽅方式です。ウェブサイトには、タグマネジメントシステムのワンタグのみを実装します。管 理理⽅方法は、タグマネジメントシステムの管理理画⾯面で、活⽤用したいタグを選択し、利利⽤用可能に する⽅方法です。タグマネジメントシステムは選択された複数のタグを連結し、⼀一括してウェ ブサイトに送り込み、ウェブサイト側では、この連結された各種アプリケーションのタグを 順次実⾏行行します。 ●タグコンテナ⽅方式での主なメリット ・ カタログ化された国内外主要タグ(随時追加)リストから、 該当タグを選択し広告主様ウェブサイトへの反映を⾼高速で実現 ・ 追加タグ設置作業が不不要となることによる技術⼯工数の削減 ・ 多くのユーザー⾏行行動(マウスオーバーなど)も収集可能 ・ ⾮非同期で各種タグを実⾏行行することによるウェブサイトの⾼高速化 ・ 国内からのホスティングによる速度度の安定と⾼高速化 ・ リアルタイムでのモニタリング機能によるエラー検出の実現 タグコンテナ⽅方式 <Tag> DATA Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 ページ上に タグが配信される パートナー (JS, IFRAME,Pixel) 4 サーバーダイレクト ウェブサイトには、コンテナ⽅方式と同様、タグマネジメントシステムのワンタグのみを実装 します。ワンタグが実⾏行行されることにより、ウェブサイトのデータが、Yahoo!タグマネー ジャーのサーバーに送られます。その後、各種アプリケーションが必要とする情報に振り分 けられ、各種アプリケーションに送られます。この際、各種アプリケーションに共通のパラ メーターを定義し、辞書機能を持たせることで、受け渡すパラメーターの管理理が可視化され ます。 タグコンテナ⽅方式のメリットに加えて、 ●サーバーダイレクト⽅方式での主なメリット ・ クラウドを利利⽤用したデータ収集の実現 ・ クッキーによるデータ保存⽅方式に依存しないため、 販路路やデバイスの違いを超えるデータ収集が可能 ・ ブラウザーの遅延によるデータ損失を回避 ・ システム障害によるデータ損失を回避 ・ サードパーティタグの実⾏行行を管理理可能 (安全性の向上) サーバーダイレクト⽅方式 No Tags <Tag> DATA パートナー HTTP API Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 5 ピギーバック/ JSON/ DOM ■ピギーバック サードパーティーのタグを呼び出す場合に、別のサービス提供元のタグを経由して配信 を⾏行行うことを、ピギーバック⽅方式と呼ぶことがあります。便便利利な⼀一⽅方で、配信の時間 (広告などが表⽰示されるのに必要な時間)を⻑⾧長くしてしまったり、掲載サイトの眼の⾏行行 き届かない第三者の設定するコンテンツを配信したり、意図しないサーバーにアクセス したりするために、セキュリティ上の問題が⽣生じる可能性も否定できません。 ■JSON JSON(Java Script Object Notation)は、JavaScriptのオブジェクト記法をベース にしたデータの表現⽅方法です。配列列や名前と値の組み合わせの集まりを表現することが でき、⼈人間にも⾒見見やすく、機械的な処理理も⾏行行いやすいため、広く利利⽤用されているもので す。Yahoo!タグマネージャーでは、ウェブサイトでのデータ管理理とタグのサービス提 供元へのデータ受け渡しを構造化し効率率率的に⾏行行うため、JSON形式でのデータの管理理を 推奨しています。 ■DOM DOM(Document Object Model)とは、HTMLドキュメントおよびやXMLドキュメン トのためのアプリケーションプログラミングインターフェイス(API)で、ドキュメン トの構造や、ドキュメントへのアクセスや操作の⽅方法を定義するためのものす。⼀一般的 に、ウェブサイトのHTMLドキュメントをJavaScriptなどのスクリプト⾔言語からアクセ スするためによく利利⽤用されます。 DOMの詳細については、ここでは⽴立立ち⼊入りませんが、 Yahoo!タグマネージャーにおいても、DOMの仕組みを利利⽤用して、HTMLドキュメント にアクセスすることができ、ウェブページ上のデータを、連携するサードパーティーの タグに渡すことができます。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 6 クッキー/HTMLタグ ■クッキー クッキーとは、以下のようなことを実現するための仕組みです。 ・訪問者がそのページに何回訪れたか記録して表⽰示する。 ・通常モード、フレームモードなど、訪問者の好みを記録しておき、次回訪問時にその 好みのモードで表⽰示する。 ・掲⽰示板やチャットで⼊入⼒力力したユーザー名を記録しておき、次回訪問時にユーザー名の ⼊入⼒力力を省省略略する。 ・ログインによるセッションを確⽴立立する。 上記のようなデータは CGI などを⽤用いてサーバー側に記録することもできますが、 クッキーを⽤用いることにより、クライアント側(ブラウザーを起動する側)のハード ディスク内にクッキー情報 と呼ばれるデータを記録することができるようになります。 ■HTMLタグ <html> や <head> などをタグ(tag) と呼びます。 多くのタグは、<b>〜~</b> のように 開始タグ(start tag) と 終了了タグ(end tag) で囲みます。開始タグのタグ名の前にスラッシュ(/)をつけたものが終了了タグ です。開始タグを記述するときはそれに対応する終了了タグも記述するのが原則ですが、 終了了タグを省省略略できるもの(<li> や <dd>など)や、終了了タグの無いもの(<br> や <img> など)があります。 タグ名は必ず半⾓角⽂文字で記述してください。⼤大⽂文字・⼩小⽂文字はどちらでも構いません。 昔は⼤大⽂文字が⼀一般的でしたが、HTML の次世代規格とも⾔言われる XHTMLでは、タグは すべて⼩小⽂文字で記述することになっており、HTML も⼩小⽂文字で記述するのが最近の流流⾏行行 りのようです。タグ名の前にスペースをいれてはなりません。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 7 2.Yahoo!タグマネージャーの特徴 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 8 Yahoo! JAPANが提供するタグマネジメントサービスについて Yahoo! JAPANはSignal社の技術を利利⽤用したタグマネジメントサービスを、「Yahoo!タグマ ネージャー」の名称で独占的に⽇日本で提供します。 Yahoo! JAPANの広告サービスをご利利⽤用 中の広告主は同サービスを原則無償でご利利⽤用いただけます。 ・Signal社の技術Signal Tag Signal Tagは、お客様のウェブサイト上におけるサードパーティーのマーケティングタグやアナリティクスタグを単⼀一の インターフェースに置き換え、データドリブンのパートナーの⼀一括管理理を可能にする統合プラットフォームです。 ・タグカタログ 業界の主要なマーケティングおよびアナリティクス企業の多くは、Signal Tagのカタログにあらかじめ導⼊入されています。 タグカタログとは、最適化された国内外主要タグリストです。 ・データの活⽤用 ユーザーがウェブサイトを利利⽤用する際、例例えば商品の購⼊入や閲覧、レビューのチェックなどを通して、ユーザーはマーケ ティング戦略略に役に⽴立立つ重要な⼿手がかりを残しています。 Signal Tagでは、この「ファーストパーティー」データをお 客様が所有する最も貴重なデータと認識識しています。お客様はこのような情報を収集して、カスタムディクショナリーに 整理理することができ、獲得キャンペーンに利利⽤用されるウェブサイトアナリティクスツールの枠を超えてご活⽤用いただけま す。 ※Yahoo!タグマネージャーにはデータを蓄積する機能はありません> Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 9 Yahoo! JAPANユニバーサルタグの設置 (1) 1つのウェブページを1つのアカウントで運⽤用してい る場合 (タグの利利⽤用⽅方法) Yahoo!タグマネージャーから取得できる、Yahoo! JAPANユニ バーサルタグを 必ず</body>の直前に設定してください。ス ポンサードサーチやYahoo!ディスプレイアドネットワーク (YDN)のアカウントを経由して、Yahoo!タグマネージャーへ アクセスし、タグマネージメントを⾏行行います。 (2) 1つのウェブページを複数のアカウントで運⽤用してい る場合(タグの正しい利利⽤用⽅方法) 同⼀一ページに、複数のYahoo!ユニバーサルタグを設定するとき には、1つのYahoo! JAPANユニバーサルタグにSiteIDをまと めて記載する必要があります。 ( (2)は1つのウェブページ が複数の代理理店にまたがってアカウントを運⽤用されている場 合) これを⾏行行うことで、それぞれのアカウントからYahoo!タグ マネージャーが管理理可能となります。 ※1つのウェブページを複数のアカウントで運⽤用している場 合 (タグの誤った利利⽤用⽅方法) 同⼀一ページに、複数のYahoo! JAPANユニバーサルタグを設定 すると設定したすべてのYahoo! JAPANユニバーサルタグが正 しく機能せずすべてのアカウントにおいて各種数値を取得する ことができなくなります。 (1) 1つのウェブページを1つのアカウントで運⽤用している場合 Yahoo! JAPAN ユニバーサルタグ <script type="text/javascript"> (function () { var tagjs = document.createElement("script"); var s = document.getElementsByTagName("script")[0]; tagjs.async = true; tagjs.src = "//s.yjtag.jp/tag.js#site=123"; s.parentNode.insertBefore(tagjs, s); }()); </script> <noscript> <iframe src="//s.thebrighttag.com/iframe?c=123" width="1" height="1" frameborder="0" scrolling="no" marginheight="0" marginwidth="0"></iframe> </noscript> (2) 1つのウェブページを複数のアカウントで運⽤用している場合 Yahoo! JAPAN ユニバーサルタグ <script type="text/javascript"> (function () { var tagjs = document.createElement("script"); var s = document.getElementsByTagName("script")[0]; tagjs.async = true; tagjs.src = "//s.yjtag.jp/tag.js#site=123,567"; s.parentNode.insertBefore(tagjs, s); }()); </script> <noscript> <iframe src="//s.thebrighttag.com/iframe?c=123,567" width="1" height="1" frameborder="0" scrolling="no" marginheight="0" marginwidth="0"></iframe> </noscript> Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 10 タグカタログ タグカタログを表⽰示するためには、「サービスタグ管理理」メニューに表⽰示される、[サービスタグを追加] ボタンを押します。タグが未登録の場合は、以下のように「タグがありません」と表⽰示されます。 ※登録済みタグ画⾯面の[メニュー]ボタンから「サービスタグを追加」メニューを選択することもできます。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 11 タグカタログ タグカタログには、すぐに使⽤用可能なタグと、グレーで表⽰示されているタグがあります。グレーで表⽰示さ れているタグの使⽤用は、弊社担当者にメールで連絡をいただき、有償サポートサービスを導⼊入いただくと、 簡単にご利利⽤用いただけます。なお、画⾯面左側のサービス提供元名をクリックすると、該当のサービス提供 元が提供しているタグの詳細が確認できます。 また、右側のサービス提供元が提供するタグの名前をクリックすると、該当のタグ詳細設定画⾯面が表⽰示さ れます。タグを検索索する場合、サービス提供元名でも、タグ名でも検索索することができます。 ※タグカタログに表⽰示されているタグの動作は確認済みです。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 12 ワイルドカード 「ページを追加」画⾯面にページの定義ごとにURLのパターンを登録することで、コンバー ジョンタグやリターゲティングタグなど、各種タグをまとめて設置できます。 次ページの表に記載したURLの⼊入⼒力力に使⽤用している「**」(半⾓角アスタリスク記号2つ)は、 複数の⽂文字の代替を意味するため、複数存在するページのURLを逐⼀一記載することなく効率率率 よくページの登録が⾏行行えます。 「*」(半⾓角アスタリスク記号1つ)は、”/”(スラッシュ)を含まない任意のURLを⼀一致させ ることができるため、URL中のディレクトリ(フォルダ名)の区切切り⽂文字である「/」を除い た⽂文字列列部分の⼀一致のチェックに都合の良良い場合があります。 Yahoo!タグマネージャーでは、正規表現を使⽤用しなくても、簡単に記述できる以下のルール があります。 「**」は、正規表現による「.*」を意味します。 「*」は、正規表現の「 [^/]*」を意味します。 正規表現については別途ご説明しますので、正規表現を利利⽤用する場合の注意については、 P16を参照してください。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 13 ワイルドカード ※この⽅方法を利利⽤用するには、あらかじめ対象のウェブサイトの各ページを、以下の例例のよう な構造的なネーミングルールで定義しておく必要があります。 ページ名称⼊入⼒力力例例 URLパターン例例 (例例の説明) 全てのページ ** 該当するウェブイトのすべてのページを意味します 製品詳細ページ **/ProdDetail** 例例えば各商品の詳細情報を掲載しているページのすべてを 意味します カートページ **/SPCart/** 各所に設定されている買い物かごページ全般を意味します 例例えば、上記の「全てのページ」にタグを設定した場合、ウェブサイトの全部のページに対 して該当のタグを設置したことになります。 また、「**/ProdDetail_id333.html」のよう な商品IDごとの商品詳細ページすべてを「製品詳細ページ」のページ名でグループ化してタ グ設置対象として登録できます。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 14 正規表現 正規表現とは、対象とする⽂文字列列に、所定の記号を⽤用いて、パターンマッチングさせるとき に利利⽤用する⽅方法の⼀一つです。 Yahoo!タグマネージャーでは、URLにマッチさせるために、Java 61がサポートしている正 規表現を利利⽤用することができます。利利⽤用する際は、正規表現の箇所を「{}」で囲んでくださ い。 ⼀一般的な正規表現の記述の規則については、技術書やインターネット上の資料料を参照してく ださい。 正規表現を使ったURLパターンの例 マッチする/マッチしないURL例 www.example.com/tools/{$} マッチする: http://www.example.com/tools/ マッチしない: http://www.example.com/tools/configure.html www.example.com/tools/{[^/]+} マッチする: http://www.example.com/tools/?source=yahoo http://www.example.com/tools/configure.html マッチしない: http://www.example.com/tools/ Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 15 データディクショナリーと データバインディンディングエクスプレッション URLクエリー⽂文字列列中のパラメーター、HTML中のテキスト、JavaScriptのオブジェクトなどのウェブサ イト上の様々なデータを、データディクショナリーとして⼀一度度整理理して設定しておくと、それ以降降、サイ ト全体で、すべてのサービスタグに対して、データの受け渡しを容易易にすることができます。 ここで定 義するデータは、データバインディングエクスプレッション(データバインディンディングエクスプレッ ション)と呼ばれる表現⽅方法により、ウェブサイトに結び付けます。 データディクショナリー機能によ り、データバインディングされたデータの値は管理理画⾯面の簡単なマウス操作により、最終的に⽬目的のタグ に情報を送るための設定をすることができます。 各種のサービスタグに渡すデータが異異なる場合、それらを安易易にハードコード化(HTMLファイルに直接 記述)してしまうようなことを⾏行行ってしまいがちですが、このような場合により良良い対応が⾏行行えるように なります。 統合されたデータレイヤを設け、いちいち個別の対応をする作業⼯工程を排除することで、 (変更更が必要となったときに都度度タグを再設定するのではなく) より合理理的かつ戦略略的な⼿手法でマーケ ティング活動が⾏行行えます。 データレイヤにより、マーケターが付加情報をタグのサービス提供パート ナーに渡すことが可能となることから、キャンペーン効果が向上すると同時に、マーケティングチームお よびアナリティクスチームの双⽅方にとって、サイトで使⽤用されているタグの種類、場所や⽬目的が明確にな ります。 16 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 データバインディング/イベントハンドリング ■データバインディング ウェブサイトのコンテンツ上には、各種タグサービス提供元に渡したい、 URLクエリー⽂文字列列中の パラメーター、HTML中のテキスト、JavaScriptのオブジェクトなどの、さまざまな情報が点在して います。それらの情報を必要なタグに渡すために結び付ける操作を「データバインディング」と呼び ます。 ■イベントハンドリング ウェブサイトの閲覧者によるマウスなどの操作に対して、あらかじめ⼀一定のルールを決め、タグの配 信を⾏行行うことができます。Yahoo!タグマネージャーがハンドリングできるイベントは以下となりま す。 Trigger ajaxcomplete blur change ページ内で発生したajax処理が完了した場合 指定した要素からフォーカスが外れた場合 内容が変更された場合 click 指定した要素がクリックされた場合 error エラーが発生した場合 focus 指定した要素がフォーカスされた場合 keydown load mousedown 指定した要素にフォーカスがある時にキーが押された場合 すべての要素の読込が完了した場合 指定した要素内でマウスボタンが押下された場合 mouseup 指定した要素上でマウスボタンを放された場合 mouseout 指定した要素内からマウスカーソルが出た場合 mouseover 指定した要素内にマウスカーソルが入った場合 scroll スクロールした場合 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 17 タグ実⾏行行条件(条件の追加) タグ実⾏行行条件を指定しない場合には、ウェブページの読み込みによって、関連付けられてい るタグが無条件に実⾏行行されます。実⾏行行条件を指定する場合には、各タグの「タグ実⾏行行条件」 メニューから設定することができます。「条件の追加」は、⼀一覧(プルダウン)メニューか ら簡単に選択できる「ルール作成」か、直接エディタでコードを書くことができる 「JavaScriptモード」により設定することができます。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 18 タグ実⾏行行条件(条件の追加) ●「ルール作成」 ⽐比較の対象となる「エレメント」と 「⽐比較条件」を⼀一覧から選択し、 ⽐比較する「値」を⼊入⼒力力します。 ※⽐比較条件はデフォルトで 「=(等しい場合)」になっています。 条件は「条件の追加」で追加する ことができます。 ⽐比較条件 =(等しい場合) ≠(等しくない場合) >(左の値が右の値より⼤大きい場合) <(左の値が右の値より⼩小さい場合) ≥(左の値が右の値より⼤大きいか、または等しい場合) ≤(左の値が右の値より⼩小さいか、または等しい場合) 左の値が右の値を含む場合 左の値が右の値を含まない場合 左の値が存在する場合 左の値が存在しない場合 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 19 タグ実⾏行行条件(条件の追加) ●「JavaScriptモード」 タグの実⾏行行条件をJavaScriptのコード形式で直接記述できます。 ※「条件の追加」をクリックした場合の画⾯面のイメージです。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 20 タグ実⾏行行条件(条件の追加) 「JavaScriptモード」で、タグの実⾏行行条件を設定後、ルール作成画⾯面へ戻る場合は、「ルールの作成画⾯面 へ戻る」をクリックします。 「JavaScriptモードで設定した内容を破棄しますか?」ポップアップが表⽰示し[ルール作成画⾯面へ]ボタン を押します。 下記の説明の通り、このモードからメニュー選択⽅方式のモードに戻る場合は、コードとして記述した内容 を保持できません。 [ルール作成画⾯面へ]ボタンを押すと設定が破棄され、 ルール作成画⾯面に遷移します。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 21 タグ実⾏行行条件(条件となるイベントの追加) タグ実⾏行行条件を指定しない場合には、ウェブページの読み込みによって、関連付けられてい るタグが無条件に実⾏行行されます。実⾏行行の条件となるイベントを指定する場合には、各タグの 「タグ実⾏行行条件」メニューで以下の条件を設定できます。「条件となるイベントの追加」に より、ページにバインディングされたイベントをタグの実⾏行行条件として追加できます。 ※ 「条件となるイベントの追加」をクリックした場合の画⾯面のイメージです。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 22 タグ実⾏行行条件(スケジュール) サービスタグの詳細画⾯面の「タグ実⾏行行条件」-「スケジュール」で、当該タグを実⾏行行する期間 を設定することができます。 ※デフォルトでは、「すぐに開始」「終了了⽇日時なし」が設定されています。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 23 タグ実⾏行行条件(スケジュール) 「⽇日時指定」で実⾏行行開始⽇日時と終了了⽇日時を設定し、[保存]ボタンを押し、設定を保存します。 当該タグの[無効]ボタンを押し、「このタグを有効にしますか?」ポップアップで[OK]ボタンを押して 「有効」にします。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 24 タグ実⾏行行条件(フリークエンシーキャップ) フリークエンシーキャップは、ユーザのサイト訪問の頻度度に関してタグ実⾏行行の規則を設定す るものです。例例えば、初回サイト訪問者の特定をする場合や、ユーザ毎に週⼀一度度だけタグを 実⾏行行させたい場合などにフリークエンシーキャップを使います。フリークエンシーキャップ は、広告クリエーティブやキャンペーンの効果を⾼高めるために、⼀一⼈人の訪問者に、特定の広 告やキャンペーンを表⽰示する回数を制限するような場合に利利⽤用します。デフォルトでは、 「フリークエンシーキャップを設定しない」が選択されています。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 25 タグ実⾏行行条件(フリークエンシーキャップ) ・時間単位で、1ユーザーにつきタグを1回実⾏行行させる設定 分間、時間、⽇日間、週間で設定できます。 ・ページビュー単位で、1ユーザーにつきタグを1回実⾏行行させる設定 ・ユーザーセッションごとにタグを実⾏行行させる設定。 ・新規訪問者ごとにタグを実⾏行行させる設定 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 26 スクリプト管理理 タグ実⾏行行時に連携させるサービスタグ提供元のJavaScriptコードのオリジナルロケーション (URL)の登録や、そのJavaScriptコードをアップロードしておきタグマネージャー側でのホ スティングを⾏行行うなどの登録や修正の操作が⾏行行えます。 (1)「サービスタグ管理」-任意のサービ スタグ-「スクリプト管理」メニューをク リック (1) (2)[スクリプトを追加]するボタンを押し て追 加画面を表示させます。 (2) Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 27 スクリプト管理理 ライブラリーホスティング (1)外部(外部のJavaScriptライブラリーから登録) (2)内部(ファイルをアップロード) (3)内部(JavaScriptコードを⼊入⼒力力) (1) (2) (3) Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 28 3.Yahoo!タグマネージャーの操作 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引⽤用・転載禁⽌止 ログイン⽅方法(管理理者権限ユーザー) スポンサードサーチ、または、Yahoo!ディスプレイアドネットワーク(YDN)をご利利⽤用の アカウントで 広告管理理ツールからYahoo!タグマネージャーをご利利⽤用いただけます。 ※管理理者権限ユーザーのみYahoo! JAPANユニバーサルタグを発⾏行行することができます。 [操作⽅方法] (1)広告管理理ツールにログインした状態 で、 「運⽤用サポートツール」タブをクリッ クして「運⽤用サポートツール」画⾯面に移動 します。 (2)中ほどに表⽰示される「 Yahoo!タグ マネージャー 」タブをクリック。 (1) (2) (3) (3)タグ管理理を⾏行行いたいアカウントを⼀一 覧から選択します。 (画⾯面はイメージです) Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 30 ログイン⽅方法(登録更更新権限ユーザー) スポンサードサーチ、または、Yahoo!ディスプレイアドネットワーク(YDN)をご利利⽤用の アカウントで広告管理理ツールからYahoo!タグマネージャーをご利利⽤用いただけます。 ※登録更更新権限ユーザーはYahoo! JAPANユニバーサルタグを発⾏行行することはできません。 [操作⽅方法] (1)広告管理理ツールにログインした状態で、 「運⽤用サポートツール」タブをクリックして 「運⽤用サポートツール」画⾯面に移動します。 (1) (2)中ほどに表⽰示される「 Yahoo!タグマネー ジャー 」タブをクリック。 (2) (3)タグ管理理を⾏行行いたいアカウントを⼀一覧から [ログイン]/[ユーザー登録]ボタンを選択し ます。 ※登録更更新権限は、[設定]ボタンを押せません。 (3) (画⾯面はイメージです) Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 31 ログイン⽅方法 表⽰示内容 機能 [設定]ボタン まだサイト設定を行っていない状態です。該当のアカウントで初めて Yahoo!タグマネー ジャーをご利用になる場合、このボタンを押して開 始します。 (管理者権限ユーザーのみ押すことができます) [ログイン]ボタン ユーザーご自身がすでにYahoo!タグマネージャーのご利用を一度以 上行っているアカウントは、このボタンを押してログインすると画面が切 り替わります。 [ユーザー登録]ボタン 同一代理店内で別のご担当者がすでにYahoo!タグマネージャーのご 利用を開始してサイト登録が行われているアカウントに対して、ご自身 がYahoo!タグマネージャーのご利用を初めて行う場合は、このボタン を押して開始します。 [設定中] [設定]ボタンが押された後、アカウントにサイトを設定している状態で す。しばらくすると[ログイン]ボタンに変わり、ボタンを押すとYahoo!タ グマネージャーのご利用を開始できます。 [ユーザー登録中] [ユーザー登録]ボタンが押された後、ユーザーの登録設定をしている 状態です。しばらくすると[ログイン]ボタンに変わり、ボタンを押すと Yahoo!タグマネージャーのご利用を開始できます。 【ご注意】 ログイン時の画⾯面遷移は、アカウントやツールのご利利⽤用状況・設定状況などに より異異なります。なお、初回ログイン時にはご利利⽤用規約への同意が必要です。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 32 ログイン⽅方法 ■アカウントにすでに設定済みのサイトへの初めてのログイン (同⼀一代理理店内の管理理者権限のご担当者様がすでに設定済みで、ユーザーご⾃自⾝身は初めてロ グインする場合) 代理理店内の複数のご担当者が各⾃自でサイトを作成すると、Yahoo! JAPANユニバーサルタグが複数発⾏行行されてしま い、結果として各種タグの⼀一元管理理が実現できない可能性があります。設置した各種タグを1つのユニバーサルタグ で、複数担当者が⼀一元管理理するために、2⼈人⽬目以降降の⽅方が初めてアクセスする場合、アカウントとサイトの設定を必 ず次の⼿手順で⾏行行ってください。 [操作⽅方法] 1.すでに前回ログインしたご担当者の操作によってYahoo!プロモーション広告のアカウントとYahoo!タグマネー ジャー が連携できているため、広告管理理ツールからYahoo!タグマネージャーの「ログイン」画⾯面へ遷移します。この画 ⾯面で [ユーザー登録]ボタンを押します。 2. 画⾯面は「アカウント⼀一覧」に戻り、ボタンは[ユーザー登録中]の表⽰示に変わります。 3. 数分後に[ログイン]ボタンに変更更となるので、[ログイン]ボタンでログインします。 4. ユーザーの登録を⾏行行うと、タグ設置対象となるウェブサイト共通のYahoo! JAPANユニバーサルタグを複数のご 担当者 様でYahoo!タグマネージャー上で共有管理理でき、設置した各種タグの⼀一元管理理が実現できます。 ■2度度⽬目以降降のログイン Yahoo!タグマネージャーのアカウント⼀一覧画⾯面で該当のアカウントの左側に表⽰示され る[ログイン]ボタンを押して、Yahoo!タグマネージャー画⾯面にログインします。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 33 各メニューの概要 メニュー 概要 ダッシュボード Yahoo!タグマネージャーにログインすると、 まず初めにダッシュボード画 ⾯面が表⽰示されます。 データディク ショナリー データエレメントの追加や、定義済みの各種データエレメントを確認する ことが出来ます。 ウェブサイト ウェブサイトページの追加や、設定済みのページが表⽰示されます。 アプリ Yahoo!タグマネージャーSDKのダウンロード、アプリイベントの追加、設 定済みのアプリイベントが表⽰示されます。 メール メールイベントの追加や、設定済みのメールイベントが表⽰示されます。 広告 広告イベントの追加や、設定済みの広告イベントが表⽰示されます。 API APIイベントの追加や、設定済みのAPIイベントが表⽰示されます。 サービスタグ管 理理 サービスタグの追加や、設定済みのサービスタグが表⽰示されます。 設定 Yahoo! JAPANユニバーサルタグのクッキーを変更更することができます。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 34 各メニューの概要-‐‑‒ダッシュボード メニュー 機能 グラフ 統計画⾯面上部に表⽰示されるグラフは、ページが読み込まれた回数やタグが実⾏行行された頻度度を表します。 ページビュー(ページ表⽰示回数)をオレンジ線、タグ実⾏行行数(タグリクエスト回数)を⻘青線で表⽰示します。画⾯面左上 の[過去24時間](本⽇日)、[過去7⽇日間](今⽇日を含む直近7⽇日間)、[過去30⽇日間](今⽉月初めから本⽇日まで)のボタ ンで表⽰示期間の切切り替えが可能です。初期設定は[過去24時間](本⽇日)です。 ※データ表⽰示期間は⽇日本標準時です。 サービスタグの エラー サービスタグ管理理のエラー画⾯面を表⽰示します。 ウェブサイト ページエラー ウェブサイトエラー画⾯面を表⽰示します。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 35 各タブメニューの概要-‐‑‒データディクショナリー メニュー 機能 カスタムデータ エレメント 登録済みのデータエレメント⼀一覧が表⽰示されます。 データエレメン トの追加 新規データバインディングを追加できます。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 36 各タブメニューの概要-‐‑‒データディクショナリー-データエレメント メニュー 機能 インプット データエレメントがバインディングされているウェブサイトやアプリ等の情報が表⽰示されます。 アウトプット データエレメントが使⽤用されているサービスタグ名が表⽰示されてます。 編集 データエレメント名、説明を編集できます。 削除 データエレメントを削除できます。 データバイン ディングの追加 新規データバインディングを追加できます。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 37 各タブメニューの概要-‐‑‒データディクショナリー メニュー 機能 定義済みデータ エレメント 定義済みの「Timestamp」「User Agent」「Language」「IP Address」「Referrer」「Do Not Track」が表⽰示 されます。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 38 各タブメニューの概要-‐‑‒インプット-‐‑‒ウェブサイト メニュー 機能 Yahoo! JAPANユニ バーサルタグ Yahoo! JAPANユニバーサルタグを取得できます。 ページ 登録済みのページ⼀一覧を表⽰示します。 エラー ウェブサイトページエラーを表⽰示します。 スクリプト管理理 を正しく実⾏行行させる、もしくは特別な設定が必要な機能を利利⽤用するために、スクリプトの利利⽤用を勧める場合 があります。スクリプトをYahoo!タグマネージャー上に登録可能で、個々のタグごとに設定できます。 イベント 設定済みのページイベントの⼀一覧が表⽰示します。また、新規ページイベントの追加ができます。 削除済みインプット 削除済みのウェブサイトページや各イベントが表⽰示します。また、削除済みのウェブサイトページや各イベ ントを元に戻すことができます。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 39 各タブメニューの概要-‐‑‒インプット-‐‑‒ウェブサイト-‐‑‒ページ メニュー 機能 全選択 全ウェブサイトページを選択することができます。 全解除 選択したウェブサイトページ全てを選択解除することができます。 削除 選択したウェブサイトページを削除することができます。 ウェブサイト ページの追加 新規にウェブサイトページを追加することができます。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 40 各タブメニューの概要-‐‑‒インプット-‐‑‒ウェブサイト-‐‑‒エラー メニュー 機能 エラー 発⽣生しているウェブサイトエラーが表⽰示します。 並べ替え条件 「エラー発⽣生率率率」「エラー回数」「リクエスト回数」で表⽰示を変えることができます。 24時間 過去24時間に発⽣生したエラーを表⽰示することができます。 1時間 過去1時間に発⽣生したエラーを表⽰示することができます。 5分間 過去5分間に発⽣生したエラーを表⽰示することができます。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 41 各タブメニューの概要-‐‑‒インプット-‐‑‒ウェブサイト-‐‑‒スクリプト管理理 メニュー 機能 スクリプト管理理 登録済みのスクリプト⼀一覧が表⽰示します。 スクリプトを追 加 新規にスクリプトを追加することができます。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 42 各タブメニューの概要-‐‑‒インプット-‐‑‒ウェブサイト-‐‑‒イベント メニュー 機能 イベント 登録済みのイベント⼀一覧が表⽰示されます。 ページイベントの追加 新規にページイベントを追加することができます。 24時間 過去24時間に発⽣生したエラーを表⽰示することができます。 1時間 過去1時間に発⽣生したエラーを表⽰示することができます。 5分間 過去5分間に発⽣生したエラーを表⽰示することができます。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 43 各タブメニューの概要-‐‑‒インプット-‐‑‒アプリ-‐‑‒アプリイベント メニュー 機能 Yahoo!タグマネージャーSDK のダウンロード iOS⽤用、Android⽤用のYahoo!タグマネージャーSDKをダウンロードすることができます。 アプリイベントの追加 新規のアプリイベントを追加することができます。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 44 各タブメニューの概要-‐‑‒インプット-‐‑‒メール-‐‑‒メールイベント メニュー 機能 メールイベントの追加 新規のメールイベントを追加することができます。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 45 各タブメニューの概要-‐‑‒インプット-‐‑‒広告-‐‑‒広告イベント メニュー 機能 広告イベントの追加 新規の広告イベントを追加することができます。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 46 各タブメニューの概要-‐‑‒インプット-‐‑‒API-‐‑‒APIイベント メニュー 機能 APIイベントの追加 新規のAPIイベントを追加することができます。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 47 各タブメニューの概要-‐‑‒アウトプット-‐‑‒サービスタグ管理理 メニュー 機能 詳細 ヘルプが表⽰示されます。 サービスタグ管理理 登録済みのサービスタグ⼀一覧を表⽰示します。 エラー サービスタグエラーを表⽰示します。 削除済みのサービスタグ 削除済みのサービスタグを表⽰示します。また、削除済みのサービスタグを元に戻すことができます。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 48 各タブメニューの概要-‐‑‒アウトプット-‐‑‒サービスタグ管理理 メニュー 機能 全選択 登録済みの全サービスタグを選択することができます。 全解除 選択した登録済みのサービスタグ全てを選択解除することができます。 有効なタグを選択 ステータスが有効のサービスタグのみ選択することができます。 無効なタグを選択 ステータスが無効のサービスタグのみ選択することができます。 プレビューのタグを選択 ステータスがプレビューのサービスタグのみ選択することができます。 有効 選択したサービスタグのステータスを有効にすることができます。 無効 選択したサービスタグのステータスを無効にすることができます。 プレビュー 選択したサービスタグのステータスをプレビューにすることができます。 削除 選択したサービスタグを削除することができます。 サービスタグを追加 新規サービスタグを追加することができます。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 49 各タブメニューの概要-‐‑‒アウトプット-‐‑‒サービスタグ管理理 メニュー 機能 編集 該当のサービスタグ名とコメントを編集できます。 コピーを作成 該当のサービスタグがコピーされます。 新しいバージョン 該当のサービスタグが”新しいバージョン”としてコピーされます。 削除 該当のサービスタグを削除できます。 統計 実⾏行行されたタグの履履歴を⽇日次、 週次、⽉月次ごとに確認できます。 エラー 過去24時間のタグのエラーを表⽰示します。 サービスタグ情報 タグのパラメーター登録と確認ができます。 ページの設定 タグが設定されている各ページを確認できます。 タグ実⾏行行条件 タグをファイアリングする条件を設定することができます。 スクリプト管理理 サイト管理理タブで設定したライブラリをタグにアサインする項⽬目です。 履履歴 タグの設定変更更履履歴を確認できます。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 50 Yahoo! JAPANユニバーサルタグの取得 ファーストパーティー サードパーティー メ リ ッ ト Yahoo!タグマネージャーのフリークエンシーキャップ機能の利利 ⽤用時、ファーストパーティークッキーを利利⽤用するため、ブラウ ザのデフォルト設定などにより、クッキーをがブロックされる 危険性が、サードパーティクッキー利利⽤用時に⽐比べて低い。 メ リ ッ ト サイトに関係なく、Yahoo!タグマネージャードメインのクッ キーを使⽤用します。 デ メ リ ッ ト ドメインの異異なるサイトでは、サイトごとにYahoo!タグマネー ジャーのクッキーが変わるため、ドメインが異異なると違う訪問 者として認識識されます。サブドメインが違う場合に関しては 「ファーストパーティークッキー取得対象ドメイン」で、同⼀一 クッキーでの管理理が可能となります。 デ メ リ ッ ト ⼀一部のブラウザ(Opera, Firefoxなど)でサードパーティクッ キーをブロックする設定がデフォルトとなっているものがあり、 「クッキー」に依存する機能が正しく動作しない場合がある。 [例例] news.yahoo.co.jp と sports.yahoo.co.jp 「ファーストパーティークッキー取得対象ドメイン」の欄に以下の ように⼊入⼒力力します。 .yahoo.co.jp (ドメイン頭のピリオドは必須です) b.Yahoo!タグマネージャードメインにクッキーが設定される ため、サイト⾃自⾝身のクッキーを利利⽤用したサービスに影響がない ファーストパーティのクッキーの肥⼤大化を防ぐことができる) 既にサイトがクッキーを多⽤用しているような場合、クッキーの サイズがブラウザが許す上限を超えると、意図するクッキーを 使った処理理ができない場合があります。また、クッキーの肥⼤大 化による性能への影響が⽣生じるかもしれません。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 51 スマートカスタムタグ タグカタログにないタグを設定する場合、Signal Tagのスマートカスタムタグ (スマートカスタムタグの追加)で設定が可能です。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 52 エラーの確認 Yahoo!タグマネージャーでは、直近24時間以内のエラー発⽣生状況の確認が可能です。 エラーの状況に よっては正確に情報が取得できない可能性もありますので、発⽣生状況の詳細を確認し、適切切な対応をとる 必要があります。 ログインした直後に表⽰示されるダッシュボードのグラフの下に、[サービスタグエラー]と[ページエラー] のリンクがあります。 その右側に表⽰示されている数が「0」(ゼロ)ならば直近24時間にエラーの発⽣生は ありません。[サービスタグエラー]または[ページエラー]の右に表⽰示された数字(エラー件数)をクリッ クして内容を確認します。 各エラー画⾯面で詳細を確認する際は、表⽰示する時間単位の切切り替えが可能です。 画⾯面右側の[24時間](直 近24時間)、[1時間](直近1時間)、[5分間]を押して単位を切切り替えます。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 53 エラーの種類 ■ページエラー詳細画⾯面■ 画⾯面過去24時間のエラー発⽣生状況を表⽰示します。 グラフ上の各点をクリックするたびに下の 表が更更新され、その時間枠内でキャプチャーされた、最新から100個前までのエラーが表⽰示 されます。 ページからのデータ取得失敗など、通常個別タグ設置の場合にはブラウザーの JavaScriptコンソールに⾒見見られるエラーメッセージのような情報を提供します。表のデータ には次の情報が含まれています。 項目 情報 データエレメント データディクショナリーが正しく設定されていないためデータが取得できなかったデータ項目名 カウント 指定された時間枠内のエラー発生回数 エラーメッセージ ブラウザーから返されたエラーメッセージ ブラウザー このエラーが発生したブラウザーの種類数 URL エラーが発見されたURLの数 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 54 エラーの種類 ■タグエラー画⾯面■ 「エラー詳細」には、過去24時間のタグエラーのグラフが表⽰示されます。 グラフの各点が毎 時を表し、その下の表と直接 対応しています。画⾯面上部のグラフで選択されている点のデータを画⾯面下部の表に⽰示してい ます。 グラフの各点をクリックするたびに下の表が更更新され、その時間枠内でキャプチャー された、最新から100個前までのエラーが表⽰示されます。 表のデータには次の情報が含まれ ています。 項目 情報 エラーメッセージ ブラウザーから返されたエラーメッセージ 例)404エラーなど カウント 指定された時間枠内のエラー発生回数 ブラウザー このエラーが発生したブラウザーの種類 URL エラーが発見されたURLの数 例)コンバージョンページのURL変更などによりデータ取得不可になったとき Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 55 動作確認/テスト Yahoo! JAPANユニバーサルタグ導⼊入に際して、以下の点に留留意し、事前に⼗十分なテストを ⾏行行うことが望ましいです。 ・ 本番配信にできるだけ影響を与えないこと ・ ウェブアクセス解析などのレポートにできるだけ影響を⽣生じないこと なお、次の環境と、⽅方法が望ましいと考えられます。 - 本番稼働中のウェブサーバーとはドメインアドレスだけが異異なるコンテンツなどは完 全に本番と同じ(配信性能は別として)、テスト⽤用のウェブサーバーを⽤用意しておく ページのURLについては、テスト⽤用のサーバーのドメイン(ホスト名)が異異なるように しておく (例例: www.domain.jp VS test.domain.jp ) - 事前に、テスト⽤用サーバーのコンテンツHTMLにYahoo!タグマネージャーのタグを貼る。 - Yahoo!タグマネージャーのページ設定により、本番とテスト⽤用両⽅方のURLに合致する設 定にする。 (例例: *.domain.jp ) - 本番⽤用ウェブサーバーのコンテンツにYahoo!タグマネージャーのタグを貼っていなけれ ば、テストの際に、本番サーバーにYahoo!タグマネージャーのサーバーへの要求が発⽣生 することがないため、基本的には影響を無視できる。 (※デベロッパーツール等を⽤用いた⽅方法は除く) - 本番⽤用ウェブサーバーのコンテンツにYahoo!タグマネージャーのタグを貼れば、 Yahoo!タグマネージャーの設定を変えずに本番配信が可能となる。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 56 ページの新規登録 ページURLはYahoo!タグマネージャーに以下の⼿手順で登録します。 「操作⼿手順」 1. 「ウェブサイト」メニューをクリックし、画⾯面右側の[ウェブサイトページの追加]ボタンを押します。 2. 「ウェブページの追加」画⾯面でページのURLおよび必要な情報を⼊入⼒力力します。 ※URL パターンでhttp、httpsを省省いて⼊入⼒力力した場合、両⽅方に⼀一致します。 3. 「保存」ボタンを押して保存。他にもページの追加をする場合は、[保存してさらに追加]ボタンを押すと連 続してページ情報の⼊入⼒力力が可能です。※複数のURLパターンを同時に登録することはできません。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 57 各種タグの新規登録 「Yahoo! Japanユニバーサルタグ」に登録する各社サービスのタグを、「サービスタグ管理」画⾯面で以下の ⼿手順で選択します。 「操作⼿手順」 1. 「サービスタグ管理」メニューをクリックします。 2. 画⾯面右側の[サービスタグを追加](タグ追加)ボタンを押し、「サービスタグを追加」画⾯面に移動。 ※未設定の状態では、「タグが設定されていません」と表示されます。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 58 各種タグの新規登録 3. この画⾯面で検索索し、必要なタグを選択します。 例例えば、「スポンサードサーチ コンバージョン測定タ グ」を登録するには、検索索ボックスに、「スポンサードサーチ」と⼊入⼒力力して[⾍虫メガネ]ボタンを押すと検 索索結果に当該タグが表⽰示されます。 (画⾯面はイメージです) 上記の例例で「[スポンサードサーチ] コンバージョン測定タグ」の⽂文字をクリックすると、該当するコン バージョンタグの詳細設定画⾯面に移動します。 左側に表⽰示されている会社名をクリックすると、その会社 が提供している各タグの説明を確認できます。その他のタグの選択も、この例例と同様の⽅方法で登録が可能 です。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 59 各種タグの新規登録 4. 個別のタグ詳細画⾯面で必要な情報を⼊入⼒力力します。 ・ 「サービス名」の欄には、管理理に必要な分かりやすい名称を⼊入⼒力力(必須)。 ・ Conversion ID(コンバージョンID)など各タグの運⽤用で必要な情報を⼊入⼒力力 ※コンバージョンIDなどの情報は各サービスのタグ発⾏行行元から⼊入⼿手できます。 画⾯面下の[タグを作成]ボタンを押してタグの内容を保存します。 例例えば上記画⾯面では、必須項⽬目のConversion ID(コンバージョンID)以外に、Conversion Value(コ ンバージョン時の特定の設定値。特定の購⼊入⾦金金額の値など)を設定します。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 60 各種タグの新規登録 5. タグをページに設定します。 ⼿手順4で[タグを作成]ボタンを押すと「サービスタグ」画⾯面の「ページの 設定」画⾯面へ移動します。 あらかじめ登録している各種ウェブページの中から、該当のタグを設置したい ページをこの画⾯面で選択します。 ※タグに対してページを設定されていない状態では、上記のような⻩黄⾊色い警告画⾯面が現れます。 ページ⼀一 覧の各⾏行行左端の複数のチェックボックスにチェックを⼊入れて[ページの設定/解除](プルダウンから「設 定」を選択 。または各ページごとに[未設定]ボタンを押し、「このページを設定しますか?」のポップ アップ画⾯面で[OK]ボタンを押すと、該当のタグがこのページに設定されます。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 61 各種タグの新規登録 6. 画⾯面右上の[無効]ボタンを押し「この設定を有効にしますか?」ポップアップで[有効]ボタンを押して「有 効」にします。 ※「ページの設定」画⾯面では、Yahoo!タグマネージャーにすでに登録済みの複数のページに対して⼀一括で タグを設定することも可能です。複数チェックボックスにチェックを⼊入れる、または「選択/解除」プルダウ ンから「全選択」ですべてを選択して、「ページの選択/解除」のプルダウンで「設定」に変更更します。 Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 62 ユーザのアクションによるイベントを値として返す方法 【 ⼿手順 】 (1)タグを実⾏行行させるページを登録します。 製品詳細ページのURLに、次のパターンが含まれている場合 → detail.php?product_id URLパターンを** detail.php?product_id* で登録し、[保存]ボタンで保存します。 (1) Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 63 ユーザのアクションによるイベントを値として返す方法 (2) 登録したページの「バインディング」タブ-「イベントバインディング」メニューを開き、「イベ ントバインディングを追加」ボタンをクリックします。 (2) Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 64 ユーザのアクションによるイベントを値として返す方法 (3) 「イベントバインディングを追加」画⾯面で以下のように登録し、[保存]ボタンを押します。 トリガー:click エレメントセレクター:#cart (3) Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 65 ユーザのアクションによるイベントを値として返す方法 (4) 登録した「イベントバインディング」は以下のように表⽰示されます。 (4) Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 66 ユーザのアクションによるイベントを値として返す方法 (5) 実⾏行行するタグの詳細画⾯面の「タグ実⾏行行条件」 ⼿手順③で登録したイベント(Cart)を選択します。 - 「条件となるイベントの追加」をクリックし、 (5) Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 67 ユーザのアクションによるイベントを値として返す方法 (6) [保存]ボタンを押すと実⾏行行ルールが表⽰示されます。 (6) Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 68 ユーザのアクションによるイベントを値として返す方法 (7) すべての設定が終了了後[無効]ボタンを押し、「このタグを有効にしますか?」ポップアップで [OK]ボタンを押すと「有効」にします。 (7) Copyright © 2016Yahoo Japan Corporation. All Rights Reserved. 無断引用・転載禁止 69
© Copyright 2024 Paperzz