Làm thế nào để nhúng mã trình phát video HTML5 DRM vào Wordpress cho Xvast?

Làm thế nào để nhúng mã trình phát video HTML5 DRM vào Wordpress cho Xvast?

Để nhúng trình phát video DRM HTML5 của Xvast vào Wordpress, bạn chỉ cần thêm một vài đoạn mã.

Nếu bạn không cần chỉnh sửa quá nhiều trình phát, vui lòng sử dụng đoạn mã bên dưới để nhúng video.

Trình phát VideoJS:

<div id="Xvast_Video_URL" style="display: none;">https://www.drm-x.com/download/drmx4/Way_Maker_720P_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>

Trình phát tiêu chuẩn HTML5:

<div id="Xvast_Video_URL" style="display: none;">https://www.drm-x.com/download/drmx4/Way_Maker_720P_P.mp4</div>
<script type="text/javascript" src="https://www.xvast.com/dist/js/embedHTML5VideoPlayer.js"></script>
<div id="xvast_contain" style="width: 100%; max-width: 1080px;">
    <div id="xvast_ios_media_url" style="display: none;">https://www.drm-x.com/download/drmx4/Way_Maker_720P_P.mp4</div>
    <video width="100%" controls="controls" id="xvast_player_html5_api">
        <source src="https://www.drm-x.com/download/drmx4/Way_Maker_720P_P.mp4" type="video/mp4">
    </video>
</div>
<script type="text/javascript" src="https://www.xvast.com/dist/wordpress/XvastVideoJSPlayer.js"></script>

Nếu bạn cần chỉnh sửa trình phát, vui lòng tham khảo phần giới thiệu sau đây.

Ghi chú: Đối với iOS, vui lòng thêm một thẻ div với id là xvast_ios_media_url, ẩn thẻ div đó đi, viết URL video vào trong thẻ div, Xvast sẽ tự động nhận diện thẻ và hỏi người dùng có muốn phát video này hay không. Ví dụ:

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

Ghi chú về URL phương tiện của phiên bản Xvast mới nhất dành cho iOS:

Nếu bạn muốn khách hàng của mình xem video trên iOS, liên kết tải xuống phải có các đặc điểm sau, bắt đầu bằng _P. Ví dụ: liên kết chứa _P.mp4, _P.mp3 hoặc _P.pdf (không phân biệt chữ hoa chữ thường). Hoặc chứa xvast. Bạn có thể thêm một trong những đặc điểm này vào bất kỳ vị trí nào trên liên kết tải xuống, sau đó Xvast dành cho iOS sẽ nhận diện và hỗ trợ tải xuống.

Vui lòng thêm bài viết hoặc trang vào Bảng điều khiển của trang web, chuyển chế độ chỉnh sửa sang "Văn bản" trong trình soạn thảo, sao chép mã vào trình soạn thảo và nhấp vào nút Xuất bản. Bạn có thể chỉnh sửa mã CSS theo nhu cầu của mình (XvastPlay.css).

1. Video-js.css/video.js là tệp thư viện VideoJS. XvastPlayer.css là tệp kiểu bổ sung cho trình phát video HTML5. 2. Thêm nút trình phát. Nếu người dùng chưa có giấy phép, nút trình phát sẽ được hiển thị. Khi người dùng nhấp vào nút đó, sự kiện JavaScript "jump" sẽ được thực thi để chuyển đến trang lấy giấy phép. Bạn có thể chỉnh sửa tệp XvastPlayer.css theo nhu cầu của mình. 3. Phần này là URL video để xem trực tuyến hoặc tải xuống để xem trên iOS. 4. Phần này là mã trình phát HTML5 (VideoJS), sử dụng JavaScript để phát hiện xem trình duyệt của người dùng có phải là Xvast hay không. Nếu không, nó sẽ nhắc người dùng sử dụng Xvast để truy cập URL. 5. Phần này là các nút điều khiển của người chơi, thông qua mã JavaScript để điều khiển tua nhanh, tua chậm, phát, tạm dừng và phát lại của người chơi. (Bạn có thể sử dụng chúng nếu cần) 6. Mã liên quan đến việc phát hiện giấy phép người chơi trực tuyến Xvast.

Tải xuống mã mẫu: www.xvast.com/XvastPlayer/Xvast-demo.html (Bạn có thể tải xuống và đặt các tệp JS và CSS trên máy chủ của riêng mình)

<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>