Facebook Instant ArticlesのでBrightcoveプレーヤーを公開する
Facebook Instant Articlesは、Facebookニュースフィードの記事を読むための高速でインタラクティブなエクスペリエンスです。インスタント記事は、コンテンツ管理システム (Instant Articles API を使用) から直接公開することも、RSS フィードを提供することもできます。インスタント記事は、標準のモバイルウェブ記事よりも10倍速く表示されます。フォローしている友人やページがニュースフィードにリンクを共有すると、Facebook はその URL に関連付けられたインスタント記事があるかどうかを確認します。もしそうなら、Facebookはそれをインスタント記事として表示します。そうでない場合は、ウェブブラウザで開きます。
インスタント記事に埋め込まれている Brightcove Player は、引き続き以下のサポートを受けます。
- プリロールとミッドロール広告
- ビデオクラウド分析
- サードパーティ製プラグイン
Analytics は Video Cloud で収集されますが、brightcove.comfacebook.comアナリティクスに記録される表示ドメインはドメインではなくドメインになります。
インスタント記事を使用してさまざまな種類のコンテンツを共有できますが、このトピックでは、インスタント記事ページでの Brightcove プレーヤーの共有について説明します。インスタント記事の詳細については、 Facebook のドキュメントを参照してください。
プレーヤーの埋め込みコードを生成しています
インスタント記事で使用するために、プレーヤーのプロパティを変更する必要はありません。インスタント記事のプレーヤー埋め込みコードを生成するには、次の手順に従います。
- Video Cloud Studio から標準の iframe 埋め込みコードを取得し、HTML5
<figure>要素内に配置します。<形><iframe src = "// players.brightcove.net/1486906377/V1ziujO35l_default/index.html?videoId=3766858011001" allowfullscreen webkitallowfullscreen mozallowfullscreen width = "640" height = "360">< / iframe>< /形>
op-interactivefigureクラスをタグに追加します。<形class = "op-interactive" >< iframe src = "// players.brightcove.net/1486906377/V1ziujO35l_default/index.html?videoId=3766858011001" allowfullscreen webkitallowfullscreen mozallowfullscreen width = "640" height = "360">< / iframe>< /形>
- iframe
widthにおよびを付けますheight。widthおよびは、heightプレーヤーの絶対サイズではなくアスペクト比を設定します。完成したコードは次のようになります。<図class = "op-interactive">< iframe src = "//players.brightcove.net/1486906377/V1ziujO35l_default/index.html?videoId=3766858011001" allowfullscreen webkitallowfullscreen mozallowfullscreen width = "16" height = "9" >< / iframe>< /形>