Report Abuse

Stats

Comment

Cara Paling Praktis Menciptakan Video Youtube Responsive Di Blogspot

Post a Comment
Cara Paling Gampang Membuat Video Youtube Responsive di Blogspot – Sebelumnya Admin telah memperlihatkan 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 instruksi 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, alasannya yaitu trik menciptakan video jadi responsive kali ini tidak memakai instruksi java script tapi murni hanya memakai instruksi CSS saja.

Cara Paling Gampang Membuat Video Youtube Responsive di Blogspot Cara Paling Gampang Membuat Video Youtube Responsive di Blogspot

Bagaimana apakah kalian tertarik, bila 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 dikala 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 pribadi 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 instruksi “]]></b:skin>” tanpa tanda kutip. 

Tips : Supaya lebih simpel menemukan instruksi “]]></b:skin>” dalam template blogspot kalian. Klik di sembarang daerah di dalam area instruksi kemudian tekan CTRL+F. Setelah itu akan muncul di pojok kanan atas kotak untuk memasukkan kata-kata yang ingin kalian cari. Pastekan instruksi tadi di kotak yang di sediakan kemudian ekan Enter. 

Setelah itu kalian akan melihat instruksi “]]></b:skin>” yang di beri warna kuning. Jika pada template blogger yang sobat pakai tidak ada instruksi ini, maka solusinya cari instruksi </style>.

Setelah kalian menemukan instruksi 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 jelas, silakan kawan-kawan lihat gambar di bawah ini.

Cara Paling Gampang Membuat Video Youtube Responsive di Blogspot Cara Paling Gampang Membuat Video Youtube Responsive di Blogspot

Keterangan :
No 1 : Tempat memasukkan instruksi pencarian
No 2 : Tempat meletakkan instruksi CSS youtube responsive.

Klik simpan template.

Selesai, mulai dikala itu juga semua jenis video yang sobat embed bakal menjadi responsif, untuk menunjukan kebenarannya. Kawan-kawan sanggup pribadi praktek, bila ada problem atau saran yang bersifat membangun, silakan masukkan pada kotak komentar di bawah ini.

Demikianlah warta terbaru yang sanggup Admin persembahkan untuk pengunjung setia blogtipsintrik.com mengenai “Cara Paling Gampang Membuat Video Youtube Responsive di Blogspot”, terima kasih biar bermanfaat.

Related Posts

Post a Comment