• Tư vấn điều trị
      bệnh khàn tiếng


    www.trikhantieng.com

    Liên hệ + 0913163316

BlogList111

Việt Nam Gia Phả, nơi lưu trữ Gia Phả của người Việt Nam  Kiến thức Blogspot Ngonluanho: Nhung cau chuyen thap lua-Tin-Cay-Men Vngreenzone Là một nơi chia sẻ kinh nghiệm làm blogger - Nơi tôn vinh tâm hồn blogger Việt

Cài đặt bộ chèn Emoticons cho hệ thống nhận xét phân cấp

53
19/09/2011

Được biết, hiện nay với sự phố biến của hệ thống nhận xét phân cấp qua đó người nhận xét khi trả lời một ý kiến của một người nào đó thì thường nhấn vào nút Trả lời/Reply để viết nhận xét qua cửa sổ popup, lúc này việc chèn biểu tượng cảm xúc vào nhận xét sẽ gặp khó khăn. Giải pháp cho vấn đề này là tạo bộ biểu tượng cảm xúc trực tiếp trong hệ thống nhận xét popup.

Hẳn bạn cũng từng biết về addon Greasemonkey giúp thêm bộ chèn biểu tượng cảm xúc trực tiếp vào công cụ đăng bài viết (Post Editor) của Blogspot. Kịch bản này chỉ hoạt động trên trình duyệt FireFox. Thật may là sau một quá trình nguyên cứu, mình đã áp dụng thành công phương pháp này đối với hệ thống nhận xét popup. Cách thức thực hiện là viết một kịch bản tạo chức năng chèn các thẻ <b></b> (in đậm), <i></i> (in nghiêng), <a></a> (liên kết) và một bộ biểu tượng cảm xúc (ở đây mình tạo bộ 25 Zing Emoticons) sau đó upload kịch bản lên trang tài nguyên userscript.org. Để cài đặt tiện ích này, người dùng cần sử dụng trình duyệt FireFox tải addon Greasemonkey rồi cài đặt. Trước tiên đến trang Greasemonkey, nhấn nút Add to Firefox để tải về cài đặt tiện ích này.


Sau đó khởi động lại (restart) trình duyệt, tiếp tục tải Emoticons Script về, nhấn Install để script tự động cài đặt vào FireFox.


Sau đó mở hệ thống nhận xét popup bạn sẽ thấy bộ biểu tượng cảm xúc sẽ xuất hiện trong phần Comments Form. Mỗi khi cần chèn biểu tượng hoặc các thẻ HTML, bạn chỉ việc click vào nó là xong.

