HIỂN THỊ BÀI VIẾT TRONG CÙNG MỘT NHÃN (KIỂU 2)

Với thủ thuật này, các bài viết trong cùng một nhãn sẽ hiển thị một hình ảnh đại diện phía trên, dưới hình ảnh là tiêu đề bài đăng. Và được trình diễn chạy tự động từ phải qua trái hay ngược lại.

Bạn bấm vào thẻ XEM THỬ để trải nghiệm trước.

Xem thử

Đầu tiên, bạn đăng nhập vào Blog > chọn Thiết kế > Chỉnh sửa HTML, bấm cặp phím Ctrl+F để mở hộp tìm kiếm và gõ vào đó dòng lệnh ]]></b:skin> và dán trước dòng lệnh đó đoạn code phía dưới

.bgcontent{background:#efefef; /*màu nền của tiện ích*/
height:140px; /*chiều cao của tiện ích*/
width:500px; /*độ rộng của tiện ích*/
}
#rc-content {
padding:4px;
width:500px; /*độ rộng của tiện ích*/
}
#rc-main {
width:110px;
background:#fff url(https://lh5.googleusercontent.com/_9-sNIAfGhKg/TXXfgP5zNLI/AAAAAAAAAGU/Dh1jYQZoSgM/main-bg.png) repeat-y;
}
#rc-top {
background:#fff url(https://lh3.googleusercontent.com/_9-sNIAfGhKg/TXXff4uaqaI/AAAAAAAAAGQ/cj2q0Y_nb-A/top-bg.png) no-repeat top;
height:3px;
}
#rc-bottom {
background:#fff url(https://lh5.googleusercontent.com/_9-sNIAfGhKg/TXXffoEZMJI/AAAAAAAAAGM/JJSC-pSoUTk/bottom-bg.png) no-repeat bottom;
height:3px;
}
.rc-thumbs {
padding:2px 5px 5px 5px;
height:70px;
}
.rc-thumbs IMG {
width:100px; /*độ rộng của ảnh thumbnail*/
height:70px; /*chiều cao của ảnh thumbnail*/
}
.rc-title {
height:48px;
padding:0px 3px 2px 3px;
line-height:1.3em;
font-size:11px;
font-weight:bold;
}
.rc-title a {color:#0000ff;}
.rc-title a:hover {color:#ff0033;}

Bạn bấm Lưu lại và trở lại Thiết kế > Thêm tiện ích HTML/Javacript rồi tiếp tục dán đoạn code phía dưới vào

<div style="font-weight:bold; border: 2px #30a1db solid; padding:5px; text-align:center; background:#FFF380;">Thủ thuật Win 7</div>
<div class="bgcontent">
<script language="JavaScript">
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiH7UgSybAlZBc4OuyqBe9WoGX3x7ZpOc7AIxJDH_s0fPNu-5asQ_cEcrj3owNloPCpXO4tJwsSsURjjr7FYGBgR734SRLBpAswGVG5gxslPEY2pvTVMqcFUxlFIylHHWoGOBb2jdT0QTx3/";
showRandomImg = true;
zaBold = false;
numposts = 20; //số bài trình diễn trong tiện ích
label = "WIN 7"; //thay thành tên nhãn của blog bạn
summaryTitle = 40; //số ký tự của tiêu đề bài viết
home_page = "http://www.dungheineken.blogspot.com/"; //thay thành địa chỉ blog bạn
</script>

<marquee align="center" direction="left" height="150" onmouseout="this.start()" onmouseover="this.stop()" scrollamount="5" width="500">
<script src="http://dl.dropbox.com/u/66348944/rc_label.js" type="text/javascript">
</script>
</marquee></div>

<p style="float:right;margin:0;padding:3px">Xem tất cả<a href="http://dungheineken.blogspot.com/search/label/WIN%207"> Thủ thuật Win 7 &#187;</a></p>

Bây giờ bạn dựa theo các phần ghi chú trong code (màu đỏ) để chỉnh sửa lại cho phù hợp với ý thích của mình và Bấm lưu lại.
Nếu không muốn tiện ích này hiển thị các bài viết trong nhãn mà hiển thị hết cho các bài ở Blog thì bạn thay chữ label (màu vàng) thành chữ allpost là xong

Lưu ý: Bạn phải điền chính xác tên nhãn, địa chỉ Blog của mình và quan trọng nhất là số bài trình diễn trong tiện ích phải bằng hoặc ít hơn số bài trong cùng một nhãn, nếu số bài trình diễn trong tiện ích nhiều hơn số bài hiện có trong nhãn thì hình ảnh sẽ không được hiển thị...