ULIZAヘルプセンター

検索

モーダルプレイヤーを設定する

対象サービス

  • ULIZA Standard
  • ULIZA Pro
  • ULIZA FLEX Ⅱ
  • ULIZA LIVE FLEX Ⅱ
  • ULIZA EVENT STREAM

 

概要

モーダルプレイヤーは、モーダルウィンドウ内にプレイヤーを表示する機能です。

モーダルプレイヤーを設定したプレイヤータグを埋め込んだ場合、Webページにサムネイル画像が表示され、その画像をクリックするとポップアップ表示のように動画プレイヤーが浮かび上がり、動画コンテンツの視聴ができます。

プレイヤーのサンプルはこちら

例えば動画ギャラリーなど、一つのWebページに動画コンテンツを複数並べて表示させたい場合などに使うと便利な機能です。

 

手順

[手順1] 「コンテンツの管理」画面に遷移する

①ULIZAの管理画面から、「コンテンツの管理」をクリックします

②さらに「コンテンツの管理」をクリックします

__________2022-12-19_17.20.26.png

 

[手順2] 「プレイヤータグ発行」画面で設定を変更する

①動画コンテンツにマウスポインタをのせ、「プレイヤータグ発行」ボタンをクリックします

__________2022-12-22_15.54.24.png

 

②プレイヤータグの発行画面にて、「設定」をクリックします

__________2022-12-22_15.55.07.png

 

③「プレイヤータグタイプ」項目を「モーダル」に変更します

　※本設定画面内で、サムネイルの高さ・幅などの詳細な設定ができます

④「プレイヤータグの発行に戻る」をクリックします

__________2022-12-23_10.44.50.png

 

[手順３] プレイヤータグをサイトに埋め込む

①使用するプレイヤーIDを選択します

②「クリップボードにコピー」をクリックし、画面に表示されたプレイヤータグをコピーします

__________2022-12-22_17.27.51.png

 

③コピーしたプレイヤータグを貴社サイト内に埋め込み、Webページを公開します

<!DOCTYPE html>
<html>
<head>
  <title>Sample Page</title>
  <meta charset="UTF-8">
</head>
<body>

<!-- プレイヤータグ　-->
<script type="text/javascript" charset="utf-8" defer src="https://player-api.p.uliza.jp/v1/players/default-player/yoshimatsu/admin?type=modal&name=sample01">//{"modal":{"width":160,"height":90,"zIndex":500,"background":"default"},"videoAnalytics":{"userId":"[GAUSERID]"}}</script>

</body>
</html>

 

④公開されたWebページで動画が正常に視聴できるか確認します

__________2022-12-23_10.57.27.png