Cara Paling Gampang Membuat Video Youtube Responsive di Blogspot – Sebelumnya Admin telah menunjukkan banyak tutorial yang berkaitan dengan youtube. Seperti membuat tampilan youtube keren abis , youtube berputar otomatis , teknik embed youtube , dan bagaimana cara mengakibatkan video youtube jadi full responsive dengan memakai aba-aba java script.
Walaupun pembahasan ini sedikit banyak mempunyai kesamaan dengan tutorial menciptakan tampilan embed video youtube responsive sebelumnya , tapi cara yang bakal Admin bagikan kali ini jauh lebih simpel untuk di terapkan dan simpel untuk di praktekkan. Serta sangat ringan untuk di pasang pada blog kesayangan agan aganwati sekalian , lantaran trik menciptakan video jadi responsive kali ini tidak memakai aba-aba java script tapi murni hanya memakai aba-aba CSS saja.
Bagaimana apakah kalian tertarik , jikalau kalian ingin tau menyerupai apa tampilan video youtube yang di embed dengan memakai trik ini. Teman-teman ngak usah jauh-jauh atau galau melihat blog demonya. Karena blog yang sedang kalian kunjungi ketika ini juga memakai cara ini.
Masih tidak percaya kalau dengan memakai teknik ini video apapun yang sobat embed sanggup menjadi full responsive dan sanggup secara otomatis menyesuaikan lebar alat yang di gunakan untuk mengaksesnya. Silakan kalain cek salah satu postingan kami yang di dalamnya ada video yang di sematkan , salah satunya Cara Terbaru Membuat Akun Email Gmail Tanpa Verifikasi.
Jika kalian ingin mencoba , dan ingin membuktikannya secara eksklusif kalau dengan memakai cara ini semua jenis video yang sobat embed jadi responsive alias sanggup menyesuaikan lebar semua perangkat yang mengaksesnya secara otomatis , silakan ikuti langkah-langkah di bawah ini.
Tutorial Lengkap Cara Membuat Video Youtube Responsive di Blogspot Hanya Dengan Kode CSS
Pertama , silakan kawan-kawan login terlebih dahulu ke akun bloggernya masing-masing.
Pada halaman dashboard blogger , klik template (tema) >>> Edit HTML >>> Lalu cari aba-aba “]]></b:skin>” tanpa tanda kutip.
Tips : Supaya lebih simpel menemukan aba-aba “]]></b:skin>” dalam template blogspot kalian. Klik di sembarang daerah di dalam area aba-aba kemudian tekan CTRL+F. Setelah itu akan muncul di pojok kanan atas kotak untuk memasukkan kata-kata yang ingin kalian cari. Pastekan aba-aba tadi di kotak yang di sediakan kemudian ekan Enter.
Setelah itu kalian akan melihat aba-aba “]]></b:skin>” yang di beri warna kuning. Jika pada template blogger yang sobat pakai tidak ada aba-aba ini , maka solusinya cari aba-aba </style>.
Setelah kalian menemukan aba-aba tersebut , copy pastekan script CSS di bawah ini sempurna di atasnya.
/* 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}}
Supaya lebih terperinci , silakan kawan-kawan lihat gambar di bawah ini.
Keterangan :
No 1 : Tempat memasukkan aba-aba pencarian
No 2 : Tempat meletakkan aba-aba CSS youtube responsive.
Klik simpan template.
Selesai , mulai ketika itu juga semua jenis video yang sobat embed bakal menjadi responsif , untuk mengambarkan kebenarannya. Kawan-kawan sanggup eksklusif praktek , jikalau ada problem atau saran yang bersifat membangun , silakan masukkan pada kotak komentar di bawah ini.
Demikianlah isu terbaru yang sanggup Admin persembahkan untuk pengunjung setia blogtipsintrik.com mengenai “Cara Paling Gampang Membuat Video Youtube Responsive di Blogspot” , terima kasih agar bermanfaat.
Post a Comment
Post a Comment