Kênh Tên Miền chuyên cung cấp tên miền đẹp, giá rẻ! Hãy liên hệ kỹ thuật: 0914205579 - Kinh doanh: 0912191357 để được tư vấn, hướng dẫn miễn phí, Cảm ơn quý khách đã ủng hộ trong thời gian qua!
kiem tien, kiem tien online, kiem tien truc tuyen, kiem tien tren mang
Friday, May 16, 2014


Hiện nay có khá nhiều template Blogger thiết kế dành riêng cho việc chia sẻ video, nhìn sơ trang bài viết nó giống như 1 video trên Youtube. Tức là chỉ có video mà không có bất cứ hình ảnh nào, tuy nhiên vì không có hình ảnh nên bài đó sẽ không có thumbnail theo như mặc định của Blogger.


1 dạng template dành riêng cho site Blogger về video

Hiện tại mình cũng có build 1 site Blogger chuyên về video như thế, bạn có thể xem demo ngay tại đây: http://video.baonet.org

Hôm nay mình xin chia sẻ 1 thủ thuật để bài viết chia sẻ video có thumbnail, cái này áp dụng cho việc chia sẻ video từ Youtube nhé!

Như các bạn cũng biết thì mỗi video youtube đều có kèm theo 1 hình thumbnail mặc định, ví dụ: http://i1.ytimg.com/vi/MAnOidLFt3w/0.jpg (trong link này bạn sẽ thấy có dòng ID của video, đó chính là sự khác biệt giữa các link ảnh thumbnail mặc định của mỗi video).

OK! Sau khi biết được cách lấy ảnh thumbnail của video Youtube rồi thì bạn chỉ việc chèn thêm thuộc tính hình ảnh vào iframe Youtube khi đăng trên Youtube, nó có dạng như sau:



<iframe width="690" height="388" src="dNiVB_d_z4k" frameborder="0" allowfullscreen></iframe><img border="0" height=" 0 " src="http://i1.ytimg.com/vi/dNiVB_d_z4k/0.jpg" width="0" />


dNiVB_d_z4k : Phần ID của video
- <img border="0" height="0" src="http://i2.ytimg.com/vi/dNiVB_d_z4k/0.jpg" width="0" /> Phần hiển thị ảnh mô tả của video chú ý thay ID theo đúng id của mỗi video để có thể hiển thị đúng ảnh

Youtube cung cấp cho bạn 4 hình thumbnail ảnh đại diện cho mỗi video từ 0 ==> 3. Bạn có thể thay 0.jpg thành 1.jpg, 2.jpg, 3.jpg để lấy các hình khác.



Ví dụ nhé!

Mỗi bài viết bạn chỉ cần áp dụng dòng code này, thay thế Link embed video YoutubeID video mà bạn muốn là bài viết đó sẽ có thumbnail. Rất đơn giản, chúc bạn thành công


0 comments:

Post a Comment

Popular Posts