Brightcove Playerのための Google タグマネージャープラグイン

概要

Googleのタグマネージャー（GTM）を使えば、ウェブサイト、動画コンテンツ、モバイルアプリの利用状況を追跡することができます。まず、アセットにコンテナタグを追加します。次に、ウェブベースのユーザーインターフェースを使用して、ビジネスルールに基づいてコンテナタグに関連付けられた個々のタグをカスタマイズします。

以下はタグの例になります:

Google アナリティクス 4 トラッキングコード
Adwords リマーケティングおよび/またはコンバージョントラッキングコード
カスタム HTML スクリプト

GTMを初めて使用する場合は、Googleのタグマネージャーの概要文書を参照してください。

すでにGoogle Analytics、Adwords、DoubleClickを使用している場合は、これらのツールとうまく統合できるGoogle Tag Managerを使用することもできます。GTMは多くの変数とトリガーのオプションを提供しています。

ワークフロー

GTMプラグインはまず、eventsToTrack と trackerID の存在をチェックし、GTMを初期化します。次に、analytics-beacons または analytics_request イベントをリッスンすることによって、すべてのプレーヤーのイベントをリッスンし、すべてのプレーヤーのイベントにおいて、そのイベントが追跡するイベントのリストに存在するかどうかをチェックします。イベントが存在する場合、プラグインはイベントに関連付けられたカスタムディメンション（paramsToTrackにも存在する）を取得します。GAプラグインで扱われるイベントと、関連するカスタムディメンションについては、イベント、ディメンション、変数を確認するを参照して下さい。

主な実装ステップ

GTMを導入し、使用するために必要な主なステップは以下の通りです:

GTMアカウントを作成し、コンテナをセットアップします。
ウェブページに実装する必要があるコンテナスニペットをコピーして貼り付けます。Googleは、このコードを <head> タグの中か、<body> タグの開始直後に記述することを推奨しています。
タグの作成 - Google アナリティクスまたは Brightcove プレーヤー用
タグの動作を確認します。
タグを公開します。

セットアップの詳細については、Googleのドキュメントタグマネージャーの設定とインストールを参照して下さい。

Brightcove プレーヤーの使用

Google タグマネージャープラグインを使用すると、Google アナリティクスのダッシュボードを使用して Brightcove プレーヤーのイベントを追跡できます。以下のプレーヤーイベントを追跡できます:

Player load
Video impression
Video view
Video engagement
Play request
ad_mode_begin、ad_mode_completeなどの高度なプレイヤーイベント
再生体験を妨げるエラー

タグ管理用語

ここでは、Google タグマネージャ（GTM）を使用する際に遭遇する一般的な用語をいくつか紹介します。

用語	説明
コンテナ	タグ管理システムのアカウントは、独自のタグと変数を持つ複数のコンテナ (プロファイル) を持つことができます。各コンテナは複数の環境を持つことができ、通常は開発、ステージング、および本番用にセットアップされます。
データレイヤー	データレイヤーは、ウェブページのコード内に存在するデータの集まりを指します。この JavaScript オブジェクトは、Web サイトからタグマネージャーコンテナに情報を渡すために使用されます。その後、この情報を使用して変数を設定し、タグ設定でトリガーを有効にすることができます。
イベント	イベントは、レポートツールにデータを送信するために使用されるデータポイントです。これらは、ビデオの読み込みと再生に関連しています。
タグ	タグは、ユーザーインタラクションデータを収集するために Web ページに配置されるコードスニペットです。タグ管理システムでは、サイトにタグを追加するプロセスが簡素化され、タグ ID とタグイベントタイプのみを指定する必要があります。
タグマーケットプレイス	タグマーケットプレイステンプレートは、タグを展開するためのコードスニペットを提供します。これにより、必要なコード知識の量が減りますが、実装を成功させるには JavaScript と HTML に精通している必要があります。
トラッカー	トラッカーとは、データを収集、保存、Google タグマネージャーに送信するオブジェクトです。
トリガー	トリガーは、タグのコードがいつページに追加されるべきかを指示します。これらはユーザー定義の条件です。

必要条件

GTMプラグインを使用するには、以下の要件が必要です:

Brightcove プレーヤー v6.46.0 以降。
Google Tag Managerプラグインでは、プレーヤーを公開する際にVideoタグ(高度な)埋め込みコードを使用する必要があります。このプラグインでは、標準（iFrame）埋め込みコードを使用しないでください。詳細については、Brightcove との統合セクションを参照してください。

