1.) プレーヤ レベルでの変更
Brightcove の標準テンプレートの一覧をここから表示できます。
一部はパブリッシング コードでサイズ変更ができます。サイズ変更ができる場合はこのページの各テンプレートの上に記載されています。
パブリッシング コードには、'width' と 'height' の 2 つのパラメータがあるのがわかります。たとえば JavaScript のパブリッシング コードは以下のようになります。
<param name="width" value="486" />
<param name="height" value="412" />
数字を調整することによって、プレーヤのコントロールを含むプレーヤ全体をサイズ変更できます。Video Player のテンプレートを使用している場合、これらの寸法を定義するときにプレーヤのコントロールを含めて考える必要があります。希望する動画幅に 6 ピクセル、希望する動画の高さに 52 ピクセルを加えます。
たとえば寸法 480x270 の 16:9 動画用にプレーヤのサイズを指定する場合、レバーボックス化を防ぐためにプレーヤ全体を次の寸法にサイズ変更します。
<param name="width" value="486" />
<param name="height" value="322" />
2.) BEML を使用したテンプレート レベルでの変更
テンプレート レベルでプレーヤを変更する最大の利点は、サイズを 1 回設定し、このテンプレートから複数のプレーヤを作成できるという点です。
この方法についての詳細は次のリンクをご覧ください。
プレーヤ テンプレートを開発する
多くのコンポーネント (TileList あるいは TabBar) を含む標準テンプレートで作業する場合、上記 1. では動画プレーヤのサイズ変更ができません。これは、動画プレーヤのサイズが BEML コード内でハードコーディングされているためです。これらのプレーヤにおいて動画プレーヤを簡単にサイズ変更するには、次の手順を行います。
- Publishing モジュールにクリックで移動します。
- [すべてのテンプレート] をクリックして現在アカウントにあるテンプレートのリストをロードします。
- 「Video Player with Dropdown Navigation」のテンプレートを選択します。
- [複製] ボタンをクリックします。これで新しいテンプレートが作成されます。このテンプレートの名前を「Video Player with Dropdown Navigation copy」に変更します。
- [編集] ボタンをクリックして Template Manager を開きます。ここで BEML コードを編集することによってテンプレートのデザインを変更します。
<VideoPlayer id="videoPlayer" height="275" video="{videoList.selectedItem}"/>
動画プレーヤの高さを調節するには、現在「275」に設定されている高さの値を変更します。この値を変更することによって、動画プレーヤのサイズを調整できます。
動画プレーヤの幅を調整するには、高さのパラメータの直後に次を追加します。
width="xxx"
「xxx」はプレーヤの幅です。