Home » Thủ thuật blog
Hiển thị tên những người đã comment ngay bên dưới bài viết
Thứ Bảy, 16 tháng 5, 2009
[FD's BlOg] - Một thủ thuật cho phép bạn làm đẹp footer của bài viết. Thủ thuật sẽ hiển thị tên những người đã comment bài viết. Một cách để tạo nên sự sôi động cho bài viết cũng như là cho blog của bạn, nhất là những blog có nhiều người comment. Và việc hiện thị số lượng người comment này ta có thể điều chỉnh được.
Hình minh họa thủ thuật:


☼ Ta bắt đầu thủ thuật:
1. Đăng nhập blog
2. Vào bố cục (Layout)
3. Vào chỉnh sửa code HTML (edit code HTML)
4. Chọn "mở rộng mẫu tiện ích" (expand widget template)
5. Chèn đọan javascript này vào sau thẻ <head>
<script src='http://fandung.110mb.com/JS-files/fd-comments.js' type='text/javascript'/>
6. Tiếp tục xuống dưới tìm đọan code sau:
<span class='post-comment-link'>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>
</span>
7. Thêm đọan code màu đỏ vào như bên dưới:
<span class='post-comment-link'>
<b:if cond='data:blog.pageType != "item"'>
<script expr:src='"http://www.blogger.com/feeds/4987055759836993091/" + data:post.id + "/comments/default?orderby=published&alt=json-in-script&max-results=500&callback=rp"' type='text/javascript'/>
<b:if cond='data:post.allowComments'>
<noscript>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/>
<b:else/>
<data:post.numComments/> <data:top.commentLabelPlural/>
</b:if>
</a>
</noscript>
</b:if>
</b:if>
</span>
- Chú ý : các dòng code màu xanh ở trên :
+ 4987055759836993091 : đây là mã ID của blog bạn, vào bảng điều khiển để xem mã số này (như hình bên dưới)

+ max-results=500& : dòng code này dùng để tùy chỉnh việc hiển thị tối đa số ngừoi comment, ví dụ bạn muốn cho hiển thị tối đa 20 người thì thay số 500 thành 20.
+ Ngòai ra code màu tím là để thiết lập không cho thủ thuật hiển thị ở bài viết, nếu bạn muốn nó chỉ hiển thị ở bài viết thì thay dấu " != " thành " == ", và nếu muốn nó hiển thị ở tất cả các trang thì xóa code màu tím đi.
- Nếu bạn muốn trang trí nó như ví dụ của mình thì thêm vào dòng code màu xanh như bên dưới:
<span class='post-comment-link'>
<b:if cond='data:blog.pageType != "item"'>
<div style='padding: 5px 2px 2px 5px; border:2px dotted #FF0000; background:#C3FDB8;'>
<script expr:src='"http://www.blogger.com/feeds/4987055759836993091/" + data:post.id + "/comments/default?orderby=published&alt=json-in-script&max-results=500&callback=rp"' type='text/javascript'/>
<b:if cond='data:post.allowComments'>
<noscript>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/>
<b:else/>
<data:post.numComments/> <data:top.commentLabelPlural/>
</b:if>
</a>
</noscript>
</b:if>
</div>
</b:if>
</span>
- Và nếu muốn nó hiển thị ở dòng đầu tiên của post footer (như hình minh họa mình đưa) thì bạn di chuyển (copy và xóa) tòan bộ code ở trên và dán nó sau vào sau dòng code này : <div class='post-footer-line post-footer-line-1'>, và nó sẽ trông giống như bên dưới:
<div class='post-footer-line post-footer-line-1'>
<span class='post-comment-link'>
<b:if cond='data:blog.pageType != "item"'>
<div style='padding: 5px 2px 2px 5px; border:2px dotted #FF0000; background:#C3FDB8;'>
<script expr:src='"http://www.blogger.com/feeds/4987055759836993091/" + data:post.id + "/comments/default?orderby=published&alt=json-in-script&max-results=500&callback=rp"' type='text/javascript'/>
<b:if cond='data:post.allowComments'>
<noscript>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/>
<b:else/>
<data:post.numComments/> <data:top.commentLabelPlural/>
</b:if>
</a>
</noscript>
</b:if>
</div>
</b:if>
</span>
8. Cuối cùng là save template.
Chúc các bạn thành công.

- Thêm Google translate - dịch đa ngôn ngữ cho Blogspot
- Cài đặt theo dõi Google analytics cho blogspot
- Cách tạo khung Form đăng nhập cho blogspot
- Thêm chia sẻ Like và share bài viết cho blogspot [trên trang itviet360]
- Thêm nút theo dõi (Follow) cho blogspot
- Feedburner Google và cách lấy tùy chỉnh cho blogspot
- Tiện ích Popular Posts - Bài xem nhiều với CSS3
- Mạng xã hội theo dõi với hiệu ứng rê chuột cho blogspot
- Mudim - Thêm bộ gõ tiếng Việt cho blogspot
- Hiệu ứng màu chạy lấp lánh trong chữ cho blogspot
- Thủ thuật thêm "comment mới gần đây nhất" cho blogspot
- Template dịch vụ, công ty giới thiệu cho blogspot
Comments[ 0 ]
Đăng nhận xét