Home » Baigiang
Thứ Ba, 29 tháng 11, 2011
Hiển thị bài viết trong cùng một nhãn (kiểu 3)
Với thủ thuật này, các bài viết trong cùng một nhãn sẽ hiển thị trên 2 cột, bài viết mới nhất sẽ nằm trên cùng, bên trái là hình đại diện, bên phải là tiêu đề bài đăng...
Thủ thuật này thích hợp với giao diện có sidebar nhỏ.
Xem thử
Thủ thuật này thích hợp với giao diện có sidebar nhỏ.
Mời các bạn bấm vào xem thử phía dưới sẽ thấy rõ hơn.
Đầu tiên bạn đăng nhập vào Blog > chọn thiết kế > Thêm tiện ích HTML, và dán tất cả các code phía dưới vào.
<style type="text/css">
.mota{
position: relative;
z-index: 0;
text-decoration:none;
}
.mota:hover{
background-color: transparent;
z-index: 50;
}
.mota span{
position: absolute;
background-color: #ffffff;
padding: 5px;
left: -1000px;
border: 1px solid #000;
visibility: hidden;
color: black;
text-decoration: none;
}
.mota span img{
border-width: 0;
padding: 2px;
}
.mota:hover span{
padding:5px;
visibility: visible;
top: 20px;
left:50px;
width:150px;
background:#ccc;
text-align: justify;
}
</style>
<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://sites.google.com/site/fdblogsite/Home/nothumbnail.gif";
showRandomImg = true;
tablewidth = 200;
cellspacing = 1;
borderColor = "#30a1db";
bgTD = "#fff";
imgwidth = 60; // độ rộng của ảnh thumbnail
imgheight = 60; // chiều cao của ảnh thumbnail
fntsize = 12;
acolor = "#E67C15";
aBold = true;
icon = " » ";
text = "no";
showPostDate = false;
summaryPost = 150;
summaryFontsize = 12;
summaryColor = "#000";
icon2 = " » ";
numposts = 6;
</script>
<script src="http://data.fandung.com/blog/demo/newposts-Description/Newposts-label_description.js" type="text/javascript">
</script>
.mota{
position: relative;
z-index: 0;
text-decoration:none;
}
.mota:hover{
background-color: transparent;
z-index: 50;
}
.mota span{
position: absolute;
background-color: #ffffff;
padding: 5px;
left: -1000px;
border: 1px solid #000;
visibility: hidden;
color: black;
text-decoration: none;
}
.mota span img{
border-width: 0;
padding: 2px;
}
.mota:hover span{
padding:5px;
visibility: visible;
top: 20px;
left:50px;
width:150px;
background:#ccc;
text-align: justify;
}
</style>
<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://sites.google.com/site/fdblogsite/Home/nothumbnail.gif";
showRandomImg = true;
tablewidth = 200;
cellspacing = 1;
borderColor = "#30a1db";
bgTD = "#fff";
imgwidth = 60; // độ rộng của ảnh thumbnail
imgheight = 60; // chiều cao của ảnh thumbnail
fntsize = 12;
acolor = "#E67C15";
aBold = true;
icon = " » ";
text = "no";
showPostDate = false;
summaryPost = 150;
summaryFontsize = 12;
summaryColor = "#000";
icon2 = " » ";
numposts = 6;
label = "NÂNG CAO";
home_page = "http://dunghennessy.blogspot.com/";</script>
<script src="http://data.fandung.com/blog/demo/newposts-Description/Newposts-label_description.js" type="text/javascript">
</script>
Bây giờ, bạn thay đổi các dòng lệnh màu đỏ và màu xanh theo ý thích của mình
* Width: 150px (độ rộng của bảng nhỏ khi rê chuột vào tiêu đề bài viết).
* Background: #ccc (màu nền của bảng nhỏ khi rê chuột vào tiêu đề bài viết) * Tabewidth = 200 (chiều rộng của tiện ích).
* Imgwidth = 60 (chiều rộng của ảnh đại diện)
* Imgheight = 60 (chiều cao của ảnh đại diện).
* SummaryPost = 150 (số ký tự hiển thị ở bảng nhỏ khi rê chuột).
* SummaryPost = 150 (số ký tự hiển thị ở bảng nhỏ khi rê chuột).
* Home_page: địa chỉ blog của bạn
* Label: Tên nhãn muốn hiển thị
* Numposts=9: Số bài muốn hiển thị
và bấm LƯU lại là xong
LƯU Ý: Các bạn phải điền thật chính xác địa chỉ blog và tên nhãn, nếu không thủ thuật sẽ bị lỗi và không hiển thị được.
Chúc các bạn thành công
Nguồn dunghennessy.blogspot.com
Nguồn dunghennessy.blogspot.com
You may also...
Hot
-
Bài 2 hướng dẫn sử dụng phần mềm Simatic S7.200 để viết chương trình điều khiển cho PLC. Ngoài ra, cũng hướng dẫn sử dụng phần mềm Simulator...
-
Bài 1 trình bày tổng quan về PLC S7.200, cấu trúc phần cứng, phương thức hoạt động của PLC S7.200. Đồng thời nêu những ưu điểm khi các nhà...
-
Babylon là phần mềm từ điển và dịch thuật hàng đầu thế giới, cung cấp cho bạn công cụ trực quan nhất cho mọi nhu cầu dịch thuật của mìn...
-
(Traidatmui.com) – Hiện nay có rất nhiều trang website cung cấp cho bạn host miễn phí tuy nhiên không phải hosting nào cũng tốt, cũng đảm...
-
Có khá nhiều bạn thắc mắc, gửi yêu cầu cho tôi về cách cài đặt phần mềm cho PLC của Mitsubishi. Tuy nhiên, vì quá bận nên tới nay mới hướng ...
-
Phần mềm tiện lợi trong việc vẽ các sơ đồ mạch điện công nghiệp, được hỗ trợ đầy đủ các kí hiệu của các thiết bị dùng trong công nghiệp như...
-
1 CÁC LỆNH VÀO / RA OUTPUT: Sao chép nội dung của bit đầu tiên trong ngăn xếp vào bit được chỉ định trong lệnh. Nội dung của ngăn xếp không ...
-
( Traidatmui.com) – Hôm nay xin chia sẻ cùng các bạn thủ thuật tạo Slideshow cho hình ảnh, thủ thuật này mình có thêm hiệu ứng Sroll với 2...
-
[FD's BlOg] - Footer của bài viết có chứa tiện ích như : Người đăng, thời gian post bài, nhãn comment... Các bạn có thể chỉnh sửa the...
-
[FD's BlOg] - Một vài lệnh đơn giản từ CSS kết hợp với tiện ích " Recent posts " sẽ tạo cho bạn 1 thanh tin tức đơn giản. Do...
Comments[ 0 ]
Đăng nhận xét