TRÌNH DIỄN BÀI ĐĂNG MỚI NHẤT

Có nhiều cách để các bạn giới thiệu đến mọi người các bài đăng mới nhất trên Blog của mình. Tôi xin chia sẻ đến với các bạn một trong những tiện ích giới thiệu bài đăng mới nhất được tự động trình diễn trông khá đẹp và tự động cập nhật khi bạn đăng bài mới

Mời bạn xem thử tiện ích phía dưới

Xem thử
Đầu tiên, bạn đăng nhập vào blog > chọn Thiết kế > chọn chỉnh sửa HTML, sau đó bấm đồng thời 2 phím Ctrl+F để mở hộp tìm kiếm và gõ vào dòng ]]></b:skin> 

Sau đó, dán đoạn code phía dưới vào trước dòng lệnh ]]></b:skin> sau đó bấm Lưu mẫu.

.mod{
background:#eee; /*màu nền của tiện ích*/
border:3px solid #6D7B8D; /*đường viền của tiện ích*/
margin-bottom:0px;
width:650px; /*độ rộng của tiện ích*/
padding:0px;}
.glv{height:330px; /*chiều cao của tiện ích*/
overflow:hidden;}
.bd{position:relative;padding:4px 4px 4px 6px;}
.gl2-ct .ct{margin-left:0px;position:relative;}

.vpv{padding:0px;width:316px; /*độ rộng cảu phần bên trái của tiện ích*/
display:none;
position:absolute;
color:#000;
border-right:1px solid #5C5858;
}
.gl-title a {color:#0000ff; /*màu text của tiêu đề bài viết bên trái*/
font-size:13px;
font-weight:bold;}
.gl-title a:hover {color:#ff0033;}
.glv .on{display:block;}
.vimg{width:305px; /*độ rộng của ảnh bên trái*/
height:200px; /*chiều cao của ảnh bên trái*/
border:1px solid #fff;padding:2px;}
.glv ul.vpv-ft li{
list-style-type:none;}
.vpv-ft{
width:40%; /*độ rộng phần bên phải*/
position:absolute;
top:0px;
right:0px;
margin-top:5px;
text-align:left;}
.vpv-ft a{
color:#000099; /*màu tiêu đề bên phải*/
font-size:11px;
font-family:arial;
text-decoration: none;}
.vpv-ft a:hover{color:#ff0033;}
.vpv-ft li{
list-style-type:none;
min-height:40px;
cursor:pointer;
border-bottom:1px solid #5C5858;
position:relative;
text-align:left;}

.vpv-ft li.last{
border-bottom:0;
padding-bottom:5px;}
.vpv-ft li.first{
border-top:1px solid #5C5858;
padding-bottom:5px;}
.vpv-ft li.on{
background:#AFC7C7;
}

.vpv-ft img{
float:left;
width:34px; /*độ rộng của ảnh bên phải*/
height:30px; /*chiều cao của ảnh bên phải*/
margin:3px 4px 0px 2px;
padding:0px;}
.vpv-ft a{font-family:verdana;}
.glv .vpv-ft .on .imgpointer{display:block;}
.glv .vpv-ft .imgpointer{
display:none;
height:14px;
width:6px;
position:absolute;
left:-10px;
top:7px;}

Sau khi lưu xong, bạn chọn thiết kế > Chọn thêm tiện ích > Thêm HTML/Javacrip rồi dán code phía dưới vào

<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://sites.google.com/site/fdblogsite/Home/nothumbnail.gif";

showRandomImg = false;

fntsize = 12;
acolor = "";
aBold = false;


text = "comments";
showPostDate = true;

summaryPost = 150; //số ký tự hiển thị của bài viết tóm tắt bên trái
summaryFontsize = 12;
summaryColor = "";

numposts =6;
label = "Advanced blogger"; /*nhãn bài viết*/
home_page = "http://dunghennessy.blogspot.com/"; /*thay thành địa chỉ blog của bạn*/

</script>
<div id="gl2" class="mod glv"><div class="bd"><div id="gl2-vd"></div><div class="gl2-ct"><div id="gl2-ct1" class="ct on">
<script src="http://dl.dropbox.com/u/66348944/ya_glv_post.js" type="text/javascript">
</script></div>
<script src="http://dl.dropbox.com/u/66348944/ya_ct_post.js" type="text/javascript">
</script></div>
</div>
</div>

<script src="http://dl.dropbox.com/u/66348944/ya_jquery_03.js" type="text/javascript">
</script>
<script src="http://dl.dropbox.com/u/66348944/ya_jquery.min.js" type="text/javascript">
</script>
<script src="http://dl.dropbox.com/u/66348944/ya_jquery_02.js" type="text/javascript">
</script>
<script src="http://dl.dropbox.com/u/66348944/ya_jquery_01.js" type="text/javascript">
</script><script type="text/javascript">
(function() { new YAHOO.sea.fp.TodayVSet('gl2-ct1', true); })();
(function(){YAHOO.util.Event.addListener(window,'load',function(){window.setTimeout(function(){
},500);});})();
</script>

Bạn thay đổi địa chỉ blog của bạn vào và bấm lưu lại là xong.
Ở code trên thì tiện ích này sẽ hiển thị tất cả các bài đăng trên blog của bạn. Nếu bạn muốn tiện ích chỉ hiển thị các bài đăng ở một nhãn nhất định thì bạn cần phải thay 2 đoạn code (màu vàng)

<script src="http://dl.dropbox.com/u/66348944/ya_glv_post.js" type="text/javascript"> bằng đoạn code sau: <script src="https://dl.dropbox.com/u/66348944/ya_glv_label.js" type="text/javascript">

Và:

<script src="http://dl.dropbox.com/u/66348944/ya_ct_post.js" type="text/javascript"> bằng đoạn code sau: <script src="https://dl.dropbox.com/u/66348944/ya_ct_label.js" type="text/javascript">

Chúc các bạn vui

Người đăng: dunghennessy vào lúc 14:05