Drupal 8-Brightcoveコネクタ:コンテンツの埋め込み
はじめに
Drupal-Brightcove コネクタを使用すると、Drupal 内で Brightcove 動画クラウドの動画とプレーヤーを管理し、動画を Drupal ページに簡単に埋め込むことができます。これはDrupal 8のためであることに注意してください。Drupal 7 については、 Drupal 7 の手順を参照してください。
注:このドキュメントでは、ブライトコーブがすでに Drupal 用にインストールされ、構成されていることを前提としています。まだ行っていない場合は、まず Brightcove 拡張機能をインストールして設定してください。
このページでは、Drupal コンテンツに Brightcove 動画を追加する方法に重点を置いていますが、同じ手順でプレイリストを追加できます。
セットアップ
に移動します 拡張する セクションを見つけて エンティティブラウザ モジュール。チェックボックスをオンにして、[インストール] をクリックします。モジュールを見つける最も簡単な方法は、検索バーに名前を入力することです。また、をインストールします カオスツール、エンティティブラウザIEF、埋め込み、エンティティ埋め込み、 かつ CKEditor モジュール

Brightcove選択ウィジェット
ビデオを参照するためのカスタムビューを設定します。クリックしてください 構造 タブをクリックし、をクリックします [ビュー]。

クリック ビューを追加。 これはあなたをに連れて行きます 追加 意見 ページ。ビューに名前を付けてから、 ブライトコーブビデオ [ビュー設定] メニューから選択します。クリック 保存して編集。

次に、をクリックします +追加 の中に ディスプレイ セクションを選択して選択します エンティティブラウザ。 次にヒット 保存。
フォーマットには、 テーブル をクリックして デフォルト オプションと選択 テーブル。
さて、ブラウザのフィールドを追加する時間です。それが言うことを確認してください エンティティブラウザ 隅に。あなたはそれを選択した後、自動的にそれに切り替わるべきです。
フィールドを追加するには、をクリックします 追加 横のボタン フィールド ヘッダ。フィールドは主に好みの問題になる可能性がありますが、 ブライトコーブビデオ:エンティティブラウザの一括選択フォーム ビデオを選択できるようにするためのオプションとして。名前もサムネも持てばいい1つのフィールドは非常に良いです not 持っているのは彼らがデフォルトで入れたものです: レンダリングされたエンティティ。 レンダリングされたエンティティは、完全なビデオとすべてのメタ情報であり、エンティティブラウザに含まれています。これにより、かさばり、すばやくビデオを閲覧するのに役立ちにくくなります。

ヒットすることを忘れないでください 保存。
エンティティブラウザの作成
エンティティブラウザを設定するには、に移動します 設定 を選択します エンティティブラウザ オプション。

結果のページで、をクリックします エンティティブラウザを追加 頂点で。表示されたページで、新しいウィジェットのラベルを追加し、選択します。選択する iFrame ディスプレイプラグインの場合、 タブ ウィジェットセレクタプラグインの場合、および 選択表示なし 選択表示プラグイン用。

次打てよ次の数ページには、細かいデフォルトオプションがあるか、オプションがありません。単語が表示されている最終画面に到達するまで続行します 終了 次の代わりに下部に。選択する 意見 の中に ウィジェットプラグインメニューを追加、次にウィジェットにラベルを付けます。の 表示を表示、 選択する Brightcoveビデオブラウザ:エンティティブラウザ。

アップロードタブの追加
クリック ウィジェットプラグインを追加 もう一度ドロップダウンメニューを選択し、 エンティティフォーム。

これにより、最初のフォームの下にフォームが追加されます。ラベルを追加して選択します ブライトコーブビデオ のために エンティティタイプ かつ バンドル。ヒット 終了。

Brightcoveボタンの追加
案内する 設定。の中に コンテンツオーサリング セクション、選択 テキストエディタの埋め込みボタン。

クリック 埋め込みを追加 ボタン。ボタンにラベルを付け、選択します エンティティ 埋め込みタイプの場合 ブライトコーブビデオ エンティティタイプの場合。エンティティブラウザは 、Brightcove コンテンツ用に作成済みのブラウザである必要があります。

アイコンが必要な場合は、ここにアップロードする必要があります。そうしないと、デフォルトのボタンアイコンになります。ここでは、使用できる小さなBrightcoveのロゴアイコンを示します。

帰ります 設定 と選択します テキストフォーマットとエディター。

エンティティ埋め込みボタンを追加するテキスト形式を設定する場合に選択します。投稿するときは、必ずこのテキスト形式を使用する必要があることに注意してください。このプロセスを繰り返して、ボタンを複数の形式に追加できます。

確実に CKeditor に選択されています テキストエディタ。新しいBrightcoveボタンがに表示されます 利用可能なボタン、にドラッグできます アクティブツールバー。

確実に 埋め込まれたエンティティを表示する を選択し、をクリックします 構成を保存する。
Brightcoveビューを追加する
ビデオを適切に表示するには、まず、新しい Brighcove ビューを作成する必要があります。これを行うには、に移動します 構造 ページを選択して選択します 表示モード。次に、をクリックします 表示モード。

クリック 新しいビューを追加する。選ぶ ブライトコーブビデオ ビューモードエンティティタイプとして。新しいビューにラベルを付けて、 保存。


これで、[Brightcoveの動画] の下にビューが表示されます。

次に、新しいビューモードを有効にします。に移動 Brightcoveビデオ設定 の中に 構造 メニューをクリックし、 表示タブの管理。下部には、 カスタム表示設定 箱。新しいカスタムビューを選択して、 保存。

デフォルトでは、ビューには不要なメタデータがビデオとともに表示されます。のそばに デフォルト リンクを表示するには、表示モードの名前が付いたリンクをクリックします。投稿で公開したくないメタデータを無効にし、保持するメタデータを有効にします。セーブを打つことを忘れないでください。

最後に、に移動してキャッシュをクリアします パフォーマンス の中に 設定 メニューをクリックし、 すべてのキャッシュをクリアする。

これで、選択できるようになります ブライトコーブビデオ 表示するビューとして!

Drupal でコンテンツ管理もチェックしてください。