サポート サポート問い合わせ先 | システムステータス システムステータス
ページ内容

    広告キューポイントを使用した広告の表示

    このドキュメントでは、IMA3プラグインと広告キューポイントを使用して広告を表示する方法を学習します。

    例 player

    以下は、 player 動画のXNUMX秒のマークに作成されたキューポイントに広告を表示します。

    インストラクションビデオ

    以下は、ビデオの再生中に広告キューポイントを使用して広告を再生する手順を説明する教育ビデオです。

    実装の概要

    動画の広告キューポイントに基づいて広告を再生するには、以下を実行する必要があります:

    • In Studio's MEDIA モジュールで、目的の時刻に動画の広告キューポイントを作成します。
    • キューポイントによって要求がトリガーされたときに、ビデオに目的の広告を配信するVASTタグを取得または作成します。
    • 必ず IMA3 プラグインは player。 このドキュメントでは、このタスクを実行するXNUMXつの方法について説明します。
    • 設定する IMA3 広告キューポイントを使用するためのプラグイン。

    広告キューポイントを作成する

    あなたが使う Studio's MEDIA モジュールを使用して、ビデオに広告キューポイントを追加します。 ビデオをクリックし、次のタスクを実行します。

    1. 動画のすぐ下にある 広告キューポイント ボタン。
    2. キューポイントをディスパッチする時間を入力します。
    3. をセットする 種類 〜へ ad.
    4. キューポイントに名前を付けます。
    キューポイントを作成 Studio

    複数のキューポイントを追加できます。 でキューポイントを使用する方法の詳細について Studio 見る メディアモジュールのキューポイントの操作 の資料をご参照ください。

    VASTタグの作成/取得

    IMA3プラグインを設定するときは、VASTタグの場所へのURLを提供する必要があります。 VASTタグは、 player 再生します。 この例では、静的VASTタグ(実際にはVAST XMLドキュメントへのURL)が使用されています。 広告サーバーを使用して、表示する複数の広告からランダムに選択することができます。 いずれにしても、IMA3プラグインは有効なVASTタグを指す必要があります。

    このドキュメントでは、1つの広告を再生する静的なVASTタグが使用されます。 VAST XMLは次のように表示されます。

          <VAST version="3.0">
            <Ad id="1">
              <InLine>
                <AdSystem version="1.0">Test Ad Server</AdSystem>
                <AdTitle>
                  <![CDATA[ Portals ]]>
                </AdTitle>
                <Description>
                  <![CDATA[ Demo ad number 6 ]]>
                </Description>
                <Error>
                  <![CDATA[ ]]>
                </Error>
                <Creatives>
                  <Creative>
                    <Linear>
                      <Duration>00:00:8</Duration>
                      <TrackingEvents/>
                      <AdParameters>
                        <![CDATA[ <xml></xml> ]]>
                      </AdParameters>
                      <VideoClicks/>
                      <MediaFiles>
                        <MediaFile type="video/mp4" width="1280" height="720" delivery="progressive" id="2" bitrate="4316" minBitrate="320" maxBitrate="320" scalable="true" maintainAspectRatio="true">
                          <![CDATA[
                            http://solutions.brightcove.com/bcls/ads/bc-ads/bcls-ad-6-5seconds.mp4
                          ]]>
                        </MediaFile>
                      </MediaFiles>
                    </Linear>
                  </Creative>
                </Creatives>
                <Extensions>
                  <Extension>
                    <xml>data</xml>
                  </Extension>
                </Extensions>
              </InLine>
            </Ad>
          </VAST>

    Studio 実装

    あなたが使用することができます Studio 広告キューポイントを設定します。 高レベルから、次のことを行います。

    • IMA3プラグインを設定するには、 Advertising のセクション PLAYERS モジュールを開きます。
    • あなたの公開 player.

    セットアップを実行する詳細な手順は次のとおりです。

    1. Video Cloud Studioで PLAYERS モジュールと新しいのいずれかを作成します player または見つけます player キューポイント広告を追加したいもの。
    2. リンクをクリックすると player を開く playerのプロパティ。
    3. ナビゲーションヘッダーの Advertising 左側のナビゲーションメニュー。
    4. チェック クライアント側(IMA)を有効にする チェックボックスをオンにします。
    5. 適切なものを提供する 広告タグ.
    6. から リクエスト広告 ドロップダウン、選択 キューポイントでここに示すように、
      プラグイン構成 Studio
    7. ナビゲーションヘッダーの 保存.
    8. 公開するには player、クリック 公開と埋め込み>変更の公開.
    9. 開いているダイアログを閉じるには、 閉じる.
    10. に戻る MEDIA モジュールを作成し、新しく構成した広告キューポイントを使用して動画を公開します player.

    プラグインの設定

    広告キューポイントを正しく使用するには、IMA3プラグインに行う必要のある設定があります。 彼らです:

    • useMediaCuePoints 設定する必要があります true
    • requestMode 文字列に設定する必要があります oncue
    • serverUrl 有効なVASTタグに設定する必要があります

    これらのオプションの詳細については、 IMA3プラグインによる広告 書類 オプション の項目を検索します。

    ページはめ込み埋め込みの実装

    ページはめ込み埋め込みを使用して広告キューポイントを実装することもできます player コード。 以下のコードでは、IMA3プラグインがロードされ、すべてHTMLページに設定されています。

    次のコードは実際の実装です:

    • 7〜12行目:サイズをスタイル設定します player.
    • Line 13:IMA3プラグインのCSSへのリンク。
    • 19〜27行目: player を追加したパブリッシングコード id この属性はJavaScriptで使用されます。
    • Line 29:IMA3プラグインのJavaScriptをインクルードします。
    • 32〜33、40行目:待機する標準コード player 対話する準備ができて、変数を割り当てるコード player オブジェクト。
    • 34-38:必要なオプションにそれらの規定値を割り当てます。
    • ライン39: ima3 プラグインを使用して、オプションをパラメータとして渡します。
    <!doctype html>
    <html>
    
    <head>
      <meta charset="UTF-8">
      <title>Untitled Document</title>
      <style>
        .video-js {
          height: 344px;
          width: 610px;
        }
      </style>
      <link href="https://players.brightcove.net/videojs-ima3/3/videojs.ima3.min.css" rel="stylesheet">
    
    </head>
    
    <body>
    
      <video-js id="myPlayerID"
        data-video-id="4607746980001"
        data-account="1507807800001"
        data-player="rkNxoBMOe"
        data-embed="default"
        data-application-id
        class="video-js"
        controls></video-js>
      <script src="https://players.brightcove.net/1507807800001/rkNxoBMOe_default/index.min.js"></script>
    
      <script src="https://players.brightcove.net/videojs-ima3/3/videojs.ima3.min.js"></script>
    
      <script type="text/javascript">
        videojs.getPlayer('myPlayerID').ready(function() {
          var myPlayer = this,
          options = {
            useMediaCuePoints: true,
            requestMode: 'oncue',
            serverUrl: "//solutions.brightcove.com/bcls/brightcove-player/vmap/simple-vast.xml"
          };
          myPlayer.ima3(options);
        });
      </script>
    
    </body>
    
    </html>

    既知の問題点

    • キューポイントに名前を付けるとき Studioに示すように、 広告キューポイントを作成する 上記のセクションでは、名前に中括弧と二重引用符を使用しないでください。 これを行うと、動的に生成されたVMAPの形式が正しくなくなります。

    ページの最終更新日:28年2020月XNUMX日