イベント、ディメンション、変数の確認

Brightcove プレーヤーから追跡したいイベントとディメンションを選択します。

Events

Brightcove プレーヤーの analytics-beacon イベントで使用される任意のイベント名を使用できますが、以下のイベント名は GTM プラグインで特別に扱われます。

イベント	説明
`player_load`	プレーヤーは読み込まれ、動作可能。
`video_impression`	ビデオがプレーヤーにロードされ、再生の準備が出来た状態。
`video_view`	自動再生またはユーザー操作により、ビデオの再生が開始。
`video_engagement`	ユーザーはビデオのタイムラインの一定範囲の秒数を視聴。このイベントはビデオのエンゲージメントを追跡するためのハートビートであり、ユーザーの操作やビデオの長さに応じて、再生中に何度も送信される可能性があります。
`play_request`	再生は、ユーザーが再生ボタンを明示的にクリックするか、プラットフォームが自動再生構成で再生をトリガーしたときに自動的に開始されます。
`ad_mode_begin`	制御は再生プラットフォームから広告代理業社に引き渡される。
`ad_mode_complete`	制御は広告代理業社から再生プラットフォームに引き渡される。
`error`	致命的なエラーが発生し、再生が中断された。
`video_complete`	ビデオ再生終了。注: このイベントはPlayer6でのみ取得可能で、Player7以上では利用できなくなりました。

ディメンション

以下のディメンションは、すべてのイベント（エラーを除く）に対して送信されます。

パラメーター	説明
`bcvideo_account`	Video Cloud Studio アカウント ID
`bcvideo_destination`	再生された場所
`bcvideo_platform_version`	Brightcove Player バージョン
`bcvideo_player`	Brightcove プレーヤー ID
`bcvideo_player_name`	Brightcove プレーヤー名
`bcvideo_session`	プレーヤーに関連するセッション
`bcvideo_video`	動画 ID
`bcvideo_video_name`	動画名
`bcvideo_tags`	動画に関連するタグのリスト

イベント特有のディメンション

これらのカスタムディメンションは、特定のイベントで送信されます。

パラメーター	説明
`bcvideo_video_playhead`	`play_request` と `engagement` イベントを送信。
`bcvideo_video_duration`	`engagement` で送信される。
`bcvideo_range`	`engagement` で送信される。
`bcvideo_video_percent_viewed`	`engagement` で送信される。
`bcvideo_video_seconds_viewed`	`engagement` で送信される。
`bcvideo_video_milestone`	`engagement` で送信される。

GTM 変数

これらは、GTM 変数として作成できる Brightcove パラメータです。

変数名	説明
`account`	Brightcove アカウント ID
`player`	プレーヤー ID
`player_name`	プレーヤー名
`platform_version`	プラットフォームのバージョン番号
`session`	セッションの識別子
`video`	動画 ID
`video_name`	動画名
`range`	StartSecond...EndSecondのフォーマットで表示される秒の範囲
`seconds_viewed`	視聴秒数
`duration`	動画の長さ（秒）
`percent_viewed`	視聴されたビデオの割合
`error`	イベントに関連するプラットフォーム固有のエラーコード
`milestone`	マイルストーン(25%,50%,75%,100%)の時点の動画視聴
`playhead`	イベントがトリガーされたビデオの時間
`destination`	イベントを発生させたURI

Google タグマネージャーの設定

Google タグマネージャーを設定するには、以下の手順に従ってください:

ステップ

タグマネージャーアカウントを作成するか、既存のアカウントを使用します。新しいアカウントを作成するには、アカウントの作成ボタンをクリックします。

デフォルトでは、新しいアカウントには新しいコンテナが作成されます。各アカウント内にさらにコンテナを作成することもできます。

Create account
アカウント名やコンテナ名など、新しいアカウントページの値を入力し、ターゲットプラットフォームを選択します。

New account information
作成ボタンをクリックします。
利用規約に同意します。

変数、タグ、トリガーの作成

トラッキングしたいBrightcoveのイベントは、全てGoogle タグマネージャ（GTM）でイベントタグとして作成する必要があります。GTM からのイベント ID は、Players モジュール内で使用されます。これにより、Brightcoveのイベントデータを GTM イベントに渡すことができます。

各イベントタグごとに、Google アナリティクスにイベントを送信するための GTM トリガーを作成する必要があります。次に、GTM 変数タブで、各イベントに関連付けられたカスタムパラメータを作成します。

