Youtube Videoları WordPress Siteye Responsive Olarak Nasıl Eklenir

Youtube Videoları WordPress Siteye Responsive Olarak Nasıl Eklenir

tabanlı web sitenizde Videoları paylaşıyorsanız bu videoların genişliğini içerik bölümünüze göre ayarlamanız gerekir. Ancak farklı bir temaya geçtiğiniz zaman bu temanın içerik kısmı bir önceki temanızdan dar ise video sayfadan taşacaktır. Özellikle mobil sürüm temalarda yada Resposive temalarda telefon ile sayfaya girdiğinizde videosunun sayfadan taştığını göreceksiniz. Bu sorunu tek tek düzeltmeler yapmak yerine style sayfasına ve functions sayfasına ekleyeceğiniz kodlarla sitenize eklediğiniz tüm videolarını otomatik olarak responsive yani duyarlı hale getirebilirsiniz.

style.css Eklemeniz Gereken Kod

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

functions.php Eklemeniz Gereken Kod

function responsive_embed($content){
$content = str_replace('<iframe', '<div class="youtuberesponsive"><iframe', $content);
$content = str_replace('</iframe>', '</iframe></div>', $content);
return $content;
}
add_filter('the_content', 'responsive_embed');
add_filter('the_excerpt', 'responsive_embed');

Syle.css ve functions.php dosyalarını yukarıdaki şekilde düzenlediğiniz zaman artık youtube videolarını otomatik olarak boyutlandırılacaktır.

Facebook'ta Paylaş Whatsapp'ta Paylaş
Facebook'ta Paylaş Whatsapp'ta Paylaş
Yorumlar

Yorumunuzu Yazın

E-posta adresiniz yayınlanmayacaktır.


Son Yorumlar

  • serdar:Arkadaşlar burada nano teknolojisi hakkında bir ma...
  • admin:Buradakiler anasayfa için anlatılmış eklenti kulla...
  • murat:merhabalar hocam, her yazı eklediğimde mi bu işlem...
  • admin:Bu işlemi yaparsanız belleği formatlamış olrsunuz....
  • Baran Aydın:Abi burda yazan her şeyi yaptım ve usb de olan 29K...
  • Fərid:Nolur arka plan fotoğrafini deyiwmek istiyorum...
  • SAHRA pat:Hesabim kapatıldı yardımcı olun...
  • nedim:Peki bunun tam tersini yapan bir eklenti var mı? Y...
  • İlker Ergün:Müthiş çözüm ya. Kırk yıl düşünsem aklıma gelmezdi...