RSS Posts 
Theo yêu cầu của bạn Tuấn P.H.A (www.kenh78.com)[FD's BlOg] - Với thủ thuật này, các bạn sẽ có 1 thanh bookmark với hiệu ứng động nho nhỏ khi rê chuột vào icon đó. Đây là 1 plugin được viết cho wordpress bởi Josh Jones và nó được fix lại để dùng cho blogger.
Hình ảnh minh họa:
☼ Các bước thực hiện :
1. vào bố cục
2. vào chỉnh sửa code HMTL
3. chọn mở rộng mẫu tiện ích
4. chèn đoạn code CSS bên dưới vào sau dòng code ]]></b:skin>
<style type='text/css'>
div.sexy-bookmarks {
height:54px;
background:url('http://i43.tinypic.com/2ueii3t.png') no-repeat left bottom;
position:relative;
width:540px;
}
div.sexy-bookmarks span.sexy-rightside {
width:17px;
height:54px;
background:url('http://i43.tinypic.com/2ueii3t.png') no-repeat right bottom;
position:absolute;
right:-17px;
}
div.sexy-bookmarks ul.socials {
margin:0 !important;
padding:0 !important;
position:absolute;
bottom:0;
left:10px;
}
div.sexy-bookmarks ul.socials li {
display:inline-block !important;
float:left !important;
list-style-type:none !important;
margin:0 !important;
height:29px !important;
width:48px !important;
cursor:pointer !important;
padding:0 !important;
}
div.sexy-bookmarks ul.socials a {
display:block !important;
width:48px !important;
height:29px !important;
font-size:0 !important;
color:transparent !important;
}
.sexy-furl, .sexy-furl:hover, .sexy-digg, .sexy-digg:hover, .sexy-reddit, .sexy-reddit:hover, .sexy-stumble, .sexy-stumble:hover, .sexy-delicious, .sexy-delicious:hover, .sexy-yahoo, .sexy-yahoo:hover, .sexy-blinklist, .sexy-blinklist:hover, .sexy-technorati, .sexy-technorati:hover, .sexy-facebook, .sexy-facebook:hover, .sexy-twitter, .sexy-twitter:hover, .sexy-myspace, .sexy-myspace:hover, .sexy-mixx, .sexy-mixx:hover, .sexy-script-style, .sexy-script-style:hover, .sexy-designfloat, .sexy-designfloat:hover, .sexy-syndicate, .sexy-syndicate:hover, .sexy-email, .sexy-email:hover {
background:url('http://img509.imageshack.us/img509/3131/sexysprite.png') no-repeat !important;
}
.sexy-furl {
background-position:-300px top !important;
}
.sexy-furl:hover {
background-position:-300px bottom !important;
}
.sexy-digg {
background-position:-500px top !important;
}
.sexy-digg:hover {
background-position:-500px bottom !important;
}
.sexy-reddit {
background-position:-100px top !important;
}
.sexy-reddit:hover {
background-position:-100px bottom !important;
}
.sexy-stumble {
background-position:-50px top !important;
}
.sexy-stumble:hover {
background-position:-50px bottom !important;
}
.sexy-delicious {
background-position:left top !important;
}
.sexy-delicious:hover {
background-position:left bottom !important;
}
.sexy-yahoo {
background-position:-650px top !important;
}
.sexy-yahoo:hover {
background-position:-650px bottom !important;
}
.sexy-blinklist {
background-position:-600px top !important;
}
.sexy-blinklist:hover {
background-position:-600px bottom !important;
}
.sexy-technorati {
background-position:-700px top !important;
}
.sexy-technorati:hover {
background-position:-700px bottom !important;
}
.sexy-myspace {
background-position:-200px top !important;
}
.sexy-myspace:hover {
background-position:-200px bottom !important;
}
.sexy-twitter {
background-position:-350px top !important;
}
.sexy-twitter:hover {
background-position:-350px bottom !important;
}
.sexy-facebook {
background-position:-450px top !important;
}
.sexy-facebook:hover {
background-position:-450px bottom !important;
}
.sexy-mixx {
background-position:-250px top !important;
}
.sexy-mixx:hover {
background-position:-250px bottom !important;
}
.sexy-script-style {
background-position:-400px top !important;
}
.sexy-script-style:hover {
background-position:-400px bottom !important;
}
.sexy-designfloat {
background-position:-550px top !important;
}
.sexy-designfloat:hover {
background-position:-550px bottom !important;
}
.sexy-syndicate {
background-position:-150px top !important;
}
.sexy-syndicate:hover {
background-position:-150px bottom !important;
}
.sexy-email {
background-position:-753px top !important;
}
.sexy-email:hover {
background-position:-753px bottom !important;
}
</style>
5. Bước kế tiếp là xác định vị trí đặt của bookmark, các bạn có thể tùy chỉnh lại vị trí này nếu muốn, ví dụ đặt ngay sau dòng code <data:post.body/> hoặc đặt nó ở dưới cùng của post footer..., ở đây mình sẽ đặt nó ở trên cùng của post footer.
- tìm đoạn code như bên dưới:
<div class='post-footer'>
<div class='post-footer-line post-footer-line-1'>
- chèn ngay sau nó đoạn code sau:
<div class='sexy-bookmarks'>
<ul class='socials'>
<li class='sexy-delicious'><a expr:href='"http://del.icio.us/post?url=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>
<li class='sexy-digg'><a expr:href='" http://digg.com/submit?url=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>
<li class='sexy-technorati'><a expr:href='" http://technorati.com/faves?add=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>
<li class='sexy-reddit'><a expr:href='" http://www.reddit.com/submit?url=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>
<li class='sexy-stumble'><a expr:href='" http://www.stumbleupon.com/submit?url=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>
<li class='sexy-designfloat'><a expr:href='"http://www.designfloat.com/submit.php?url=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>
<li class='sexy-facebook'><a expr:href='" http://www.facebook.com/sharer.php?u=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>
<li class='sexy-twitter'><a expr:href='" http://twitthis.com/twit?url=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>
<li class='sexy-furl'><a expr:href='" http://www.furl.net/storeIt.jsp?u=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>
<li class='sexy-syndicate'><a href='http://feeds2.feedburner.com/YOUR-FEEDBURNER-ID' title='Subscribe to RSS'/></li>
<li class='sexy-email'><a expr:href='" mailto:?subject=" + data:post.url + "&title=" + data:post.title' target='_blank'/></li>
</ul>
<span class='sexy-rightside'/></div>
- điều chỉnh lại code màu xanh.
6. Cuối cùng là save template.
☼ Một lưu ý nhỏ, tiện ích sẽ hiển thị tốt với phần main có độ rộng trên 540px.
Author Josh Jones
Chúc các bạn thành công.
Bóc tem lúc gần sáng cho tut hay của anh Dũng :D thanks anh nhiều lắm
thủ thuật này mình biết lâu rùi :D
vậy hả Thuấn, anh cũng thế :D, cái thủ thuật này anh test ở blog test anh lâu rồi, cũng tính post lên lâu rồi, nhưng lo test mấy cái khác nên quên. Nay bạn Tuấn P.H.A yêu cầu nên anh post lên luôn :D
Thuan - share4vn che^ blog anh xau, fan dung cho ys kien ve mat tham my di, de anh co "hang dong' thich dang' de tra loi Thuan nhe.
^_^
chài, Thuấn chê blog anh xấu à , hiện tại em cũng chưa có ý kiến nào hay cho anh cả :D, sau này có ý tưởng em sẽ góp ý.
Bây giờ em trả lời yêu cầu muốn túi bụi luôn :(
thanks anh dũng em đã làm được chủng bị cho vào trang kenh78.com :D
em thấy sao nói thậy thui..thực sự là em thấy nội dung blog của bác phattrienso phong phú thế mà nhìn cái theme của bác xấu quá
@Thuấn : thì đó cũng là ý kiến của em, :D thì anh cũng đâu có nói gì đâu.
của mình bị hiên ra như này là hỏng cái ảnh nào hả bạn : http://cA2.upanh.com/10.39.14177280.KUX0/hoiloi.png
your feedburner id trên là gì vậy anh? em gà nên không biết
sao ảnh die hết vậy hả anh
Mình làm đúng các bước rồi mà không hiện là sao FD nhỉ http://www.hudgroup.com.vn
» Nội dung phải liên quan tới chủ đề bài viết.
»
[quote=AUTHOR name=fdquote]NỘI DUNG[/quote]
» Có thể sử dụng các thẻ <b>,<i>,<a>.
BlOg FD chính thức đóng comment của khách ẩn danh.
BlOg FD.