Tiện ích Bài viết mới cho blog có mô tả link

Thiết kế Blog giá rẻ Tiện ích Recent Post này, phần mô tả bài viết kèm theo hình ảnh gọn và đẹp, rất phù hợp cho việc đặt sau tiêu đề của các bài viết trong Blog.

Minh họa bạn có thể xem ngay tại Blog của mình

Tiện ích Bài viết mới cho blog có mô tả link

Cách tiến hành:

- Đăng nhập vào Blog

- Chọn Mẫu › Chỉnh sửa HTML › Mở rộng Mẫu Tiện ích

- Tìm <div class='post-header-line-1'/> và chèn dưới nó đoạn code trên. (Thêm đoạn code

<b:if cond='data:blog.pageType == "item"'>

<p class='ads'>

code

</p>

</b:if>

để tiện ích chỉ xuất hiện trong các bài viết:)

Sau khi thêm sẽ thành như sau:


<b:if cond='data:blog.pageType == &quot;item&quot;'>
<p class='ads'>

<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:250px;
background:#ccc;
text-align: justify;
}
</style>

<script language="JavaScript">
imgr = new Array();
imgr[0] = "https://dl.dropbox.com/u/74775294/anh/nothumbnail.gif";
showRandomImg = true;
tablewidth = 245;
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 = 5;
label = "All";
home_page = "http://www.viettin24h.com/";
</script>
<script src="https://dl.dropbox.com/u/74775294/Filejs/s2-post.js" type="text/javascript"></script>

</p>
</b:if>

Trong đó:

Width: 250px :độ 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 cửa sổ popup khi rê chuột vào tiêu đề bài viết.
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ị ở cửa sổ Popup khi khi rê chuột.
Home_page: địa chỉ blog của bạn, (thay http://www.viettin24h.com/ thành URL blog của bạn).
Label: Tên nhãn muốn hiển thị, hãy thay All thành tên nhãn của bạn.
Numposts=5: Số bài muốn hiển thị trong tiện ích này.

Thủ thuật trên áp dụng cho tất cả các bài viết trong Blog, nếu muốn áp dụng cho bài viết trong cùng một nhãn thì thay:
https://dl.dropbox.com/u/74775294/Filejs/s2-post.js
bằng:
https://dl.dropbox.com/u/74775294/Filejs/s2-label.js

(Bạn nên sử dụng google code lưu các file ảnh, file js riêng để blog load nhanh hơn. Nếu chưa biết thì xem hướng dẫn tại đây)

- Lưu mẫu và xem kết quả

Nhấn Thích , G +1 và chia sẻ tới bạn bè: Nếu bài viết giúp ích cho bạn!

Cám ơn các bạn đã ghé thăm ủng hộ
Nguồn : chúng tôi sưu tầm từ nhiều nguồn

Thiết kế web chuyên nghiệp giá rẻ

Chúng tôi tuyên thiết kế web chuyên nghiệp đẳng cấp giá rẻ với 5 năm kinh nghiệm trong lĩnh vực thiết kế website nếu các bạn có nhu cầu có thể liên hệ Hotline: 0962 66 57 57 || Email: cmay.tt@gmail.com || website: cmay.vn