Ana sayfa WEB VideoJS Player Kullanımı

VideoJS Player Kullanımı

7

Bu yazıda VideoJS player Kullanımına dair anlatımlar bulunmaktadır. Bir çok uzantıda video formatını mobil ve bilgisayar destekli olarak paylaşabilirsiniz.

VideoJS player, websitenizde video oynatabilmek için geliştirilmiştir. İsminden anlaşılacağı üzere js tabanlı bir kütüphanedir. Kolay kullanım ve açık kaynak kodlu oluşu sayesinde kendinize göre düzenleyebilirsiniz. Kontrol bar bölümünden ise tema yazabilirsiniz.

VideoJS Player Entegrasyonu

VideoJS bir çok uzantıyı desteklemektedir.
Videojs player websitenizde video oynatmak için kullanabileceğiniz güzel ve ücretsiz bir alternatif.

Öncelikle VideoJS kendi sitesinden ücretsiz olarak dosyaları indirelim. Alternatif olarak sizlere kendi düzenlemiş olduğum player dosyalarını konunun en alt bölümünde vereceğim. VideoJS ücretsiz olarak CDN hizmeti vermekte. CDN kodları ile kullanımı ise şu şekildedir:

<head>
<link href="https://vjs.zencdn.net/7.4.1/video-js.css" rel="stylesheet">
<script src="https://vjs.zencdn.net/ie8/ie8-version/videojs-ie8.min.js"></script>
</head>
<body>
<video id="my-video" class="video-js" controls preload="auto" width="640" height="264"
 poster="MY_VIDEO_POSTER.jpg" data-setup="{}">
 <source src="MY_VIDEO.mp4" type="video/mp4">
<source src="MY_VIDEO.webm" type="video/webm">
     <p class="vjs-no-js">
      To view this video please enable JavaScript, and consider upgrading to a web browser that
      <a href="https://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
    </p>
 </video>
  <script src="https://vjs.zencdn.net/7.4.1/video.js"></script>
</body>



 

CDN ile kullanım:

1- Kendimize player.html adında bir dosya oluşturup kodları içerisinde atalım.
2-  type='video/mp4'  bölümünü oynatmak istediğimiz video türüne göre değiştirelim.
3- “src” adresine video adresimizi yazalım.

İşlem bu kadar android , ios ve masaüstü cihazlarda hiç bir sorun olmadan rahatlıkla çalışmaktadır. HLS yayınlarını yani canlı stream kaynaklarınıda bu player ile gösterebilirsiniz. HLS yayın vermek istiyorsanız kodlar üzerinde yapacağınız tek değişiklik video type bölümünü type="application/x-mpegURL olarak belirleyin.

Ayrıca yayınlara alt yazı , kalite seçenekleri ekleyebilmeniz mümkün bunun için yardımcı dökümana göz atabilirsiniz. VideoJS eklentisi Xtream Codes ve diğer bir çok panel ile uyumlu olarak çalışmaktadır. Bu sayede VideoJS Player Kullanım işlemini tamamlamış olduk. Son olarak Jwplayer yada mediaElement gibi kütüphaneler yerine oldukça yaygın kullanılır.

Kendi özelleştirdiğim player kütüphanesini Buradan indirebilirsiniz.

7 Yorum

  1. Wmaracından geliyorum bu konuya inanın o kadar puling denedim ki bir türlü yapamadım çok teşekkür ediyorum tıkır tıkır çalışıyor

  2. plung buldum ama entegre edemiyorum. vaktiniz var ise ftp den mediaplayer.php den ayarlanması plung eklenmesi gerekiyor ekleyebilirmisiniz

  3. ovoo yazılımı kullanılıyorum cms .. player olarak video.js kullanıyor ama google reklam kodunu koyacağımyeri bulamadım yardımcı olabılırmısınız

    • Video.js için load eventini js ile kontrol eden küçük bir fonksiyon yazabilirsiniz. Örnek olarak video src kaynağını ilk load oluşunda boş getirip video alanına bir reklam divi eklersiniz. Reklam geç yaptıktan sonra veya reklam bittikten sonra js kodu ile videojs kaynağını güncelleyip görüntü gelmesini sağlayabilirsiniz. Ancak sizin reklam koyma işleminiz biraz daha detaylı olmasını istiyorsanız(video anında reklam çıkması gibi), videojs plugin kullanmanızı tavsiye ederim. Reklam plugin kullanımı için kaynağı ise şuradan bulabilirsin : videojs-contrib-ads

BİR CEVAP BIRAK

Lütfen bir yorum yazın!
Lütfen Adınızı Girin!