前提条件

まず、Google アナリティクス: GA4 Event タイプのタグを追加するには、Google タグタイプのタグを 1 つ追加する必要があります。これを行うには、次の手順に従います:

タグの種類で Google タグを追加します。

google-tag

このコンテナで Google タグが見つかりました と表示されることに注目して下さい。この手順を忘れると、否定的なメッセージが表示されます。

google-tag-success

GTMにトリガーの追加

トラッキングしたいイベントが決まったら、Googleタグマネージャーでトリガーを作成します。

Googleタグマネージャーでトリガーを作成するには、以下の手順に従ってください。

Google タグマネージャーのアカウントにログインします。
左側のナビゲーションで トリガー をクリックし、新規ボタンをクリックします。

Create a new trigger
トリガーの設定 ボックスをクリックします。

Trigger Configuration
トリガーのタイプ を カスタムイベント として選択します。

Trigger configuration
イベント名 を入力します。イベント名は以下の画像のようになります。

Trigger configuration name
トラッキングしたいイベントごとにトリガーを作成します。
トリガーはGTMで、以下のように表示されるはずです:

Triggers in GTM

GTMへの変数の追加

Brightcoveのパラメータは追加のデータを持ち、イベントとともに渡されます。記録されるすべての Brightcove パラメータは、Google タグマネージャーで変数として作成する必要があります。パラメーター名はプレーヤー内で使用され、Brightcove パラメーターを Google タグマネージャー変数に渡すことができます。

Google タグマネージャで変数を作成するには、次の手順に従います。

Google タグマネージャーアカウントにログインします。
左側のナビゲーションで、変数をクリックします。
ユーザー定義変数セクションで、新規ボタンをクリックします。

データレイヤー変数
変数設定ボックスをクリックします。

Variable Configuration
変数タイプは、データレイヤー変数を選択します。

データレイヤー変数
構成の詳細は次のとおりです。
- データレイヤー変数名 -変数の名前
- データレイヤーバージョン -バージョン 2
次に、Brightcove パラメータを反映するために必要な変数を作成します。この場合、データレイヤー変数 の名前は、プレーヤの JSON 設定にある GTM 変数の customDimensions の後の paramsToTrack の名前と一致する必要があります。GTM 変数として作成できる Brightcove パラメータの一覧は、こちらを参照して下さい。以下に例を示します:

Account variable
ユーザー定義変数は、GTMではこのようになるはずです:

User-defined variables

GTMへのタグの追加

トラッキングしたいイベントごとに、Google タグマネージャーでタグを作成する必要があります。

Google タグマネージャーでタグを作成するには、次の手順に従います。

Google タグマネージャーアカウントにログインします。
左側のナビゲーションで、タグをクリックし、新規ボタンをクリックしてから、タグの設定をクリックします。

Create a new tag
タグの設定ボックスをクリックします。

Tag Configuration
Google アナリティクス を選択します。

Tag configuration
タグタイプ で Google アナリティクス: GA4 イベント を選択します。

Tag configuration
タグの詳細を入力します:
- 測定 ID - "G-" ID を入力するか、変数を選択します。
- イベント名 - イベント名を指定します。
- ユーザーが Web サイトに提供するデータについてさらに詳しい洞察を得る場合は、ユーザー提供データ オプションをオンのままにしてください。
オプション設定:
- パラメーター - 設定するパラメータを設定するフィールドに追加します。
- カスタムプロパティ - ユーザプロパティで設定するカスタムユーザプロパティを追加します。
以下は、その例になります:

Tag configuration
次にトリガーボックスをクリックします。

Triggering
タグを発火させるために、対応するトリガーを選択します。

Trigger
タグはGTMで、以下のように表示されるはずです:

Tags in GTM

Brightcove との統合

GTM を Brightcove プレーヤーに統合するには、Google タグマネージャープラグインをプレーヤーに追加します。

Studioの使用

以下の手順では、Video Cloud Studio を使用してプラグインを読み込みます。

Video Cloud Studio で PLAYERS モジュールを開き、新規プレーヤーを作成するか、プラグインを追加するプレーヤーを見つけます。
プレーヤーのリンクをクリックして、プレーヤーのプロパティを開きます。
左のナビゲーションメニューから、プラグイン をクリックします。
次に、プラグインの追加 ボタンをクリックし、Brightcove プラグインを選択します。

Add a Plugin button
Brightcove プラグイン のドロップダウンを展開し、Google Tag Managerを選択します。

