Xvast 用の Wordpress に HTML5 DRM ビデオ プレーヤー コードを埋め込む方法は?

Xvast 用の Wordpress に HTML5 DRM ビデオ プレーヤー コードを埋め込む方法は?

Xvast の HTML5 DRM ビデオ プレーヤーを Wordpress に埋め込むには、いくつかのコードを追加するだけです。

プレーヤーを大幅に変更する必要がない場合は、以下のコードを使用してビデオを埋め込んでください。

<div id="Xvast_Video_URL" style="display: none;none;">https://www.drm-x.com/download/DRMX4/JesusFilm_cn_P.mp4</div>
<script type="text/javascript" src="https://www.xvast.com/dist/js/embedPlayer.js"></script>
<script type="text/javascript" src="https://www.xvast.com/dist/js/video.js"></script>
<script type="text/javascript" src="https://www.xvast.com/dist/wordpress/XvastVideoJSPlayer.js"></script>

プレーヤーを変更する必要がある場合は、次の紹介を参照してください。

注記： iOS の場合は、id 値が xvast_ios_media_url の div を追加し、div を非表示にして、div にビデオの URL を記述します。Xvast はタグを自動的に認識し、ユーザーにこのビデオを再生するかどうかを尋ねます。例:

<div id="xvast_ios_media_url" style="display: none;">https://www.drm-x.com/download/drmx4/JesusFilm_cn_P.mp4</div>

iOS 向け Xvast の最新バージョンのメディア URL 注記:

iOSで動画を再生してもらいたい場合は、リンクに_Pを含む以下の文字を含める必要があります。例えば、リンクには_P.mp4、_P.mp3、または_P.pdf（大文字と小文字は区別されません）が含まれます。または、xvastが含まれます。ダウンロードリンクの任意の場所にこれらの文字のいずれかを含めることで、Xvast for iOSが認識し、ダウンロードをサポートします。

ウェブサイトのコントロールパネルに投稿またはページを追加し、エディターの編集ビューを「テキスト」に切り替えてコードをコピーし、「公開」ボタンをクリックしてください。CSSコードは必要に応じて変更可能です（XvastPlay.css）。

1. Video-js.css/video.js は VideoJS ライブラリファイルです。XvastPlayer.css は HTML5 ビデオプレーヤーの追加スタイルファイルです。 2. プレーヤーボタンを追加します。ユーザーがまだライセンスを取得していない場合は、プレーヤーボタンが表示されます。ユーザーがボタンをクリックすると、ライセンス取得ページへのJSイベントジャンプが実行されます。必要に応じてXvastPlayer.cssを変更できます。 3. この部分はiOSでのオンライン再生またはダウンロード再生用のビデオURLです。 4. この部分は HTML5 プレーヤー (VideoJS) コードであり、JS を使用してユーザーのブラウザーが Xvast かどうかを検出し、そうでない場合は、ユーザーに Xvast を使用して URL にアクセスするように促します。 5. この部分はプレーヤーのコントロールボタンです。JSコードを通して、プレーヤーの早送り、巻き戻し、再生、一時停止、再再生を制御します。（必要に応じて使用できます） 6. Xvastオンラインプレーヤーのライセンス検出関連コード。

サンプルコードをダウンロード: www.xvast.com/XvastPlayer/Xvast-demo.html （JSファイルとCSSファイルはダウンロードして自分のサーバーに置くことができます）

<link rel="stylesheet" type="text/css" href="https://www.xvast.com/XvastPlayer/css/video-js.css" />
<link rel="stylesheet" type="text/css" href="https://www.xvast.com/XvastPlayer/css/XvastPlay.css" />
<script src="https://www.xvast.com/XvastPlayer/js/video.js" type="text/javascript" charset="utf-8"></script>
<!--<link rel="stylesheet" type="text/css" href="https://www.xvast.com/XvastPlayer/css/skin/TechSkin-skin.css" />-->
<div id="LoadingText" style="display: none;" align="center">
	Please wait, connecting to obtain license page...'
</div>
<div align="center" style="margin-top: 10px">

    <div id="playerButton" style="display: none;">
        <button onclick="supportType(event,'video/ogg','theora, vorbis')" class="playerButton" type="button">Get License...</button>
    </div>
    
	<p><a href="https://www.drm-x.com/download/drmx4/JesusFilm_en_P.mp4">Play MP4 online in iOS</a></p>
    
  <script type="text/javascript">
        if(navigator.userAgent.indexOf("Xvast") == -1){
            document.write("Please open the protected files in Xvast browser. Download Xvast");
        }else{
            document.write(' <video id="xvast_player" controls="controls" src="https://www.drm-x.com/download/drmx4/JesusFilm_en_P.mp4" class="video-js" data-setup=\{ "autoplay":false, "playbackRates": [0.5, 0.7, 1, 1.5, 2, 3, 4], "width": 856, "height": 480 }\'>');
        }'
    </script>
    
</div>
<div id="buttonbar" align="center">
    <button id="restart" onclick="restart();">[]</button><button id="rew" onclick="skip(-5)"></button><button id="play" onclick="vidplay()"></button><button id="fastFwd" onclick="skip(5)"></button>
</div>
<script src="https://www.xvast.com/XvastPlayer/js/XvastPlay.js" type="text/javascript" charset="utf-8"></script>