Inilah Cara Memasukkan Dan Merubah Tampilan Video Youtube Di Blog

Posted on
Bagi blog anda yang berkategori hiburan niscaya sangat kerap memasukkan atau embed video dari YouTube ke dalam postingan blog dengan bermacam macam tujuan dan memang sangat gampang untuk melakukannya dan admin menyakini bahwa anda sudah sangat kerap melakukannya. Pertanyaanya apakah anda sudah puas dengan tampilan yang standard tersebut?

 Bagi blog anda yang berkategori hiburan niscaya sangat kerap memasukkan atau embed video d Cara Memasukkan dan Merubah Tampilan Video YouTube Di Blog

Dari sanalah timbul pandangan gres untuk membuat tampilan video-video yang dipasang di blogger terlihat lebih kreatif dan pro. Tentunya admin juga sangat mempertimbangkan pengaruh kecepatan pemuatan laman semoga tak besar lengan berkuasa lelet dan tetap bersih.

Saya membuat dan menamai skin yang khusus untuk membalut video yang dipasang di posting blog dengan nama “Video Player Keren” atau VPK yang admin buat untuk pengguna google blogger dengan memakai murni CSS3 yang higienis dan valid. Cara kerja dari VPK ini akan menampilkan video yang anda embed memakai iframe dengan skin yang ibarat mirip tampilan tablet kompleks dengan kamera dibagian atasnya. Silahkan lihat demonya di bawah kemudian coba untuk memutar videonya.

Demo


Persiapan :


1) Salin semua arahan dibawah ini:

Klik ganda untuk menyalin

 /* Video Player Keren   */ .vpk{background:#d3d3cc;border:3px solid #c5cbcc;border-radius:2.5em 2.5em 1em 1em;font-family:'Arial';color:white;font-size:12px;margin-bottom:.5em;padding:1.2em 1em 1em;text-align:justify}.vpk iframe{width:100%}.vpk object{width:100%}.vpk embed{position:absolute;top:0;left:0;width:100%;height:100%}.vpk:before{background:#6d6d66;border:1px #ebf6ff;border-radius:50%;content:"";display:inline-block;position:relative;padding:1em;z-index:1;float:right;margin-right:50%;margin-bottom:5px}.vpk:after{background:#6d6d66;border:2px #ebf6ff;border-radius:0 0 1em 1em;content:"Video Player Keren (VPK)";display:block;position:relative;padding:1em} 

2) Masuk ke Blogger kemudian klik Template

3) Lakukan Back Up kemudian klik Edit HTML

4) Cari arahan ]]></b:skin> kemudian pastekan semua arahan tersebut sempurna diatasnya.


Langkah-langkah (penerapan) :


1) Masuk ke Blogger kemudian klik New Post

2) Klik Mode HTML (disamping mode Compose)

3) Cari video yang ingin anda embed dalam format iframe

4) Tempatkan Tag section dibawah ini pada mode HTML diantara arahan iframe video yang di embed. Misal

Klik ganda untuk menyalin

 <div class="vpk">  iframe dibawah merupakan video yang ingin ditampilkan memakai VPK.  <iframe allowfullscreen="" frameborder="0" height="315" src="//www.youtube.com/embed/ID VIDEO EMBED ANDA" width="420"></iframe>  </div> 

5) Klik Pratinjau kemudian Publikasikan

Sekarang tampilan gres dari video youtube yang dipasang di posting blog akan terlihat lebih bergaya, anda hanya perlu menambahkan tag pada langkah no 4 sebagai cara untuk memakai VPK pada semua video diposting blog. Semoga bermanfaat, Enjoy & Happy Coding!


Sumber blog Hi Riad's/

Baca Juga:  Inilah 10 Microphone Terbaik Untuk Video Youtube (🔥Updated)