Cara Memasukkan Dan Merubah Tampilan Video Youtube Di Blog

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

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

Dari sanalah timbul inspirasi untuk menciptakan tampilan video-video yang dipasang di blogger terlihat lebih kreatif dan pro. Tentunya saya juga sangat mempertimbangkan pengaruh kecepatan pemuatan laman semoga tidak kuat lelet dan tetap bersih.

Saya menciptakan dan menamai skin yang khusus untuk membalut video yang dipasang di posting blog dengan nama "Video Player Keren" atau VPK yang saya 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 menyerupai mirip tampilan tablet lengkap dengan kamera dibagian atasnya. Silahkan lihat demonya di bawah kemudian coba untuk memutar videonya.
Demo


Persiapan :

1) Salin semua aba-aba dibawah ini:
Klik ganda untuk menyalin
 /* Video Player Keren  /search?q=cara-terbaru-memasukkan-dan-memasang-video-youtube-keren-diblog */ .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 aba-aba ]]></b:skin> kemudian pastekan semua aba-aba 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 aba-aba iframe video yang di embed. Misal
Klik ganda untuk menyalin
 <div class="vpk">  iframe dibawah yakni 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!

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel