Thứ Ba, 5 tháng 2, 2013

Chèn bộ mặt cười cho comment của blog



Với bản này khi bạn bấm vào một mặt cười sẽ có một khung hiện ký tự chèn vào blog ra và bạn chỉ cần copy dán vào là xong. Trong tiện ích này kết hợp cả popup hướng dẫn mọi người sử dụng tiện ích khi truy cập blog của bạn.





1- Đăng nhập (login) vào Blog
2- Vào Mẫu (Template)
3- Chọn Chỉnh sử HTML (Edit HTML) => Tiếp tục (Proceed) => Chọn Mở rộng tiện ích mẫu ( Expand Template Widgets)
4- Tìm tới thẻ </head>và dán code sau vào trước nó
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script>
Nếu blog của bạn đã có thư viện jquery(1.8.3) thì bỏ qua bước này
5- Tiếp tục dán code sau vào trước thẻ </head>
<script src="https://krdautocrazyblog.googlecode.com/files/Emoticon.js" type="text/javascript"></script>
6- Tiếp theo đặt đoạn code sau trước thẻ </body>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>
//<![CDATA[
jQuery(document).ready(function () {emoticonx({
emoRange:"#comments p, div.emoWrap",
putEmoAbove:"iframe#comment-editor",
topText:"Nhấn vào hình để xem mã!",emoMessage:"Copy mã tương ứng dán vào khung comment."
})
});
//]]>
</script>
</b:if>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<script type='text/javascript'>
//<![CDATA[
jQuery(document).ready(function () {emoticonx({
emoRange:"#comments p, div.emoWrap",
putEmoAbove:"iframe#comment-editor",
topText:"Nhấn vào hình để xem mã!",emoMessage:" Copy mã tương ứng dán vào khung comment."})
});
//]]>
</script>
</b:if>
7- Tìm đến thẻ <b:loop values='data:post.comments' var='comment'> và thêm trước nó thẻ <div id='emocomments'>. Tìm thẻ đóng </b:loop> và thêm sau nó thẻ </div>
Sau khi thêm 2 đoạn code trên ta sẽ có như sau:
Trong đó đoạn màu được bôi màu xanh là những code ta đã thêm vào
Save Mẫu lại thế là xong.
Nếu các bạn muốn dụng bộ Emoticon Yahoo thì Tại bước 5 các bạn thay code sau vào trước thẻ </head>
<script src="https://krdautocrazyblog.googlecode.com/files/DautoCrazy.blog-Emoticon-Yahoo.js" type="text/javascript"></script>
Vậy là ok

Không có nhận xét nào:

Đăng nhận xét