[ Blogspot ] > Widgets tạo bài viết liên quan đơn giản cho Blog

Chủ Nhật, 17 tháng 10, 2010

print this page
send email


Đăng nhập vào tài khoản Blogger bằng tài khoản Gmail của các bạn. Chọn blog các bạn muốn chỉnh sửa:
Thiết kế -> Chỉnh sửa HTML, đánh vào ô Mở rộng mẫu tiện ích
CtrL + F tìm đến thẻ </head> trong Templates của các bạn và thêm đoạn code sau trước thẻ này:

<style> #related-posts { float : left; width : 540px; margin-top:20px; margin-left : 5px; margin-bottom:20px; font : 11px Verdana; margin-bottom:10px; } #related-posts .widget { list-style-type : none; margin : 5px 0 5px 0; padding : 0; } #related-posts .widget h2, #related-posts h2 { font-size : 20px; font-weight : normal; margin : 5px 7px 0; padding : 0 0 5px; } #related-posts a { text-decoration : none; } #related-posts a:hover { text-decoration : none; } #related-posts ul { border : medium none; margin : 10px; padding : 0; } #related-posts ul li { display : block; background : url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgveFRPxVOhbdjdtQUViBaK4BV4baAdwoPa8M1ttcSGxZgZbuHQ_eW9a_H6vGBhp73DB5V_IkEGWW6e8uP5gcHvzxLcK_tXE8ygnkU3Hgx7GkFfV_I-ZsEBKHVfmvuUq6XBmFVDTTYG2qs/") no-repeat 0 0; margin : 0; padding-top : 0; padding-right : 0; padding-bottom : 1px; padding-left : 21px; margin-bottom : 5px; line-height : 2em; border-bottom:1px dotted #cccccc; } </style> <script src='http://theblogtemplates.com/scripts/Related_posts_hack.js' type='text/javascript'/>

Tiếp đến, tìm <data:post.body/> (hoặc <div class="'post-body">) và thêm vào ở dưới đoạn code các các bạn vừa tìm được:

<b:if cond='data:blog.pageType == "item"'>
<div id="related-posts">
<font face='Arial' size='3'><b>Related Posts : </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if><b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=5&quot;' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div></b:if>

Cuối cùng là Save lại và tận hưởng thành quả của mình
Demo:

Chúc các bạn thành công

P/S: Mình khuyến cáo các bạn nên Backup lại Templates của mình đề phòng trường hợp có lỗi gì xảy ra hoặc Code không hoạt động.

0 nhận xét:

Đăng nhận xét