Cara Pasang Video Youtube Full Responsive di Blog dengan Mudah

Selain dilengkapi dengan gambar di jaman sekarang ini ketika youtube mulai rame dengan banyaknya video tutorial, sangat kurang rasanya kalau postingan di blog cuman di lengkapi dengan gambar saja, karena video lebih bisa berbicara dengan jelas dari pada gambar.

selain itu menambahkan video pada postingan blog juga bisa mendongkrak seo karena menurut para blogger dengan hadirnya video di postingan kita, blog kita jadi semakin lengkap.

untuk memasang video youtube di postingan blog sangat mudah tinggal copy paste embed video youtube tersebut langsung bisa tampil di postingan blog kita, namun berdasarkan pengalaman kalau hanya sekedar copy paste saja video menjadi tidak responsive, dan sangat mengganggu ketika dilihat dengan menggunakan mobile.

Buat yang masih bingung berikut cara pasang video youtube di postingan blog.
1. Masuk ke video youtube yang mau di tambahkan ke postingan blog - klik share - Embed - dan copy kode embed tersebut di pstingan blog (menu HTML)


Untuk membuat video yang kita taruh dalam postingan menjadi responsive ada banyak sekali cara yang bisa di lakukan, tapi disini saya akan memberikan cara yang simple saja buat kalian, karena cara ini hanya menggunakan css responsive saja, berikut caranya :

1. Buka blog - Masuk ke Template dan Edit HTML - Tambahkan CSS di Bawah ini di atas kode
 ]]></b:skin>

/* CSS Only */
.post-body iframe{width:100%!important;}
@media screen and (max-width:960px){
.post-body iframe{max-height:90%}}
@media screen and (max-width:768px){
.post-body iframe{max-height:75%}}
@media screen and (max-width:600px){
.post-body iframe{max-height:60%}}
@media screen and (max-width:480px){
.post-body iframe{height:auto!important;max-height:auto!important}}

2. Simpan template dan bisa di cek buka blog agan dengan menggunakan hape.
Blogger
Disqus

5 komentar

Jadi untuk memasang video youtube agar responsive harus pakai kode css ya kang

Balas

Kalau pengalaman saya si awalnya tidak menggunakan kode css langsung pasang scrip link nya saja tapi hasilnya tidak full responsive yang menjadikan postingan berantakan dan tertutup sebelah kalau di buka menggunakan hape.. makanya saya cari tahu agar bisa responsive, dan algasil berrkat script tersebut tampilan video di mobile jadi responsive dan enak di pandang

Balas

Baru tau, aku terima kasih infonya

Balas

Terimakasih infonya, saya baru tau. Ya semoga video video di blogku bisa reponsife

Balas