Tổng hợp bộ emoticons dành cho Blogger Comment Form


Sau khi giới thiệu các bộ emoticons dành cho khung comment của Blogger (như Yahoo, Onion Head, Yoyo & Cici), mình nhận được nhiều ý kiến phản hồi trên Blog tin học (Một số báo rằng code hoạt động, một số lại không ). Hôm nay đành phải ngồi mò lại code và chỉnh sửa, cuối cùng cũng tạm ổn nên đăng lên cho mọi người kiểm tra.

Hiện tại thì mình đã tích hợp Emoticons của Onion Head, Yoyo&Cici và Liva Panda (không bao gồm Yahoo) vào 1 file Javascript duy nhất để các bạn không phải chèn nhiều link rườm rà. Các bạn hãy click vào đây để xem toàn bộ Emo có thể sử dụng, và truy cập trang Blog phụ của mình để test thử.

Nếu các bạn muốn thử nghiệm Emoticons vào Comment Form trong Blog của bạn, hãy thực hiện các bước sau nhé :
  1. Đăng nhập vào Blogger > Layout > Edit HTML (Mở rộng Mẫu tiện ích).
  2. Dán đoạn code bên dưới ở trước thẻ </body>
    <script src='http://boyprodx.googlepages.com/Full_Emoticons_Comment_Blogger_ver_1.js' type='text/javascript'/>
  3. Dán đoạn code bên dưới ở trước thẻ ]]></b:skin>
    .emoticons {
        background: #eef4f9;
        border: 1px solid #ddd;
            line-height : 36px;
        padding: 3px;
        margin: 5px;
    }
  4. Tìm thẻ <b:if cond='data:post.embedCommentForm'> và dán đoạn code này vào 1 trong các vị trí ở hình bên dưới :
    <div class='emoticons'><b>Bạn muốn sử dụng emoticons trong comment ư? <a href='http://boyprodx.googlepages.com/Full_Emoticons_Code_ver_1.htm'>CLICK HERE</a> và copy mã số emo vào khung comment nhé!
    </b></div>
  5. Save lại template và kiểm tra kết quả.
Lưu ý :
- Lần này mình tạm thời sử dụng Google Pages để Upload file JS + HTML thay vì 110mb như thường lệ (Vì Google Pages hoạt động tốt hơn). Nếu file bị xóa, mình sẽ re-upload nên các bạn an tâm.
- Bước 4, 5 chỉ để trang trí thêm cho phần giới thiệu bảng mã Emo, tạo sự chú ý của người đọc (Xem hình). Bạn có thể tùy chỉnh lại theo ý thích.
- Nếu có lỗi xảy ra, bạn hãy nhắn qua comment cho mình kèm theo screenshot nhé. Mình sẽ cố gắng khắc phục.

P/s: Hy vọng đợt cập nhập thủ thuật chèn Emoticons cho Blogger Comment Form này sẽ làm các bạn hài lòng. Chúc vui !

42 Nhận xét on "Tổng hợp bộ emoticons dành cho Blogger Comment Form"

min LVT on 24 July 2009 at 12:49 said...

thử test nào :)) :D b-( ~:> :(|)

min LVT on 24 July 2009 at 12:49 said...

đâu có hiện đâu... bên blog tớ cũng làm như vậy nhưng k hiện...

min LVT on 24 July 2009 at 12:51 said...

yoyo04 yoyo10
tớ thay cái link js của cậu = link js của gman để dùng emoticon y!... nhưng chả hiện đc...

boyproDX on 24 July 2009 at 15:36 said...

@min LVT : Blog mình chỉ sử dụng Yahoo emo trong comment, muốn test các emo khác, bạn vào đây .
File JS vẫn hoạt động bình thường, nếu không thấy hiện emo thì bạn kiểm tra lại nhé (Do đường truyền, Blog chưa load xong ...)

EragonPump on 24 July 2009 at 23:37 said...

test cai nao :))

Anonymous said...

=))

truong said...

khong duoc ban oi

Trần Thừa on 10 August 2009 at 19:43 said...

Cái tiện ích của bác là rất tuyệt. Nhưng em xin góp đôi điều: bác gom chung tất cả lại như vậy tất yếu cái chú thích cho code sẽ load rất chậm, người viết comment sẽ lười chèn vô. Hơn nữa, cái link khi click vào sẽ vô luôn thay vì bung tab mới hoặc cửa sổ mới. Có thể nó tiện lợi cho vài người, nhưng trường hợp nút back làm refesh trang thì sao? Tui có ngu ý thế này, sao bác không phát triển thêm cái ứng dụng này, thay vì dẫn link thì khi click vào sẽ bung ra pop up chứa code, vừa nhẹ vừa tiện đóng. Như trang này chẳng hạn http://gamek.channelvn.net/
Dù gì cũng rất cảm ơn bác góp sức hoàn thiện blog cho anh em.

boyproDX on 12 August 2009 at 14:28 said...

@truong : Mình đã test, vẫn dùng đc mà.
@Trần Thừa : Vâng, mình vẫn đang tìm cách chèn emo bằng click chuột (thay vì phải viết kí tự) để hoàn thiện thêm cho code. Lúc đó sẽ cải tiến lại hoàn toàn cho ae :D

Trần Thừa on 14 August 2009 at 20:22 said...
This comment has been removed by the author.
Trần Thừa on 14 August 2009 at 20:23 said...

