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
Monday, April 18, 2016



Recent Posts widget bài viết mới nhất có ảnh cho Blogspot
Thiết kế đơn giản như hình vẽ bên trên mà mình đã làm tại Blog. Tất cả yêu cầu hiển thị bao gồm 1 ảnh Thumbnail, title bài viết và vài hàng trích dẫn đầu bài. 
Thực hiện gồm các bước như sau:
  1. Vào Blogger>>Layout.
  2. Mỡ tiện ích Widget, chọn HTML/JavaScript
  3. Chép Source Code bên dưới vào khung soạn thảo Code:
<style type="text/css">
img.recent_thumb {padding:1px;width:60px;height:60px;border:0;
float:left;margin-right:10px;border:1px solid #999;}
.recent_posts_with_thumbs {float:left;width: 100%;min-height: 70px;padding: 0;font-size:12px;}
ul.recent_posts_with_thumbs li {padding-bottom:5px;padding-top:5px;min-height:65px;}
.recent_posts_with_thumbs a {text-decoration:none;}
.recent_posts_with_thumbs strong {font-size:10px;}</style>
<script src="https://sites.google.com/site/seovnpro/recent-post.js"></script>
<script>

var numposts = 5;
var showpostthumbnails = true;
var displaymore = false;
var displayseparator = true;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = true;
var numchars = 100;</script>
<script src="/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showrecentpostswiththumbs"></script>
Kết thúc, Save lại Widget tiện ích và chạy thử ứng dụng vừa làm. Kết quả bạn sẽ có như hình đã code phía trên.
Một số chú giải khác:

Width, height: size cỡ cho ảnh Thumbnail.
numposts :Số lượng bài cho hiện ra.
displaymore : hiển hiện nút more để xem tiếp
showcommentnum: hiển hiện số lượng Comments cho mỗi bài đăng

Chúc các bạn thành công.

Tác giả: Minh Nguyên's Blog

0 comments:

Post a Comment

Popular Posts