Một dạng mới của Recent post xin được giới thiệu đến các bạn, không kém phần chuyên nghiệp. Thủ thuật blogger này không mới lạ, tạo sự khác biệt trong thiết kế website bạn.
>>2 Columns - Thủ thuật tạo 2 cột cho Main Blogger
>>Random Posts - Thủ thuật bài viết ngẫu nhiên cho Blogger Version 1
>>Emoticons - Thủ thuật chèn biểu tượng vào bình luận Blogger
>>Related Posts - Thủ thuật bài viết liên quan có hình ảnh ngang cho Blogger
>>Recent Post - Thủ thuật Recent post load từ trên xuống cho BLogger
>>Random Posts - Thủ thuật bài viết ngẫu nhiên cho Blogger Version 1
>>Emoticons - Thủ thuật chèn biểu tượng vào bình luận Blogger
>>Related Posts - Thủ thuật bài viết liên quan có hình ảnh ngang cho Blogger
>>Recent Post - Thủ thuật Recent post load từ trên xuống cho BLogger
2 - Vào Bố cục >>Thêm tiện ích >> HTML\JavaScript
<style type="text/css">
.wbox {background-color:#ffffff;width:auto;height:auto;}
.wbox.Cat {width:500px;height:auto;margin-bottom:5px;}
.wbox .tl {
background:url(http://quantrimang.com.vn/App_Themes/default/images/left_wbox_03.jpg) no-repeat left top;
padding-left:3px;
}
.wbox .tr {
background:url(http://quantrimang.com.vn/App_Themes/default/images/right_wbox_03.jpg) no-repeat right top;
padding-right:3px;
}
.wbox .tc {
background:url(http://quantrimang.com.vn/App_Themes/default/images/mid_wbox_03.jpg) repeat-x left top;
height:23px;
color:#246296;
font-size:12px;
text-transform:uppercase;
font-weight:bold;
padding-top:5px;
padding-left:7px;
}
.wbox .tc a {text-decoration:none;color:#246296;}
.wbox .ml {
background:url(http://quantrimang.com.vn/App_Themes/default/images/left_contannerbox.jpg) repeat-y left top;
padding-left:3px;
}
.wbox .mr
{
background:url(http://quantrimang.com.vn/App_Themes/default/images/right_contannerbox.jpg) repeat-y right top;
padding-right:3px;
}
.wbox .mc {background-color:#FFFFFF;}
.wbox .bl
{
background:url(http://quantrimang.com.vn/App_Themes/default/images/bottomLeft_wbox.jpg) no-repeat left top;
padding-left:3px;
height:5px;
}
.wbox .br
{
background:url(http://quantrimang.com.vn/App_Themes/default/images/bottomright_wbox.jpg) no-repeat right top;
height:5px;
padding-right:3px;
}
.wbox .bc
{
background:url(http://quantrimang.com.vn/App_Themes/default/images/bottomMiddle_wbox.jpg) repeat-x left top;
height:5px;
font-size:0;
line-height:5px;
}
.Tin_lienquan ul,.Tin_lienquan li {list-style:none}
.Title_article {
color:#246296;
font-size:12px;
font-weight:bold;
padding-top:10px;
padding-bottom:10px;
padding-left:5px;
}
.Title_article {text-decoration:none;color:#246296;}
.Title_article a {text-decoration:none;color:#303030;}
.Title_article a:hover {color:#990000; text-decoration:none;}
.imgModule {padding-left:5px;}
.imgModule img {width:120px; margin-right:5px;}
.imgModule a {text-decoration:none;}
.Tin_lienquan {
color:#797979;
font-size:11px;
padding-top:15px;
font-family:Tahoma;
padding-left:5px;
}
.Tin_lienquan a {text-decoration:none; color:#004784;}
.Tin_lienquan a:hover {text-decoration:none;color:#CC3300;}
</style>
<script type="text/javascript">
home_page = "http://www.thietkeblogger.net";
label = "Blogspot-tips";
numposts = 6;
list1 = 1;
sumPosts = 268;
mode = "label";
</script>
<div class="wbox Cat">
<!-- Header widget -->
<div class="tl"><div class="tr"><div class="tc"><a href="http://www.thietkeblogger.net/search/label/Blogspot-tips">Thủ thuật Blog</a></div></div></div>
<!-- END Header widget -->
<div class="ml">
<div class="mr">
<div class="mc">
<!-- noi dung cua tien ich -->
<script type="text/javascript" src="http://thietkewebplus.googlecode.com/files/rc-post-qmt.txt"></script>
<!-- END noi dung cua tien ich -->
</div>
</div>
</div>
<!-- Footer widget thietkeblogger.net-->
<div class="bl"><div class="br"><div class="bc"></div></div></div>
<!-- END footer widget thietkeblogger.net -->
</div>
Thay đoạn code in đậm cho phù hợp với website bạn.
- list1 : số bài viết có hiện ảnh thumbnail kèm trích dẫn
- mode :
- mode=”label” : áp dụng cho Label
- mode=”blog” : áp dụng cho cả Blog
Đăng nhận xét