Cara Agar Video Youtube Responsive Di Blog

Bila ingin menambahkan video youtube di dalam artikel atau postingan agar tidak mempengaruhi nilai SEO pada blog yaitu video tersebut harus responsive, dan agar video menjadi responsive pada saat menambahkannya pada artikel ada caranya, yaitu dengan menambahkan kode di HTML Tema dan HTML Entri pada saat menambahkan video di dalam artikel. Pernah saya alami yang sebelumnya saya menambahkan video tutorial pada artikel dengan cara langsung alhasil video tersebut tidak responsive dan nilai SEO dan visitor blog saya menjadi menurun. Dan agar video youtube responsive di blog, cara dan langkahnya silahkan simak sebagai berikut.

Cara Agar Video Youtube Responsive Di Blog

Masuk ke dasbor Blogger kemudian menu Tema dan Edit HTML, selanjutnya copy dan pastekan kode di bawah ini sebelum kode ]]></b:skin> atau </style>

/* Youtube Responsive THOPADS */
.videoyoutube{
    text-align:center;
    margin:auto;
    width:100%;
}
.video-responsive{
    position:relative;
    padding-bottom:56.25%;
    height:0;
    overflow:hidden;
}
.video-responsive iframe{
    position:absolute;
    top:0;left:0;
    width:100%;
    height:100%;
    border:0
}

Berikutnya tambahkan kode di bawah ini juga sebelum kode </body>

<script type='text/javascript'>
//<![CDATA[
// Youtube Responsive THOPADS
setTimeout(function(){$(".video-youtube").each(function(){$(this).replaceWith('<iframe class="video-youtube loader" src="'+$(this).data("src")+'" allowfullscreen="allowfullscreen" height="281" width="500"></iframe>')})},5e3);
//]]>
</script>

Simpan Tema

Dan untuk menambahkan video youtube di dalam artikel atau postingan di blog yaitu dengan menggunakan kode di bawah ini

<div class="videoyoutube">
<div class="video-responsive">
<div class="video-youtube loader" data-src="COPY PASTE LINK EMBED VIDEO YOUTUBE">
</div>
</div>
</div>

Dengan cara copy LINK EMBED video youtube yang akan di tambahkan di dalam artikel atau postingan blog dan pastekan di dalam kode di atas.

Catatan:
Untuk LINK EMBED video yang di copy, tidak semua yang di copy tapi yang penting intinya saja sebagia contoh seperti gambar di atas sama persis

Bila sudah di terapkan langkah di atas tinggal Publikasikan atau Perbarui artikel atau postingan dan lihat hasilnya

Cukup sekian Cara Agar Video Youtube Responsive Di Blog semoga bermanfaat bagi para pembaca blog ini dan terimakasih,..