プラグインのローカライズ
で提案されているように プラグイン開発のクイックスタート、アプリケーションはローカルで開発され、プラグインに変換されます。
言語を追加する
プラグインでサポートする言語を選択できます。 サポートしたい言語ごとに、英語のキーと対応するローカライズされた言語を値として持つ一連のキーと値のペアが必要です。 これを行うにはVideojs ' addLanguage()
方法。 次のコードは、ドイツ語の翻訳をページに追加する方法を示しています。
videojs.addLanguage('de', {
"Hello": "Guten Tag",
"Goodbye": "Auf Wiedersehen",
});
コンテンツをローカライズする
ローカリゼーションプロセスで使用したい言語と語彙を追加したら、 player's localize()
メソッドを使用して実際のローカリゼーションを実行します。 以下は、HTMLに挿入される文字列を示しています <span>
動画タグの末尾に追加されます。
textSpan = document.createElement('span');
textSpan.className = "localizeStyle"
textSpan.innerHTML = myPlayer.localize("Hello") + "/" + myPlayer.localize("Goodbye");
myPlayer.el().appendChild(textSpan);
localize()
メソッドは英語のキーワードを文字列引数として取ります。 myPlayer.localize("Hello")
ブラウザの優先言語が利用可能でない限り、その文字列を表示します。この場合、ローカライズされた単語が置換されます。
表示言語を設定する
ローカライズされたテキストを表示するには、ブラウザで優先言語を設定する必要があります。 正確な手順は、ブラウザとOSによって異なります。
ブラウザの優先言語が英語または使用できない言語の場合、既定の、または英語のテキストが表示されます。

ブラウザの優先言語が使用可能な言語に設定されている場合は、次のようにローカライズされたバージョンが表示されます。

プラグインコード
に記載されているように ステップバイステップ:プラグイン開発プラグインを含むファイルにコードを挿入します。
- 行27,37:標準を定義するための構文 Brightcove Player プラグイン。 プラグインの名前を後で参照することに注意してください pluginLocalize.
- 28-31:ドイツ語のローカリゼーションを追加します。
- 32-36:HTMLを動的に作成します。
span
要素、それを移入し、それを player コード。
videojs.registerPlugin('pluginLocalize', function() {
videojs.addLanguage('de', {
"Hello": "Guten Tag",
"Goodbye": "Auf Wiedersehen",
});
var myPlayer = this,
textSpan = document.createElement('span');
textSpan.className = "localizeStyle"
textSpan.innerHTML = myPlayer.localize("Hello") + "/" + myPlayer.localize("Goodbye");
myPlayer.el().appendChild(textSpan);
});
テストの目的で、embed_in_pageを利用するページでプラグインをローカルで使用します player インプリメンテーション。
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Localize Plugin Example</title>
<link href="localize-plugin.css" rel="stylesheet">
</head>
<body>
<video-js id="myPlayerID"
data-account="1752604059001"
data-player="9a2e3f23-d63b-43c3-aae9-21f11548e812"
data-embed="default"
data-video-id="3851389913001"
class="video-js" controls></video-js>
<script src="https://players.brightcove.net/1752604059001/9a2e3f23-d63b-43c3-aae9-21f11548e812_default/index.min.js"></script>
<script type="text/javascript" src="localize-plugin.js"></script>
<script>videojs.getPlayer('myPlayerID').pluginLocalize();</script>
</body>
</html>
プラグインを追加 player
プラグインが正しく機能していることを確認したら、プラグインを player。 これを行うには、次の手順を実行します。
- Video Cloud Studioで PLAYERS モジュールと新しいのいずれかを作成します player または見つけます player プラグインを追加する場所。
- リンクをクリックすると player を開く playerのプロパティ。
- ナビゲーションヘッダーの プラグイン 左側のナビゲーションメニュー。
- 次に、をクリックします。 プラグインを追加する.
- プラグイン名 入力します
pluginLocalize
. - JavaScriptを URL、入力:
http://solutions.brightcove.com/bcls/brightcove-player/localization/localize-plugin.js
- CSS URL、入力:
http://solutions.brightcove.com/bcls/brightcove-player/localization/localize-plugin.css
- このプラグインのオプションを入力する必要はありません。
- フォームが次のように表示されていることを確認します。
- ナビゲーションヘッダーの セットで€6.
- 公開するには player、クリック パブリッシュと埋め込み>変更の公開をクリックします。.
- 開いているダイアログを閉じるには、 閉じる.
保存して公開したら、のプラグイン名をクリックして設定を変更できます プラグイン リスト。

プラグインは、 player。 これにより、iframeを使用できます player 他のサポートコードなしで実装し、プラグインの機能を利用できるようにします。
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Localize Plugin - iframe</title>
</head>
<body>
<iframe src='https://players.brightcove.net/1752604059001/9a2e3f23-d63b-43c3-aae9-21f11548e812_default/index.html'
allowfullscreen webkitallowfullscreen mozallowfullscreen></iframe>
</body>
</html>