embedコードのスタイルを比較

旧バージョンのプレイヤーからの移行を行う前に、embedコードモデルの相違点を理解おくのは役立ちます。

embedコードの要素

始める前に、Backlotから受け取るembedコードの要素をおさらいしておきましょう。通常、embedコードとはURLで、次のような形式をしています。

<script src="http://player.ooyala.com/v3/<player_branding_id></script>  
<div id='playerContainer'></div>  
embedコードは次のセグメントから構成されています。
このセグメント... 含まれるもの...
プロトコルとドメイン http://player.ooyala.com/v3/ httpまたはhttpsプロトコルのどちらを使用しても構いません。プレイヤーを 使用するには、/v3/ディレクトリを指定してください。プロトコルとドメインの後に、有効なプレイヤー ブランディングIDを付加しなければいけません。単一のプレイヤーは存在しないので、このようにしなければいけません。 お客様が提供するプレイヤーIDに明確に準じています。
プレイヤーブランディングID このセグメントで、特定の指定されスタイルの付いたプレイヤーを特定することができます。Backlotで 新しいプレイヤーを指定し、そこに属性を割り当てると、指定されたプレイヤーは プレイヤーブランディングIDと他に割り当てられた属性から構成されます。詳しくは、 トピック「プレイヤーの作成」を Ooyalaサポート センター → Backlotユーザードキュメントから、および 「プレイヤーの作成」を Ooyalaサポート センター → Backlot開発ドキュメントからご覧ください。
div ID div IDで、divタグのユニークIDを指定できます。このIDを使って CSSまたはJavaScriptファイルでプレイヤーコンテナを参照できます。IDは必ずユニークで ある必要があり、divへの参照が正しく行えます。

embedコードを構成する

Backlotからembedコードを カット&ペーストすることができます。詳しくは、 http://help.ooyala.com/video-platform/tasks/publishing_manual_embed.htmlをご覧ください。 embedスニペットをウェブページへカット&ペーストできない場合、手作業でembedスニペットを 構成しても構いません。方法は、
  • プロトコルとドメインを入力するところから始める。

http://player.ooyala.com/v3/
  • BacklotからプレイヤーブランディングIDを取得する。例:

[[SDLENTITYREF[lt]]]script src='<xref href="http://player.ooyala.com/v3/e533a5df695a4301b8ae48d8cb1d235f" format="html" scope="external">http://player.ooyala.com/v3/
<'replace with alphanumeric player branding id'>></xref>'[[SDLENTITYREF[gt]]][[SDLENTITYREF[lt]]]/script[[SDLENTITYREF[gt]]]
  • Backlotからembedコードを取得するか、>getEmbedCode/setEmbedCode APIリクエストを通じて 取得することもできます。

旧バージョンのプレイヤーからの移行を行う前に、embedコードモデルの相違点を理解おくのは役立ちます。次の例は、旧プレイヤーのembedコードと現在のプレイヤーのembedコードの 相違点を示しています。

シンプルな旧プレイヤーのembedコード

旧Ooyalaプレイヤーの場合、playerIdパラメータをプレイヤーに渡して、プレイヤーを参照していました。 たとえば、「myPlayer」を playerIdに指定したとします。DOM要素のlookup $('#myPlayer') を 使ってプレイヤーを参照します。旧プレイヤーでは、playerオブジェクト(player.js)を参照し、 Ooyalaクエリー文字列パラメータで幅や高さといったカスタマイズの属性を指定します。次の例では、Backlotから取得した、または自分で作成した実際の embedコード文字列が続きます。

<script src="http://player.ooyala.com/player.js?width=<width>&height=<height>
&embedCode=replace_with_embed_code></script>  

シンプルなプレイヤーのembedコード

旧プレイヤーとは対照的に 現在のOoyalaプレイヤーはplayerオブジェクトを直接参照します。旧 player.js相当のものを現在のOoyalaプレイヤーで参照するには、OO.Player.create()から 返ってきたオブジェクトを呼び出すだけです。このオブジェクトは、後から使用する目的でどの場所 にでも格納しておくことができます。次の例は、シンプルなOoyalaプレイヤーの作成方法を示しています。
<script src="http://player.ooyala.com/v3/<player_branding_id></script>  
<div id='playerContainer'></div>  
<script>
var myPlayer = OO.Player.create('playerContainer', 'replace_with_embed_code', {
  width: <width>, height: <height>
});
</script>  

この記事はお役にたちましたか?