"Được voi đòi hai bà Trưng" :D sẵn nhờ bác nghiên cứu cải tiến cái comment này thử xem:http://js-kit-blogger.blogspot.com/2009/07/install-js-kit-comment-form-in-blogger.html
Nói chung có cái comment vậy là tuyệt rồi:
+Add youtube video
+Add image
+Cái emoticon dạng popup tiện lợi
+Hệ thống soạn thảo đa năng
+Có thông báo tự ẩn trong vùng soạn thảo
+Lựa chọn avatar dễ dàng
Nhưng có điều nếu cái widget này có thêm bộ gõ tiếng Việt nữa thì hay quá.
Hic, cái này hẳn là không dễ để làm từ đầu, mong bác thử cố gắng !!! Chân thành cảm ơn !!!

boyproDX on 17 August 2009 at 10:09 said...

@Trần Thừa : Lúc trước mình cũng từng tham khảo qua các widget của JS-Kit, nhưng thấy nó hơi rườm rà nên đành bỏ qua :P. Còn về bộ gõ Tiếng Việt, ý bạn là sao? Mình thấy nó vẫn nhập theo mã Unicode đc mà :|
Với hệ thống comment thì mình thích Disqus hơn, nó có vẻ đơn giản và hệ thống dữ liệu tốt :D. Điển hình là có khá nhiều Blogger (cả VN lẫn nước ngoài) và Website lớn dùng Disqus :) . Nhiều lần tính chuyển rùi nhưng hơi phân vân, sợ visitor ko quen :)

Ly Ly Na on 20 August 2009 at 06:54 said...

làm y chang vẫn chẳng hiện ra gi cả, mât công nổi mấy cục mụn lên mà nó ko thành, tức còn hơn bị mất việc

Trần Thừa on 21 August 2009 at 20:45 said...

Thanks bác đã quan tâm câu hỏi của em. Vì blog của em làm dạng cộng đồng, em muốn thành viên cũng post đc ảnh và phim một cách dễ dàng. Mặt khác cái multimedia comment của Viettut em thử rồi nhưng ko đc(có lẽ em chèn nhiều module quá). Còn về bộ gõ thì không quan trọng lắm, chỉ là tiện cho người lười(như các diễn đàn vẫn dùng bộ gõ đó thôi). Hehe, em hơi viễn vông chút nhưng bác xem mô hình của cái site này mà mê:http://www.instructables.com, không biết trên nền blogspot mình có phát triển đc vậy ko?
Một lần nữa cảm ơn đã quan tâm !!!

Manutd-news on 25 August 2009 at 21:47 said...

dc ko nhi :))

Manutd-news on 25 August 2009 at 21:48 said...

:))

Quach Phu Thanh on 5 September 2009 at 15:25 said...

tui xai ko duoc :d

Lindahoang on 12 September 2009 at 18:54 said...
This comment has been removed by the author.
Anonymous said...

=))

Hanah on 18 October 2009 at 11:20 said...
This comment has been removed by the author.
aronvn on 24 October 2009 at 02:22 said...

cậu có bộ zip của cái yahoo này hông gửi mình đi

bikerboy on 11 November 2009 at 00:49 said...

sao anh ko share code của cái anh đang dunf nhỉ

Anonymous said...

:D test nhA

ZikZak on 3 January 2010 at 18:28 said...

Bạn ơi, mình làm được rồi nhưng khung hình hướng dẫn trắng xóa ko nhìn thấy j, bạn chỉ mình cách khắc phục được ko? Tks nhiều nhé! ^^
Bạn xem hộ mình ở đây nhé! http://zikzakonline.blogspot.com/2009/12/am-ap.html

ug_chocobo11 on 20 January 2010 at 13:03 said...

hình như fifox nhìn dc còn ie thì ko hjc hjc

Silent... on 31 January 2010 at 21:39 said...

test :X :x

Silent... on 31 January 2010 at 21:44 said...

oni03

Lê Minh Hiếu on 22 February 2010 at 14:40 said...

cám ơn nhiều nhưng tớ làm vẫn ko được =((

Anonymous said...

x(

Lê Trung Hiếu on 18 April 2010 at 17:14 said...

:)) hay quá nhỉ.Cảm ơn bạn nhiều

Lê Trung Hiếu on 18 April 2010 at 18:00 said...

Không được nhỉ.Mình thử mà nó hiện lên "oni03" chứ ko phải oni03

Lê Trung Hiếu on 18 April 2010 at 18:09 said...

Mày mò mãi cũng tìm ra.Mình đổi host js của cậu đi là lại chạy ngon.Thank nhá

Trùm Cuối (Admin) on 4 May 2010 at 12:38 said...

:((

doan luan on 9 August 2010 at 16:01 said...

mình làm ko hiên ra x(

Lại Thế Dũng on 13 October 2010 at 16:54 said...

:))

BlogManga on 8 January 2011 at 14:01 said...

:))

Đoàn Nguyễn Thành Luân on 12 February 2011 at 12:26 said...

:)) test cái

Trần Văn Dũng on 20 August 2011 at 16:01 said...

:-L

Anonymous said...

test thử nha ;))

TheFire™ on 23 December 2011 at 16:54 said...

:))

ASC on 29 January 2012 at 14:51 said...

:))

Ngọc Đạt on 7 May 2012 at 14:57 said...

test :))

:)) ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} :)] ~x( :-t b-( :-L x( =))

Post a Comment

Cám ơn bạn đã đọc bài viết tại blog của boyproDX.
Nếu cảm thấy blog có nhiều bài hữu ích , các bạn hãy Bookmark(nhấn Ctrl_D) hoặc Đăng kí nhận tin qua RSS site mình để không bỏ qua các bài viết tiếp theo của mình. Chúc các bạn vui vẻ !

Logo Exchange (Tạm ngưng)

 

Chuyên trang blog về tin học | Copyright © 2009 | Best view at 1024x768 with Firefox 3