March 30, 2018

Cara Menampilkan Gambar Thumbnail Video Youtube Otomatis di Homepage Blogger

March 30, 2018

Cara Menampilkan Gambar Thumbnail Video Youtube Otomatis di Homepage Blogger.

GAMBAR thumbnail video Youtube bisa ditampilkan otomatis di halaman depan blogger. Caranya dengan menambahkan kode gambar humbnail di bagian akhir kode tempel (embeded) Video Yotube.

Berikut ini contoh posting video youtube di blog dan memunculkan gambar thumbnail di halaman depan (auto readmore post) secara otomatis.

Gambar diambil dari default thumbnail image video youtube yang kita posting. Tidak upload gambar tambahan ke posting.



Ini kodenya:

<iframe allow="autoplay; encrypted-media" allowfullscreen="" frameborder="0" height="315" src="https://www.youtube.com/embed/mu1KSw28snI?rel=0" width="560"></iframe><img border="0" height="0" src="https://i2.ytimg.com/vi/mu1KSw28snI/0.jpg" width="0" />

Kode di atas terdiri dari dua bagian

1. Kode Tempel Video Youtube yang kita ambil dari kode tempel di Youtube.

<iframe allow="autoplay; encrypted-media" allowfullscreen="" frameborder="0" height="315" src="https://www.youtube.com/embed/mu1KSw28snI?rel=0" width="560"></iframe>

2. Kode Thumbnail Image Otomatis (Kode Tambahan)

<img border="0" height="0" src="https://i2.ytimg.com/vi/mu1KSw28snI/0.jpg" width="0" />

Kedua kode tersebut digabungkan:

<iframe allow="autoplay; encrypted-media" allowfullscreen="" frameborder="0" height="315" src="https://www.youtube.com/embed/mu1KSw28snI?rel=0" width="560"></iframe><img border="0" height="0" src="https://i2.ytimg.com/vi/mu1KSw28snI/0.jpg" width="0" />

Anda hanya perlu mengubah kode warna merah sesuai dengan kode ID Video Youtube yang ada di address bar atau di kode tempel video youtube.

Demikian Cara Menampilkan Gambar Thumbnail Video Youtube Otomatis di Homepage Blogger. Good Luck! (www.contohblog.com).*

Previous
« Prev Post
Author Image

CB Blogger

Recommended Posts

Related Posts

Show comments
Hide comments

No comments on Cara Menampilkan Gambar Thumbnail Video Youtube Otomatis di Homepage Blogger

Post a Comment

Contact Form

Name

Email *

Message *