Tuy nhiên để các biểu tượng cảm xúc hiển thị trên phần nhận xét (không phải dạng Popup) thì bạn phải cài đặt chức năng biểu tượng cảm xúc, bằng cách đặt đoạn code sau đây vào trước thẻ </body>.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>
//<![CDATA[
//Emoticons for Blogger Comments || Author: Huynh Nhat Ha || http://huynh-nhat-ha.blogspot.com || © Copyright 2010
function emoticonBloggerHuynhNhatHa() {

if(!document.getElementById) {return;} // no support

bodyText = document.getElementById('comments-block');

theText = bodyText.innerHTML;
theText = theText.replace(/:1/g,'<img src="http://2.bp.blogspot.com/_XwhCottp9-E/TTmbVU_kkAI/AAAAAAAAAEk/i8I-QCsR-SU/s1600/49.gif" />');
theText = theText.replace(/:2/g,'<img src="http://4.bp.blogspot.com/_XwhCottp9-E/TTmb0X8B7dI/AAAAAAAAAEo/kIL3qY4z64c/s1600/102.gif" />');
theText = theText.replace(/:3/g,'<img src="http://2.bp.blogspot.com/_XwhCottp9-E/TTmcTfeKNWI/AAAAAAAAAEs/diNANNZkMyQ/s1600/113.gif" />');
theText = theText.replace(/:4/g,'<img src="http://1.bp.blogspot.com/_XwhCottp9-E/TTmc01yNOUI/AAAAAAAAAEw/Zn6dL8OwwTo/s1600/93.gif" />');
theText = theText.replace(/:5/g,'<img src="http://3.bp.blogspot.com/_XwhCottp9-E/TTmdWcMGnWI/AAAAAAAAAE0/akbkAp24xLQ/s1600/61.gif" />');
theText = theText.replace(/:6/g,'<img src="http://3.bp.blogspot.com/_XwhCottp9-E/TTmd6T7Xn4I/AAAAAAAAAE4/U0uh6Hoq_sI/s1600/134.gif" />');
theText = theText.replace(/:7/g,'<img src="http://3.bp.blogspot.com/_XwhCottp9-E/TTmehTlZqII/AAAAAAAAAFA/l_mADXotyKQ/s1600/39.gif" />');
theText = theText.replace(/:8/g,'<img src="http://3.bp.blogspot.com/_XwhCottp9-E/TTme6tBMcOI/AAAAAAAAAFE/DAolMctYPqw/s1600/106.gif" />');
theText = theText.replace(/:9/g,'<img src="http://3.bp.blogspot.com/_XwhCottp9-E/TTmfX20J-yI/AAAAAAAAAFI/tII_6K4KRCQ/s1600/43.gif" />');
theText = theText.replace(/:A/g,'<img src="http://3.bp.blogspot.com/_XwhCottp9-E/TTmf1ADx2fI/AAAAAAAAAFM/TKSlxW-3sck/s1600/111.gif" />');
theText = theText.replace(/:B/g,'<img src="http://2.bp.blogspot.com/_XwhCottp9-E/TTmg0FnIr4I/AAAAAAAAAFQ/D7j1I62S9Qk/s1600/48.gif" />');
theText = theText.replace(/:C/g,'<img src="http://2.bp.blogspot.com/_XwhCottp9-E/TTmhNLMIPgI/AAAAAAAAAFU/gDc0r27mvVE/s1600/54.gif" />');
theText = theText.replace(/:D/g,'<img src="http://4.bp.blogspot.com/_XwhCottp9-E/TTmhqcoiABI/AAAAAAAAAFY/USDzcaOHCUA/s1600/63.gif" />');
theText = theText.replace(/:E/g,'<img src="http://3.bp.blogspot.com/_XwhCottp9-E/TTmiEhF5zeI/AAAAAAAAAFc/jTXlR5srhac/s1600/100.gif" />');
theText = theText.replace(/:F/g,'<img src="http://4.bp.blogspot.com/_XwhCottp9-E/TTmi8fWtW3I/AAAAAAAAAFg/whJrnaxVlMg/s1600/45.gif" />');
theText = theText.replace(/:G/g,'<img src="http://1.bp.blogspot.com/_XwhCottp9-E/TTmjoGrMk2I/AAAAAAAAAFk/l6Qyx1zDYSw/s1600/77.gif" />');
theText = theText.replace(/:H/g,'<img src="http://1.bp.blogspot.com/_XwhCottp9-E/TTmkKU7ogHI/AAAAAAAAAFo/Pz7Y8TFiuBY/s1600/86.gif" />');
theText = theText.replace(/:I/g,'<img src="http://4.bp.blogspot.com/_XwhCottp9-E/TTmkoSLCwpI/AAAAAAAAAFs/yA9mJ4RIeig/s1600/94.gif" />');
theText = theText.replace(/:J/g,'<img src="http://3.bp.blogspot.com/_XwhCottp9-E/TTmk8pAvkXI/AAAAAAAAAFw/_vZNhJpZWXk/s1600/83.gif" />');
theText = theText.replace(/:K/g,'<img src="http://4.bp.blogspot.com/_XwhCottp9-E/TTmlWub0TUI/AAAAAAAAAF0/W9Rj1z_nx8U/s1600/59.gif" />');
theText = theText.replace(/:L/g,'<img src="http://lh4.googleusercontent.com/-Jkm1_kmUV-o/TW3rxDgKE-I/AAAAAAAAAJ8/DPc2XyQXovg/s1600/soldierbaby.gif" />');
theText = theText.replace(/:M/g,'<img src="http://lh4.googleusercontent.com/-JsBeD8OhIGA/TW3rqDDSGFI/AAAAAAAAAJw/IEVj5KX08c4/s1600/alo.gif" />');
theText = theText.replace(/:N/g,'<img src="http://lh6.googleusercontent.com/-gIeSsZ94xUU/TW3ru9VpcFI/AAAAAAAAAJ4/H5esmIaOUBA/s1600/shutup.gif" />');
theText = theText.replace(/:O/g,'<img src="http://lh6.googleusercontent.com/-fu3iaiaFn1Y/TW3ry-NJcrI/AAAAAAAAAKA/N_MUfucV_do/s1600/yeulam.gif" />');
theText = theText.replace(/:P/g,'<img src="http://lh6.googleusercontent.com/-yLDJ0T3p65E/TW3rs-cFoAI/AAAAAAAAAJ0/aa8YOxeo3oc/s1600/datbomb.gif" />');

bodyText.innerHTML = theText;}
//]]>
</script>
<script type='text/javascript'>
emoticonBloggerHuynhNhatHa();
</script>
</b:if>


  1. Chú ý


    • 1 Để chức năng biểu tượng cảm xúc hoạt động trong phần nhận xét thì bạn phải thay đổi ID comments-block cho phù hợp. ID này nằm trong một thẻ chỉ định thành phần chứa các dữ liệu của nhận xét, thẻ này thường nằm ngay trước dòng <b:loop values='data:post.comments' var='comment'>. Tùy theo cách đặt tên của người thiết kế Template mà id này có thể có tên khác nhau ví dụ: comments-block, comments-block3, comments_block, cm_block, commentsblock …

    • 2 Sau khi cài đặt thủ thuật này, bạn cần cập nhật lại thủ thuật Chèn biểu tượng cảm xúc vào nhận xét dạng input để tạo sự thống nhất.

