埋め込みコード/URLの取得 – millvi

millviの埋め込みコード/URLの取得手順について解説します。
埋め込みコードは埋め込み先によって取得するタグが変わります。

PC/スマートフォン向けscriptタグ

管理画面で「コンテンツ」を開き、埋め込みコードを取得したいコンテンツをクリックします。
［PC/スマホ］タブが開かれているので、リスト①から使用したいプレイヤーの種類を選択します。

このリストに表示される埋め込みコードは、シングルプレイヤーを使用し作成した埋め込みコードのみとなります。※出荷状態では、「SinglePlayer」という埋め込みコードを予めご用意しています。
［クリップボードにコピー］②をクリックすると、埋め込みコードをコピーできます。

PC/スマートフォン向けiframeタグ

iframe内に動画プレイヤーを設置したHTMLページを表示するタグを取得することができます。
ご利用のCMSなどの制限により、scriptタグがご利用いただけない場合にご利用ください。

［PC/スマホ］タブが表示された状態で、使用したいプレイヤー①を選択します。
[iframe]タブをクリックし、[クリップボードにコピー]をクリックすると、iframeタグをコピーできます。

注意

iframeのサイズを変更する際は、プレイヤーをレスポンシブ設定にして、設置するWebページ側のCSSにて調整をお願いいたします。

ワンタイム機能をご利用の場合、iframeタグ自体に有効期限が設定されます。有効期限は、タグの発行後30分となります。

iframeタグで動画等を埋め込んだ場合、お客様のご利用環境によっては、scriptタグによる埋め込みとは異なる動作をする可能性があります。ご利用の際は、事前に動作確認を行なうことをおすすめします。

配信用HTMLページURL

プレイヤーが埋め込まれた簡易HTMLページのURLを取得することができます。

［PC/スマホ］タブが表示された状態で、使用したいプレイヤー①を選択します。
［HTML］タブ＞［クリップボードにコピー］の順にクリックすると、URLをコピーできます。

注意

HTML（URL）はプレビュー用のURLとなります。Webサイトへ埋め込む際はscriptタグもしくはiframeタグをご利用ください。

ケータイ（フィーチャーフォン）向けURL

ケータイ（フィーチャーフォン）向けに、「動画URLが挿入されたaタグ」または「QRコード」を発行することができます。お好きなものをご利用ください。

［ケータイ］タブをクリックすると、ケータイ動画のURL及びQRコードを確認できます。
［クリップボードにコピー］①をクリックすると、ケータイ向け動画の埋め込みコードをコピーできます。
QRコードを使用する場合は、画像②を保存してください。

※ケータイ向け動画の埋め込みコードを利用するには、ケータイ向け動画の変換が完了している必要があります。詳しくは「ケータイ向けコンテンツ登録」をご参照ください。

YouTube URL

［YouTube］タブをクリックすると、YouTube上にアップロードされた動画のURLを確認できます。
［クリップボードにコピー］をクリックすると、YouTube上の動画のURLをコピーできます。

Facebook埋め込みコード（OGP）

［Facebook］タブをクリックすると、Facebookの埋め込みコード(OGP)を確認できます。
［クリップボードにコピー］をクリックすると、埋め込みコード(OGP)をコピーできます。

Facebookのウォールに投稿する予定のWebページのHTMLファイルに、取得した埋め込みコード（OGP）を以下のように<head></head>の間に追記します。

<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8" />
<title>Test</title>

<!-- 以下サンプル -->
<meta property="og:video" content="https://*.cloudfront.net/001/eviry/swf/videoplayer.swf?mode=ogp&amp;apibase=https://cc.miovp.com &amp;embedkey=xxxxxxxxxxx">
<meta property="og:video:secure_url" content="https://cc.miovp.com/ /001/eviry/swf/videoplayer.swf?mode=ogp&amp;apibase=https://cc.miovp.com &amp;embedkey=xxxxxxxxxxx">
<meta property="og:video:type" content="application/x-shockwave-flash">
<meta property="og:video:width" content="320">
<meta property="og:video:height" content="240">
<meta property="og:image" content="https://cc.miovp.com/ fbimage/xxxxxxxxx ">
<meta property="og:image:secure_url" content="https://cc.miovp.com/ fbimage/xxxxxxxx">
<meta property="og:title" content="サンプル動画2">
<meta property="og:description" content="サンプル動画2です。">
<!-- サンプルここまで -->
</head>
</html>

※サンプルコードの埋め込みコードは動作しません。管理画面「コンテンツ」のコンテンツ詳細より取得した埋め込みコードを編集しご利用ください。

設定したWebページのURLをFacebookのウォール上に貼り付けし投稿することで閲覧可能となります。

Facebookウォール上には、サムネイル画像①、タイトル②、リンク先URL③、説明文④が表示されます。
※Facebookの仕様上、PCのみウォール上でインライン再生が可能となり、その他の端末はWebページへ遷移します。
※アノテーション・字幕機能には対応しておりません。

プレイリスト向け

管理画面の［埋め込みコード］①画面を開き、埋め込みたいプレイリストが設定されている埋め込みコード②を選択します。
「再生位置」③でプレイリスト内で再生を開始したい動画を選択します。指定した動画から順に再生が始まります。
※プレイリストの先頭から再生する場合は設定不要です。
「埋め込みコード（PC/スマホ用）」「HTML」「iframe」タブ④から、生成したい埋め込みコードの種類を選択します。
［クリップボードにコピー］⑤をクリックすると、設定した開始位置埋め込みコード⑯をコピーできます。
［プレビュー］⑥をクリックすると、プレイヤーのプレビューが確認できます。

Webサイトへ公開

scriptタグやiframeタグを使用する場合は、発行した埋め込みコードをHTMLファイルのBODY内に挿入し、ページを公開すると完成です！

Webサイトへの公開手順はクイックスタートガイド[Step4. Webサイトへ公開する]をご確認ください。

目次