Tạo Recent Posts 3 cột với style thumbnail
Bước 1: Các bạn vào Bố cục→Thêm tiệc ích HTML→Thêm đoạn code sau:
<style type="text/css">
#vanvietblog-rc-3cot {width:350px;}
table#vanvietblog-rc-3cot {border:1px solid #ccc;}
#rc-3cot {padding:0 8px;width:30%;}
#rc-3cot p{padding:0;margin:0 0 5px 0;}
#rc-3cot img {margin:8px 0 2px; height:50px; width:50px; border:1px solid #ccc; padding:1px;}
#rc-3cot a:link {font:normal 12px arial;}
#vanvietblog-rc-3cot h2 {background:#098047;
padding:5px 0 14px 15px;
font:bold 15px Arial;
margin:0px;
color:#fff;
text-align: center;
}
</style>
<script type="text/javascript">
home_page = "http://vanvietblog.blogspot.com/";
label = "Blogger";
numposts = 9;
sumTitle = 24;
colortitle = "#333";
imgr = new Array();
imgr[0] = "URL_ảnh";
showRandomImg = true;
</script>
<div id="vanvietblog-rc-3cot">
<h2>Blogger</h2>
<script src="https://www.googledrive.com/host/0B1EJGJ56bNPuSVh3anQyOFhEU28" type="text/javascript"></script>
<p style="float:right;margin:0;padding:3px">Xem thêm về<a href="http://vanvietblog.blogspot.com/search/label/Blogger?&max-results=20"> Blogger»</a></p>
</div>
Lưu ý:
+ home_page = "http://vanvietblog.blogspot.com/"; Thay http://vanvietblog.blogspot.com/ thành URL Blog của bạn.
+ label = "Blogger"; Thay Blogger thành Label bạn muốn hiển thị
+ numposts = 9; số bài viết hiển thị
+ sumTitle = 24; Kí tự của tiêu đề bài viết
+ #vanvietblog-rc-3cot {width:350px;} thay 350px thành độ rộng mà bạn muốn, nhờ đó mà bạn có thể đặt widget này bất cứ nơi nào trên Blog của mình.
+ imgr[0] = "URL_ảnh"; Thêm Url ảnh mặc định đối với bài viết không có ảnh
+ Điều quan trọng: bạn hãy tải file này về up lên host riêng để sử dụng nhé!
"https://www.googledrive.com/host/0B1EJGJ56bNPuSVh3anQyOFhEU28"
+ <p style="float:right;margin:0;padding:3px">Xem thêm về<a href="http://vanvietblog.blogspot.com/search/label/Blogger?&max-results=20"> Blogger»</a></p> Ở đoạn này, bạn thay Blogger thành nhãn hiển thị của widget để người đọc có thể xem thêm các bài viết từ nhãn đó.
+ Các bạn có thể tùy chỉnh giao diện cho bắt mắt hơn nhé
Nguồn : Dongvietblog.com
No comments:
Post a Comment