Modify post footer - Show comment author in post footer[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.
{ 0 nhận xét... read them below or add one }
Đăng nhận xét