Code widget bài viết mới nhất có ảnh thumnail cho Blogspot
Bên cạnh bài viết được xem nhiều thì bài viết mới nhất không thể thiếu cho một trang blog. Nếu bạn sử dụng mẫu template có cấu trúc bài viết dạng blog thì không cần thêm tiện ích này làm gì nhưng với mẫu template ví dụ như blog của mình dùng nhiều slide bên trái thì phần bên phải không thể nào thiếu được tiện ích này
Cách làm thì đơn giản thôi
- Đăng nhập Blogger.com
- Bên menu trái, chọn bố cục
- Ở khung sidebar chọn dấu + Thêm tiện ích chọn tiện ích HTML/Javascript
- Copy - paste code khung
Đây là đoạn code cần thêm
<div>
<style type="text/css">
img.recent_thumb {padding:1px;width:70px;height:70px;border:0;float:left;margin-right:10px;border:1px solid #d1d1d1;}
.recent_posts_with_thumbs {float:left; width:100%; margin:0; padding:0; font-size:13px; background:#fff;}
ul.recent_posts_with_thumbs li {padding-bottom:5px;padding-top:5px;min-height:65px; list-style-type:none; line-height:1.5em; border-bottom:1px dotted #d1d1d1;}
ul.recent_posts_with_thumbs li:last-child {border:none;}
.recent_posts_with_thumbs hr {display:none;}
.recent_posts_with_thumbs a {text-decoration:none; font-weight:bold;}
.recent_posts_with_thumbs i {font-style:normal; font-size:12px; }
.recent_posts_with_thumbs strong {font-size:10px;}</style>
<script src="https://googledrive.com/host/0B4v2llDGaFQyNnZrTXE4ZjFSQVU"></script>
<script>
var numposts = 9;
var showpostthumbnails = true;
var displaymore = false;
var displayseparator = true;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = true;
var numchars = 100;</script>
<script src="https://blogthuthuatwin10.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs"></script>
</div>
var numposts = 9 : số lượng bài muốn hiển thị
var showpostthumbnails = true;
var displaymore = false : hiển thị nút more
var displayseparator = true;
var showcommentnum = false : hiển thị comment
var showpostdate = false; hiển thị ngày tháng
var showpostsummary = true;
var numchars = 100; hiển thị đoạn mô tả ngắn gọn
- Nếu muốn hiển thị ghi true ngược lại ghi false
- Giá trị số có thể thay giá trị số khác
- Phần kích thước ảnh thumnail width:70px;height:70px bạn có thể tùy chỉnh tùy ý sao cho phù hợp
