كيفية تضمين كود مشغل فيديو HTML5 DRM في ووردبريس لـ Xvast؟

كيفية تضمين كود مشغل فيديو HTML5 DRM في ووردبريس لـ Xvast؟

لتضمين مشغل فيديو Xvast بتقنية إدارة الحقوق الرقمية HTML5 في ووردبريس، ما عليك سوى إضافة بعض التعليمات البرمجية.

إذا لم تكن بحاجة إلى تعديل المشغل بشكل كبير، فيرجى استخدام الكود أدناه لتضمين الفيديو.

مشغل 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>

مشغل 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>

إذا كنت بحاجة إلى تعديل المشغل، فيرجى الرجوع إلى المقدمة التالية.

ملحوظة: بالنسبة لنظام iOS، يُرجى إضافة عنصر div يحمل المعرّف xvast_ios_media_url، ثم إخفاء هذا العنصر، وكتابة رابط الفيديو داخله. سيتعرف Xvast تلقائيًا على الوسم، وسيسأل المستخدم عما إذا كان يرغب في تشغيل الفيديو. على سبيل المثال:

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

ملاحظات حول رابط الوسائط في أحدث إصدار من Xvast لنظام iOS:

إذا كنت ترغب في أن يتمكن عملاؤك من تشغيل مقاطع الفيديو الخاصة بك على نظام iOS، فيجب أن يتضمن الرابط الخصائص التالية، مع إضافة اللاحقة _P. على سبيل المثال، يجب أن يحتوي الرابط على _P.mp4 أو _P.mp3 أو _P.pdf، بغض النظر عن حالة الأحرف. أو يجب أن يحتوي على xvast. يمكنك تضمين إحدى هذه الخصائص في أي مكان في رابط التنزيل، وسيتعرف عليها Xvast لنظام iOS ويدعم التنزيلات.

يرجى إضافة منشور أو صفحة في لوحة تحكم موقعك الإلكتروني، ثم تغيير عرض التحرير إلى "نص" في المحرر، ونسخ الكود إلى المحرر، والنقر على زر "نشر". يمكنك تعديل كود CSS حسب احتياجاتك (XvastPlay.css).

1. ملف Video-js.css/video.js هو ملف مكتبة VideoJS. أما ملف XvastPlayer.css فهو ملف أنماط إضافي لمشغل فيديو HTML5. ٢. أضف زر تشغيل اللعبة. إذا لم يحصل المستخدم على ترخيص بعد، فسيظهر زر تشغيل اللعبة. عند النقر عليه، سيتم تنفيذ حدث JavaScript للانتقال إلى صفحة الترخيص. يمكنك تعديل ملف XvastPlayer.css حسب حاجتك. 3. هذا الجزء عبارة عن رابط فيديو للتشغيل عبر الإنترنت أو التنزيل للتشغيل في نظام iOS. 4. هذا الجزء هو كود مشغل HTML5 (VideoJS)، ويستخدم JS للكشف عما إذا كان متصفح المستخدم هو Xvast، وإذا لم يكن كذلك، فسيطلب من المستخدم استخدام Xvast للوصول إلى عنوان URL. ٥. هذا الجزء هو زر التحكم الخاص باللاعب، والذي يُستخدم عبر كود جافا سكريبت للتحكم في وظائف التقديم السريع، والترجيع، والتشغيل، والإيقاف المؤقت، وإعادة التشغيل. (يمكنك استخدامها إذا احتجت إليها). 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>