Site Arka Planın'da YouTube Videolari Oynatın | Teknoloji Paylaşım Portalı

Site Arka Planın’da YouTube Videolari Oynatın

Savaş Dersim Çelik | Çarşamba Mayıs 27th, 2015 | Yorum Yok | 2.251 Görüntülenme | 0 Like

Merhaba arkadaşlar bu konumuzda websitenizin arkaplanında resim değilde youtubede ki herhangi bir video görüntüleme işlemi yapacağız. Yani arkaplanda resim yerine video olacak.

Tabi bunun avantajlarıda dezavantajlarıda olacaktır. Dezavantajı nedir diye sorcak olursanız her kullanıcı siteye girdiğinde youtubedeki o videoyu yüklemesi gerekmekte yani izlemesi gerekecek arka tarafta video açılacak mecburi olarak indirmiş ve izlemiş olacaktır.

Bunu avantaja çevirmeninde yolları var ki buda bu sistemi bir reklam modülü olarak kullanabilirsiniz ve sitenize bir gelir kaynağı olur.

Kodumuz çok basit ve kullanımı çok kolay.

Gerekli Kodumuz

<div style="position: fixed; z-index: -99; width: 100%; height: 100%">
  <iframe frameborder="0" height="100%" width="100%" 
    src="https://youtube.com/embed/qtVsVJ9V338?autoplay=1&controls=0&showinfo=0&autohide=1">
  </iframe>
</div>

Yukardaki kodu sitemizin <body> tagından hemen sonrasına ekliyoruz ve kayıt ediyoruz.

Videoların Sesini Otomatik Kısma Gerekli Kod

Aşağıdaki kodumuzu sitemizin <body> tagından hemen sonra ekliyoruz.

<script>
var tag = document.createElement('script');

        tag.src = "//www.youtube.com/iframe_api";
        var firstScriptTag = document.getElementsByTagName('script')[0];
        firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

        var player;

        function onYouTubeIframeAPIReady() {
            player = new YT.Player('ytplayer', {
                events: {
                    'onReady': onPlayerReady
                }
            });
        }

        function onPlayerReady() {
            player.playVideo();
            // Mute!
            player.mute();
        }
		</script>
<div style="position: fixed; z-index: -99; width: 100%; height: 100%">
  <iframe frameborder="0" height="100%" width="100%" id="ytplayer" type="text/html" src="https://www.youtube.com/embed/zJ7hUvU-d2Q?rel=0&enablejsapi=1&autoplay=1&controls=0&showinfo=0&loop=1&iv_load_policy=3" frameborder="0" allowfullscreen></iframe>
</div>

Etiketler