{53 bình luậnAdd yours ?}

13:06:00, 19 thg 9, 2011

Anh Hà ra mắt thủ thuật mới mà em lại không áp dụng ngay được, đang không chạy được trình duyệt FF nên bó tay luôn hix hix :C)

Reply
13:09:00, 19 thg 9, 2011

@Linh Dung Thế thì đi bảo trì máy tính rồi cài đặt Firefox đi cho rồi để trải nghiệm :1) :9) :L)

Reply
13:12:00, 19 thg 9, 2011

@Huỳnh Nhật Hà Tại em lười đi quá, đi bảo hành chắc nửa tháng mới lấy được máy nữa! Buồn thiệt!:B)

Reply
13:14:00, 19 thg 9, 2011

@Linh Dung Chấp nhận mất nửa tháng để tính lâu dài mà :1) :2) :3) :4) :5) :6) :7) :8) :9) :A) :B) :C) :D) :E) :F) :G) :H) :I) :J) :K) :L) :M) :N) :O) :P)

Reply
13:16:00, 19 thg 9, 2011

@Huỳnh Nhật Hà Nghe lời anh Hà vậy hì hì! Chiều nay em đi luôn, về chạy cho đã :1) :D)

Reply
13:17:00, 19 thg 9, 2011

Hạn chế của thủ thuật này là nó chỉ hoạt động khi sử dụng FF thôi phải không anh? Còn các trình duyệt khác thì sẽ không hoạt động!

Reply
13:25:00, 19 thg 9, 2011

@Linh Dung Vì Greasemonkey chỉ dành cho FF thôi nên bộ emo chỉ hiện trên cái còm popup ở FF, còn các trình duyệt khác k thấy. Nhưng khi đã chèn emo rồi thì tất nhiên emo đều hoạt động ở mọi trình duyệt. :H)

Reply
13:26:00, 19 thg 9, 2011

:D) Cảm ơn anh về cái vụ trước nhé!
Nhưng em vẫn còn 1 câu nữa hỏi anh nè, blog của em hiện nay, khi click vào một nhãn nào đó, thấy có dòng [Hiển thị các bài đăng mới nhất có nhãn...] muốn xóa nó thì làm thế nào hả anh (!?) :4)

