サポートに連絡する| システムステータス
ページコンテンツ

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

    このトピックでは、Brightcove Player用の Google タグマネージャー (GTM) プラグインの使用方法を学習します。

    概要

    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を導入し、使用するために必要な主なステップは以下の通りです:

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

    セットアップの詳細については、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 ビデオ再生終了。


    ディメンション

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

    パラメーター 説明
    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_requestengagement イベントを送信。
    bcvideo_video_duration engagement で送信される。
    bcvideo_video_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 タグ マネージャーを設定するには、以下の手順に従ってください:

    ステップ

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

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

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

      New account information
      New account information
    3. 作成 ボタンをクリックします。
    4. 利用規約に同意します。
    5. Google タグ マネージャーのインストール ダイアログが表示されます。ここからスニペットをコピーし、指定された場所に配置する必要があります。
      New account information
      Snippets
    6. スニペットに戻る必要がある場合は、GTMダッシュボードのコンテナIDをクリックします。
      New account information
      Container ID to see snippets again

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

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

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

    GTMにトリガーの追加

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

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

    1. Google タグ マネージャーのアカウントにログインします。

    2. 左側のナビゲーションで トリガー をクリックし、新規 ボタンをクリックします。
      Create a new trigger
      Create a new trigger
    3. トリガーの設定 ボックスをクリックします。
      Trigger Configuration Modal
      Trigger Configuration
    4. トリガーのタイプカスタム イベント として選択します。

      Trigger configuration
      Trigger configuration
    5. イベント名 を入力します。イベント名は以下の画像のようになります。
      Trigger configuration name
      Trigger configuration name
    6. トラッキングしたいイベントごとにトリガーを作成します。

    7. トリガーはGTMで、以下のように表示されるはずです:

      Triggers in GTM
      Triggers in GTM

    GTMへの変数の追加

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

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

    1. Google タグ マネージャーアカウントにログインします。

    2. 左側のナビゲーションで、変数をクリックします。
    3. ユーザー定義変数セクションで、新規ボタンをクリックします。

      Data Layer Variable
      データレイヤー変数
    4. 変数設定ボックスをクリックします。
      Variable Configuration Modal
      Variable Configuration
    5. 変数タイプは、データレイヤー変数を選択します。

      Data Layer Variable
      データレイヤー変数
    6. 構成の詳細は次のとおりです。

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

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

      User-defined variables
      User-defined variables

    GTMへのタグの追加

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

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

    1. Google タグ マネージャー アカウントにログインします。

    2. 左側のナビゲーションで、タグをクリックし、新規ボタンをクリックしてから、タグの設定をクリックします。
      Create a new tag
      Create a new tag
    3. タグの設定ボックスをクリックします。
      Tag Configuration Modal
      Tag Configuration
    4. タグ タイプGoogle アナリティクス: GA4設定を設定します。

      Tag configuration
      Tag configuration
    5. タグの詳細を入力します:

      • 測定 ID - "G-" ID を入力するか、変数を選択します。
      • pageview を自動的に送信したい場合は、Send a page view event when this configuration loads オプションをチェックしたままにしてください。

      オプション設定:

      • サーバーサイド タギング - すべてのGA4イベントをGoogleアナリティクスではなく、タグマネージャー サーバーコンテナに送信するには、サーバーコンテナに送信を選択します。
      • パラメーター - 設定するパラメータを設定するフィールドに追加します。
      • カスタム プロパティ - ユーザ プロパティで設定するカスタム ユーザプロパティを追加します。

      以下は、その例になります:

      Tag configuration
      Tag configuration
    6. 次にトリガーボックスをクリックします。
      Triggering Modal
      Triggering
    7. タグを発火させるために、対応するトリガーを選択します。

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

      Tags in GTM
      Tags in GTM

    Brightcove との統合

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

    Studioの使用

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

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

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

      Google Tag Manager plugin
      Google Tag Manager plugin
    6. トラッキングしたいイベントとカスタム ディメンションをプレーヤーに伝えるには、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"
        }
       
       }
    7. 保存ボタンをクリックします。プレーヤーのプラグインリストにGoogle Tag Manager プラグインが追加されます。

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

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

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

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

    1. Google アナリティクス アカウントにログインします。
    2. GAページにて:
      1. UIの左下にある 管理 (歯車アイコン)をクリックします。
      2. プロパティ列で、カスタム定義をクリックします。
        custom dimensions
    3. カスタム ディメンションの作成をクリックします。
    4. フィールドに必要な情報を入力してください:

      • Dimension name: パラメータの親しみやすい名前。
      • Scope: これはBrightcove GA プラグインでは、常に Event になります。
      • Description: 適切な説明を加えます。
      • Event parameter: 上記のパラメータから1つを選択します。

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

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

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

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

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

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

      Dimensions and indices
      Dimensions

    ページの最終更新日30 Sep 2021