WordPress youtube videolarını responsive yapma

WordPress youtube videolarını responsive bir hale getirmek sitenizi mobil araçlardan ziyaret eden kullanıcılarınıza farklı bir deneyim sunacaktır. Günümüzde gelişen teknoloji ile birlikte kullanıcıların hizmetine birçok yeni özellik sunuluyor. Web site ve blog sahipleri ziyaretçi kazanmak için yeni çıkan teknolojiye ayak uydurmak zorundadırlar.

WordPress’e eklediğiniz youtube videoları artık mobil uyumlu olacak

WordPress altyapısına sahip bir blogunuza veya web sitesinize youtube’den video ekleyince mobil cihazlarda kayma sorunu yaşıyorsanız bu içeriğimizde bu sorundan tamamen kurtulabilirsiniz. Üstelik yapacağınız kodlama ile birlikte her eklediğiniz youtube videosu otomatik olarak responsive yani mobil uyumlu hale gelecektir.

WordPress youtube videolarının responsive olması neden önemlidir?

Youtube dünyada en çok ziyaret edilen video sitelerinden bir tanesidir. Burada bulunan videoları yazılarınıza eklemek isteyebilirsiniz. Eklediğiniz videoların tüm cihazlara uyumlu olması hem arama motorları tarafından hemde kullanıcı dostu olmasından dolayı oldukça elzemdir. Kullandığınız wordpress temasında video embed kodları responsive olarak ayarlanmamışsa aşağıda ki uygulamaları yaparak sizlerde artık youtube videolarınızı mobil uyumlu hale sokmuş olacaksınız.

İlgili Haber

Wordpress İlgili Haber Özelliği [Üstelik Eklentisiz]

Style.css dosyanızı açın

Hostunuza ftp programı ile bağlanın. Ardından temanızın bulunduğu konuma gelin ve temanızın içerisindeki style.css dosyanızı notepad++ gibi bir programla açın. Daha sonra aşağıdaki kodları style.css dosyanızın en altına olduğu gibi ekleyin.

.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%;
}

Functions.php dosyasınızı açın

Yine aynı şekilde temanızın olduğu klasör içerisinde bulunan functions.php dosyasını notepad++ tarzı bir programla açın. Ardından aşağıdaki kodları functions.php dosyasının en alt kısmına yapıştırın.

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

Youtube videolarınız artık mobil uyumlu oldu

Bu işlemleri gerçekleştirdikten sonra artık wordpress sitenizde yazılarınıza youtube videosu eklediğinizde, videolarınız otomatik olarak responsive bir hal almış olacaktır. Artık wordpress youtube işbirliği içerisinde daha verimli konular hazırlayabileceksiniz. Yapılan bu işlem her temaya uygunluk sağlar. Gönül rahatlığıyla kullanabilirsiniz. Yapamadığınız, takıldığınız bir nokta olduğunda yorum alanından iletişime geçebilirsiniz.