Google Tag Manager plugin
トラッキングしたいイベントとカスタムディメンションをプレーヤーに伝えるには、JSONオブジェクトを作成して オプション (JSON) テキストボックスに貼り付けます。

フィールドの説明:
- tracker - Google タグマネージャーのトラッキングID (GTM-XXXXXXX)
- eventsToTrack - 追跡したいイベント
- paramsToTrack - 追跡したいカスタムディメンション
- milestones - マイルストーンをデフォルトの 25, 50, 75, 100% から変更する整数の配列。これは bcvideo_video_milestone が追跡されている場合にのみ適用されます。
イベントとディメンジョンの完全なリストについては、イベント、ディメンション、変数の確認セクションを参照して下さい。

次が例になります:
```
 { 
  "tracker":"your Google Tag Manager id", 
  "eventsToTrack": {
    "ad_mode_complete": "Ad Mode Complete",
    "ad_mode_begin": "Ad Mode Begin",
    "error": "Error",
    "play_request": "Play Request",
    "player_load": "Player Load",
    "video_complete": "Video Complete",
    "video_engagement": "Video Engagement", 
    "video_impression": "Video Impression", 
    "video_view": "Video View"
  },
  "paramsToTrack": {
    "bcvideo_video_duration": "duration",
    "bcvideo_error_code": "error",
    "bcvideo_account": "account",
    "bcvideo_session": "session",
    "bcvideo_video_milestone": "milestone", 
    "bcvideo_video_name": "video_name",
    "bcvideo_range": "range",
    "bcvideo_video_seconds_viewed": "seconds_viewed", 
    "bcvideo_player_name": "player_name",
    "bcvideo_video_percent_viewed": "percent_viewed", 
    "bcvideo_destination": "destination",
    "bcvideo_video_playhead": "playhead"
  }
 
 }
```
JSONオブジェクト内のカスタムディメンションが、Google アナリティクス内の名前とインデックスと一致していることを確認してください。
保存ボタンをクリックします。プレーヤーのプラグインリストにGoogle Tag Manager プラグインが追加されます。

Save button
プレーヤを公開するには、公開ボタンをクリックします。
ダイアログを閉じるには、閉じるをクリックします。
MEDIA モジュールに戻り、Google タグマネージャー用に更新したプレーヤーを使用して動画またはプレイリストを公開します。プレーヤーを公開するには、Videoタグを選択します。

Google Tag Manager プラグインでは、プレーヤーを公開する際に、Videoタグ(高度)埋め込みコードを使用する必要があります。このプラグインでは、iFrame (標準) 埋め込みコードを使用しないでください。

Advanced embed code
プレーヤーがロードされ、ユーザがプレーヤーとインタラクトすると、指定されたイベントとパラメータがトラッキングされます。

カスタムディメンションの作成

カスタムディメンションは、Google アナリティクスで自分で作成する指標です。Google アナリティクスのUIでカスタムディメンションを作成するには、以下の手順を使用します:

Google アナリティクスアカウントにログインします。
GAページにて:
1. UIの左下にある管理（歯車アイコン）をクリックします。
2. プロパティ列で、カスタム定義をクリックします。
カスタムディメンションの作成をクリックします。
フィールドに必要な情報を入力してください:
- Dimension name: パラメータの親しみやすい名前。
- Scope: これはBrightcove GA プラグインでは、常に Event になります。
- Description: 適切な説明を加えます。
- Event parameter: 上記のパラメータから1つを選択します。

Google Analytics UIの使用方法については、以下をご参照ください:

[GA4] 次世代のアナリティクス、Google アナリティクス 4 のご紹介
[GA4] アナリティクスで新しいウェブサイトまたはアプリのセットアップを行う
[GA4] Google アナリティクス 4 プロパティを追加する（アナリティクスを導入済みのサイトの場合）
[GA4] カスタムディメンションとカスタム指標についてs: イベントパラメータとユーザープロパティからディメンションとメトリックを作成し、レポートや探索でデータに簡単にアクセスできます。

カスタムディメンションの表示

Google アナリティクスでカスタムディメンションを表示するには、以下の手順に従ってください:

Google アナリティクスにログインします。
管理をクリックします。

Analytics admin
カスタム定義をクリックします。

Custom dimensions
カスタムディメンションが表示されるはずです。

Dimensions

ページコンテンツ

Brightcove Playerのための Googleタグマネージャープラグイン

概要