Reply
13:34:00, 19 thg 9, 2011

@Phạm Minh Tâm Bác chèn vào trước thẻ </b:skin> đoạn code này nhé! .status-msg-wrap{display:none !important;}

Reply
13:34:00, 19 thg 9, 2011

@Phạm Minh Tâm Cái này dễ, xem hướng dẫn chi tiết :L)

Reply
13:46:00, 19 thg 9, 2011

:4)Hi hi... Cảm ơn anh nhiều lắm!
Chúc cho Thủ Thuật Blogger ngày càng nổi tiếng hơn và phát triển không ngừng =>:5)

Reply
15:22:00, 19 thg 9, 2011

Cách này hay đấy,bên wp click vào emotion để chèn trực tiếp vào khung comment,nay blogspot cũng tương tự,Copy dễ hơn rê chuột tìm kí hiêu :4)

Reply
15:41:00, 19 thg 9, 2011

@Born to Trade Bây giờ xài comment phân cấp với addon này trên FF thì chèn emo trực tiếp rồi, k còn thủ công như trước nữa. :D)

Reply
16:04:00, 19 thg 9, 2011

@Huỳnh Nhật Hà Cài đặt thật đơn giản và dễ dàng anh Hà ạ! (Em vừa đi sửa con lap về, chạy vô tư rồi hì hì). Bác TN ra đời comment phân cấp, tiếp đến anh Hà ra mắt liên tiếp 2 thủ thuật về comment, blogspot đang dần dần pro lên rồi! :1):3):F):L)

Reply
22:58:00, 19 thg 9, 2011

Trông nó cứ lộn xộn thế nào í :D

Reply
23:04:00, 19 thg 9, 2011

@NAD Cái gì lộn xộn thế bác NAD! :3)

Reply
23:23:00, 19 thg 9, 2011

@NAD Test :B):C):D):E):F):G):H):I):J):K):M):N):O):P)

Reply
23:26:00, 19 thg 9, 2011

Bên em không hiểu sao các ký hiệu từ A đến P không hiện ra EMO nữa:A)

Reply
23:48:00, 19 thg 9, 2011

@Lee Peace Chán cho Peace thiệt, tại vì cái code emo em đặt có từ :1) đến :9) mà, còn từ :A) đến :P) e đâu có đưa vào. Đã update cái code rõ ràng thế mà hổng nhìn thấy seo? Bệnh nhân kiểu này chắc bác sỹ điên mất. :1)

Reply
23:52:00, 19 thg 9, 2011

@Lee Peace Là cái code đặt trước thẻ đóng body ấy Peace, update đi đồng chí. Ỏi quá.

Reply
00:16:00, 20 thg 9, 2011

@adminthegioiaudio Bác là ai vậy nhỉ! hì hì! Ghé thăm trang của bác thấy sử dụng temp của anh Hà!:1) :D)

Reply
00:26:00, 20 thg 9, 2011

@Linh Dung Mình mới mua cái Template trước của a Hà (10 USD) đang cài đặt :1)

Reply
09:49:00, 20 thg 9, 2011

chà, anh Hà giỏi quá, xong bộ icon trong khi blogger còn chưa có

Reply
11:59:00, 20 thg 9, 2011

:1):2):3):9):4):4):6):9):9):F):F):E):D):C):B):A):G):H):I):J):K):L):P):O):N):M) test @Lee Peace

Reply
23:21:00, 20 thg 9, 2011

:4) Em thấy làm hơi phức tạp bác ạ.

Reply
07:57:00, 22 thg 9, 2011

:1) :2) :4) :6) :5) :M) :N) :O) :P) :D) :B) :I) :G) Test

Reply
07:58:00, 22 thg 9, 2011

Cảm ơn TTBLogger

Reply

Comment form chóng mặt quá...cái tool nhập comment độc thiệt

Reply
19:41:00, 23 thg 9, 2011

