Abaikan Jika Melihat Iklan Binary Options (Opsi Biner) pada Situs ini, Baca : Perbedaan Forex dengan Binary Options

Daftar Akun XM
image3

Cara agar Embed Video Youtube menjadi Responsive pada Blogger

Daftar Akun Exness

Hai Blogger! Berikut adalah Cara agar Embed Video Youtube menjadi Responsive, tampil dengan baik pada Tampilan Dekstop maupun Mobile


  • Buka Menu Themes, kemudian klik Edit HTML.
  • Tambahkan Kode ini sebelum Kode </b:skin>
  • Untuk memudahkan pencarian tekan Crtl dan F, ketik </b:skin> dan tekan Enter.

/* built2bless-responsive-youtube */
.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}

  • Kemudian Tambahkan Kode ini diatas Kode </body> :

<script type='text/javascript'>
//<![CDATA[
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>

  • dan Gunakan Kode ini untuk Menampilkan Video Youtube :

<!-- built2bless-responsive-youtube --><div class='videoyoutube'><div class='video-responsive'><div class='video-youtube loader' data-src='//www.youtube.com/embed/kode video youtube?rel=0'/></div></div>

  • Ganti Bagian Kode Video Youtube dengan bagian belakang pada URL / Link Video Youtube.
  • Contoh URL / Link Video Youtube adalah https://www.youtube.com/watch?v=DHj7ejbL9cg maka cukup Ganti Bagian Kode Video Youtube dengan DHj7ejbL9c
  • Kemudian klik Save Themes. dan klik View Blog untuk melihat Hasil, coba juga cek pada Tampilan Mobile.

Semoga Bermanfaat, Happy Blogging :)

KATEGORI KONTEN : Content Management System

BAGIKAN :

CONVERSATION

Daftar Akun XM