Para incorporar o player de vídeo HTML5 DRM do Xvast no Wordpress, você só precisa adicionar algum código.
Se você não precisar modificar profundamente o player, use o código abaixo para incorporar o vídeo.
<div id="Xvast_Video_URL" style="display: none;">https://www.drm-x.com/download/DRMX4/JesusFilm_cn_P.mp4</div>
<script type="text/javascript" src="https://www.xvast.com/pt/dist/js/embedPlayer.js"></script>
<script type="text/javascript" src="https://www.xvast.com/pt/dist/js/video.js"></script>
<script type="text/javascript" src="https://www.xvast.com/pt/dist/wordpress/XvastVideoJSPlayer.js"></script>
Se você precisar modificar o player, consulte a introdução a seguir.
Observação: Para iOS, adicione um div com o valor de id de xvast_ios_media_url, oculte o div, escreva o URL do vídeo no div, o Xvast reconhecerá automaticamente a tag e solicitará ao usuário se deseja reproduzir este vídeo. tal como:
<div id="xvast_ios_media_url" style="display: none;">https://www.drm-x.com/download/drmx4/JesusFilm_cn_P.mp4</div>
A versão mais recente do URL de mídia do Xvast para iOS observa:
Se você deseja que seus clientes reproduzam seus vídeos no iOS, você deve ter as seguintes características no link, com _P. Por exemplo, o link contém _P.mp4, _P.mp3 ou _P.pdf, que não diferencia maiúsculas de minúsculas. Ou contém xvast. Você pode incluir uma dessas características em qualquer local no link de download, então o Xvast para iOS reconhece e suporta downloads.
Adicione um post ou uma página no Painel de Controle do seu site, mude a visualização de edição para "Texto" no editor, copie o código para o editor e clique no botão Publicar. Você pode modificar o código CSS de acordo com suas necessidades (XvastPlay.css).
1. Video-js.css/video.js é o arquivo de biblioteca VideoJS. XvastPlayer.css é o arquivo de estilo adicional do player de vídeo HTML5.
2. Adicione o botão do jogador. Se o seu usuário ainda não obteve uma licença, o botão do player será exibido. Quando o usuário clicar nele, ele executará o salto do evento JS para obter a página de licença. Você pode modificar o XvastPlayer.css de acordo com sua necessidade.
3. Esta parte é um URL de vídeo para jogar online ou jogar por download no iOS.
4. Esta parte é o código do player HTML5 (VideoJS), use JS para detectar se o navegador do usuário é Xvast, caso contrário, ele solicitará que o usuário use o Xvast para acessar a URL.
5. Esta parte é o botão de controle do jogador, através do código JS para controlar o avanço rápido, retrocesso, reprodução, pausa e re-play do jogador. (Você pode usá-los se precisar)
6. Código relacionado à detecção de licença do jogador online Xvast.
Baixe o código de exemplo:www.xvast.com/XvastPlayer/Xvast-demo.html
(Os arquivos JS e CSS podem ser baixados e colocados em seu próprio servidor)
<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">
Aguarde, conectando-se para obter a página de licença...
</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">Obter licença...</button>
</div>
<p><a href="https://www.drm-x.com/download/drmx4/JesusFilm_en_P.mp4">Reproduza MP4 online no iOS</a></p>
<script type="text/javascript">
if(navigator.userAgent.indexOf("Xvast") == -1){
document.write("Por favor, abra os arquivos protegidos no navegador Xvast. Baixe o 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>