Cara Mudah Membuat Video Yang Responsive Atau Responsive Embed Dengan Bootstrap

Untuk sobat yang suka upload video ke blog tentu ingin video yang sobat upload responsive, dalam kesempatan kali ini saya akan membagikan tutorial membuat video yang responsive dengan bootstrap. Tentunya sobat harus sudah memasang bootstrap ulu di template blog sobat. Buat yang belum pasang bootstrap pada templatenya sobat bisa lihat artikel tentang Cara Memasang Bootstrap Pada Blog .

Dengan bootstrap sobat tidak perlu repot-repot edit template sobat, karena bootstrap memungkinkan browser untuk menentukan video atau slideshow dimensi berdasarkan lebar blok,dengan menciptakan rasio intrinsik yang benar akan skala pada perangkat apapun. Jadi video sobat dapat mengikuti dalam bentuk layar apapun,misal laptop,tablet bahkan handphone.

Langsung saja sobat ikuti langkah-langkahnya

Masuk Blogger>Pos>HTML di sini sobat jangan pilih Compose pilih HTML sobat masukan kode di bawah ada 2 pilihan "16:9 aspect ratio" dan "4:3 aspect ratio"

<!-- 16:9 aspect ratio -->
<div class="embed-responsive embed-responsive-16by9">
  <iframe class="embed-responsive-item" src="..."></iframe>
</div>

<!-- 4:3 aspect ratio -->
<div class="embed-responsive embed-responsive-4by3">
  <iframe class="embed-responsive-item" src="..."></iframe>
</div>

Nah mudah bukan sobat tinggal memasukan kode tadi pada postingan sobat, jadi sobat tidak perlu edit CSS sobat lagi. Semoga artikelnya dapat membantu dan bermanfaat buat sobat. Terimakasih

Artikel Terkait 

• Cara Mudah Instal Bootstrap Pada Blog
• Cara Mudah Membuat Botton Dengan Bootstrap
• Cara Mudah Membuat Video Yang Responsive Dengan Bootstrap
• Cara Membuat Content Thimbnail Gambar Dengan Bootstrap
• Cara Mudah Membuat Table Responsive Dengan Efek Hover Dengan Bootstrap