Blogger Responsive Video Ekleme

Merhaba arkadaşlar bu makalemizde blogger ve diğer siteler için responsive video ekleme yani mobil uyumlu vede otomatik boyutlandırılan video nasıl eklenir bundan bahsedeceğiz, Aşağıda sizlerle paylaşacağımız kodlar sayesinde hiç uğraşmadan eklediğiniz videoları direkt olarak mobil uyumlu hale getirebileceksiniz.

Şarkı sözleri sitesi olarak hizmet vermekte olan sitemiz blogarsi.com'ta da kullanmakta olduğumuz bu kodlar ile videolarımız responsive hale gelmektedir, bu kodlar ile youtube, izlesene, vidivodo ve bildiğiniz diğer tüm video sitelerindeki iframe kodlarını ekleyebilir vede videoların responsive hale gelmesini sağlıyabilirsiniz, Önizleme olarak sitemizi test edebilirsiniz.

Blogger Responsive Video Ekleme Anlatım;

Daha iyi vede öğrenmekte zorlanmamanız için resimli olarak anlatmaya çalıştım umarım faydalı olur, Resimlerin üzerine tıklayarak büyütebilirsiniz, Şimdi konumuza geçelim öncelikle kodları eklemek için blogger.com'a giriş yapınız daha sonra sol menüden tema bölümüne giriniz, açılan sayfada yer alan htmlyi düzenle butonunun hemen yanında yer alan özelleştir butonuna tıklayınız.

Özelleştir butonuna tıkladıktan sonra editör olarak temanızı çok rahat bir şekilde düzenleyebilmeniz için bazı işlemlerin yer aldığı şablon tasarımcısı bölümü açılacaktır.Açılan bölümden ilk sol menüde yer alan Gelişmiş seçeneğine tıklayarak açılan kısımdan Css ekle seçeneğine aşağıdaki görselin hemen altında yer alan CSS kodunu ekleyiniz.

Temaya Eklenmesi Gereken CSS Kodu;

.responsive-youtube {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; height: 0; overflow: hidden;
}
 
.responsive-youtube iframe,
.responsive-youtube object,
.responsive-youtube embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

Üst kısımda yer alan kodu resimde gördüğünüz alana ekledikten sonra sağ üst köşede yer alan Bloga Uygula butonuna tıklayınız bu işlemin ardından alt kısımda yer alan kodun video iframe kodu buraya yazan yere youtubeden yada diğer video sitelerinden aldığınız iframe kodunu eklemeniz yeterli olacaktır.

<div class="responsive-youtube">Video İframe Kodu Buraya</div>

Yapacağınz işlem bu kadar basit arkadaşlar, Temanızı bozmamak için diğer anlatım şekillerini yaparak html kodları üzerinde düzenleme yapmanıza gerek yoktur bu işlem sizler için en kolay ve en basit yoldur.Blogger responsive video ekleme hakkında kafanıza takılan sorunlarvarsa alt kısımdaki yorum alanına yazabilirsiniz.