sau vài tháng sài domain http://hangvanbian.blogspot.com/ ,mình đã chính thức đổi qua http://www.khamphabian.com/ ,1 quãng thời gian không phải là ít để tìm hiểu blogger,các bạn reply cái ủng hộ nhé :)

(những ai có liên kết xin đổi hộ domain và tiêu đề là khám phá bí ẩn nhé ^^ )

Reply

@Đoàn Minh Tú:D www.khamphabian.com minh reg.

Reply
23:16:00, 28 thg 9, 2011

:M) Không dùng hệ thống comment phân cấp có dùng được không Hà oi :M) :C)

Reply
23:56:00, 28 thg 9, 2011

@VnAbout: Blogger Được chứ sao lại k, dùng chung mà :1)

Reply
19:32:00, 17 thg 10, 2011

Em cũng đang loạn với cái mớ này , Emo cho Comment phân cấp .
Hôm nay đọc dc bài này chắc về vọc sớm thôi :F)

Reply
00:12:00, 2 thg 11, 2011

:P) :1) :1) :1) :1) :2) :3) :4) :5) :6) :7) :8) :9) :A) :B) :C) :E) :F) :G) :H) :I) :J) :K) :L) :M) :N) :O) :P) hay qua,chon kieu nay do phai copy nhieu.anh gioi thieu thu thuat bang commnet nhe

Reply
06:59:00, 19 thg 11, 2011

Test xem :1)

Reply
17:18:00, 29 thg 11, 2011

fdfffaa test phaá

Reply
17:19:00, 29 thg 11, 2011

:3)

Reply
22:47:00, 22 thg 12, 2011

sao mình là ko dc ta

Reply
23:18:00, 27 thg 12, 2011

cảm ơn anh!

Reply
12:53:00, 2 thg 1, 2012

sa

Reply
12:54:00, 2 thg 1, 2012

Dán code cần mã hóa ở đây.

Chuyển đổi:
< thành &lt;

> thành &gt;

" thành &quot;

' thành &#039;

Reply
12:54:00, 2 thg 1, 2012

:3)

Reply
12:46:00, 4 thg 1, 2012

For me save backlink on your blog !
Blogger Tips - Free software with link Mediafire download

Thanks you very much !

Reply
14:54:00, 21 thg 1, 2012

:1) :3) :3)

Reply
12:03:00, 4 thg 4, 2012

Công nhận gio blogspot có nhieu cai hay, cung 2 năm roj moj quay laj blogspot

Reply
12:04:00, 4 thg 4, 2012

:J) :J) :J) :J) , đói bung quá di an kum thôi

Reply
16:10:00, 11 thg 4, 2012

Thanks anh Hà nhiều :) :1)

Reply
10:26:00, 18 thg 4, 2012

:3) :5) hay quá mà mình làm chưa được:B)

Reply
12:05:00, 26 thg 4, 2012

thu xem nao :3) :3)

Reply
23:11:00, 3 thg 6, 2012

Chào các bác. Bài viết hay lắm:1)

Reply
09:14:00, 22 thg 3, 2013

:3) :3) :3) :3)

Reply
Nội quy! Đóng lại Khi bạn viết bình luận, cần tuân thủ một số quy tắc sau:
» Bình luận phải nghiêm túc và không chứa các liên kết quảng cáo.
» Có thể sử dụng các thẻ <b> … </b>,<i> … </i>, <a href="URL..."> ... </a>.
» Yêu cầu thủ thuật tại mục Yêu cầu thủ thuật hoặc hỏi tại mục Hỏi và Đáp.
More →
Chữ đậm Chữ nghiêng Chữ nghiêng 2 Chèn Link Chèn Link Mã hóa code Help ?Nhấn vào biểu tượng hoặc kiểu chữ hoặc chèn link sau đó nhấn nút Chọn rồi copy (Ctrl + C) để paste (Ctrl + V) vào khung viết bình luận. Mã hóa code nếu bạn muốn đưa code vào bình luận.

Chọn Xóa

Next post: Bài đăng Mới hơn

Previous post: Bài đăng Cũ hơn