Update, Cara Menampilkan Otomatis Thumbnail Video Youtube Di Related Posts Dan Pop Posts Blogger

Halo sobat blogger.
Seperti kita ketahui bahwa related post dan pop post menggunakan thumbnail Blogger. Dan thumbnail tersebut di ambil dari gambar pertama di postingan weblog yang diupload melalui editor postingan.

Jadi untuk menampilkan thumbnail video Youtube di related posts dan pop posts pada blogger / wordpress, kita bisa menggunakan dua cara

1. Dengan mengupload thumbnail video Youtube di postingan.

Untuk mendapatkan thumbnail video Youtube, bisa menggunakan URL berikut:
http://img.youtube.com/vi/VIDEO-ID/0.jpg atau
http://img.youtube.com/vi/VIDEO-ID/default.jpg – amount size thumb
http://img.youtube.com/vi/VIDEO-ID/mqdefault.jpg – medium default
http://img.youtube.com/vi/VIDEO-ID/maxresdefault.jpg – high resolution
http://img.youtube.com/vi/VIDEO-ID/1.jpg – small-scale thumb
http://img.youtube.com/vi/VIDEO-ID/2.jpg – small-scale thumb
http://img.youtube.com/vi/VIDEO-ID/3.jpg – small-scale thumb

VIDEO-ID Harus anda ganti dengan kode unik video dari youtube. misal URL Videonya
 https://www.youtube.com/watch?v=X22kKZ98oCY 

- Maka kode uniknya adalah X22kKZ98oCY
- Dan URL thumbnailnya menjadi http://img.youtube.com/vi/X22kKZ98oCY/0.jpg
http://img.youtube.com bisa diganti dengan brusk URL http://i.ytimg.com

2. Cara kedua lebih mudah. anda tinggal memasang kode html gambar (URL gambar ambil langsung dari URL video youtube ) dan jangan lupa bagian kode pengaturan size gambar, atur ke angka 0. Hal ini agar gambar hanya tampil sebagai thumbnail dan tidak akan tampil pada halaman posting.

Saya ambil contoh mencoba tampilkan gambar video youtube dengan alamat ini https://www.youtube.com/watch?v=X22kKZ98oCY
maka kode yang harus dipasang adalah seperti dibawah ini:

<div class="separator" style="clear: both; text-align: center;">

<img border="0" src="http://img.youtube.com/vi/X22kKZ98oCY/0.jpg" data-original-height="360" data-original-width="480" height="0" width="0" /></div>


<iframe width="560" height="315" src="https://www.youtube.com/embed/X22kKZ98oCY?rel=0" frameborder="0" allowfullscreen></iframe>
Kode gambar thumbnail diambil dari url id video youtube. Lihat yang saya kotak merah.

Hasilnya bisa anda lihat di postingan saya yang ada di https://xpeienceingame.blogspot.com/search?q=Contoh-Hasil-Thumbnail-Video-dari-Youtube-Di-Related-Post-dan-Recent-Blogger
Selamat mencoba.




Comments

Popular posts from this blog

Update, Cara Melamar Kerja Di Pt Kereta Api Indonesia Secara Online

Update, Jadwal, Syarat, Dan Cara Registrasi Ppdb Online Sma/Smk Negeri 2019 Di Provinsi Jawa Tengah Tahun Pelajaran 2019/2020

Update, Kurangi Materi Kimia, Ramuan Pelangsing Tradisional Buatan Sendiri Ini Sanggup Dicoba