Di chuyển ghi chú nhận xét theo khung nhận xét khi reply

note commentMột trong những điều khó chịu khi sử dụng Thread Comment của Blogger là khi reply lại nhận xét nào đó thì chỉ khung nhận xét di chuyển tới vị trí cần reply. Sẽ chẳng ra sao khi khung nhận xét và phần ghi chú nhận xét mỗi thứ ở một nơi. Thủ thuật sau đây sẽ giúp bạn mang phần ghi chú nhận xét đi theo khung nhận xét mỗi khi nhấn reply. Và không chỉ phần ghi chú nhận xét, bạn có thể thêm phần chú thích những ký tự tắt của emoticons hay bất cứ mã HTML nào.


move note


Các bước thực hiện.


Bước 1: Tìm trong template thẻ <b:includable id='threaded-comment-form' var='post'>.

code before
Mã hàm threaded-comment-form trước khi thay thế


Tại hàm threaded-comment-form này thay thế thẻ <b:else/> bằng đoạn mã dưới đây:
<b:else/>
<div id='threaded-comment-form'>

Thay thế thẻ </b:if> bằng đoạn mã dưới đây:
</div>
</b:if>

code after
Mã hàm threaded-comment-form sau khi thay thế


Bước 2: Thay thế đoạn mã document.getElementById(domId).insertBefore(replybox, null); trong template của bạn bằng đoạn mã dưới đây:
document.getElementById(domId).insertBefore(document.getElementById('threaded-comment-form'), null);

Các bước trên là nhóm những thành phần cần di chuyển theo khung nhận xét vào cùng thẻ <div> với id là threaded-comment-form và khai báo lại hàm insertBefore. Thủ thuật đã xong!


Bonus thêm 2 style cho phần ghi chú nhận xét.


Style 1:

note style one

Thêm đoạn mã dưới đây vào trước thẻ ]]></b:skin> trong template của bạn.
#threaded-comment-form p{position:relative;background:#17b38f;padding:10px;font-size:13px;line-height:1.6em;color:#fff}
#threaded-comment-form p:after{content:"";position:absolute;bottom:-10px;left:10px;border-top:10px solid #17b38f;border-right:20px solid transparent;width:0;height:0;line-height:0}

Style 2:

note style two

Thêm đoạn mã dưới đây vào trước thẻ ]]></b:skin> trong template của bạn.
#threaded-comment-form p{position:relative;border-radius:20px;padding:10px;font-size:13px;line-height:1.6em;color:#111}
#threaded-comment-form p,#threaded-comment-form p:after,#threaded-comment-form p:before{border:4px solid #ff4e47;background:#fff}
#threaded-comment-form p:after{bottom:-20px;right:30px;width:20px;height:20px}
#threaded-comment-form p:after,#threaded-comment-form p:before{content:"";position:absolute;border-radius:50%}
#threaded-comment-form p:before{bottom:-30px;right:60px;width:10px;height:10px}

Muốn thêm thành phần nào cần di chuyển theo khung nhận xét bạn chỉ cần đặt nó vào trong thẻ <div id='threaded-comment-form'>.
Chia sẻ Phần mềm và Tài liệu cho người dùng Windows, Ubuntu. Hướng dẫn Thủ thuật cho người dùng Blogger, Blogspot.

Chia sẻ

48

Nhận xét
1

Thủ thuật này hay đó chứ...thanks DP nha
À... mà sao cái style comment của D có bài viết khi cm thì hiện cái ảnh author và có bài viết lại không vậy. D khắc phục được chứ

Reply
2

Có thể bài viết đó tài khoản Blogger khi viết và comment là khác nhau, cái style k can thiệp gì đến code của Blogger cả. Bạn cho mình xem permalink comment đó xem.

Reply
4

Tuy biết là cậu chỉ can thiệp CSS thôi, nhưng cậu hãy thử tạo thêm 1 hay 2 bài viết nữa rồi comment vào thử xem, tớ comment bằng tài khoản blog tớ mà, sr vì không cho link được, vì blog đó tớ đang thiết kế riêng... :D

Reply
3

Nhận xét này đã bị tác giả xóa.

Reply
5

Mặc dù thấy rất vô lý nhưng mình cũng tạo thêm vài bài mới và comment, chẳng có hiện tượng gì cả.

Reply
6

a Duy 27 tuổi rồi nhỉ, a có vợ con chưa hay còn độc thân

Reply
13

Đang tự do tự tại, vợ con vào mệt lắm :D. Dù đôi lúc mình thích có 1 đứa con gái tầm 2, 3 tuổi ý, tuổi này dễ thương :)

Reply
8

Hì... có lẽ skin mình đang dùng nó bị lỗi... mình đang sửa lại đây...
Skin này cũng dùng style cm của D nè, rất đẹp, mình chỉ thích đơn giản mà đẹp thôi, hồi trước dùng của pác noct, giờ chuyển qua đây dùng lun :D
http://share2vn.blogspot.com/2011/08/huong-dan-chan-website-bat-ky-tren-tat.html
Sao cái chữ add comment nó hiện ra trước ấy nhỉ, mình đang dùng skin của Simplex... hix :(

Reply
7

Hay ... DP chịu khó tìm tòi và giải quyết các vấn đề của Blogger quá. Thế này thì chẳng mấy chốc blogger sẽ trở thành #1 thôi!!! Thanks!

Reply
9

Một thủ thuật hay, cảm ơn Duy nhiều :)

Reply
10

Hôm qua mới thấy bảo có tut mới hôm nay đã xuất bản :)
quá chuẩn :)

Những blog của mình luôn dùng các thủ thuật của Duy...

Reply
11

Hj D...
Hiện tại trang quản lý của blogger sắp bỏ hẳn giao diện cũ trong tháng tới. Mình thì hay dùng giao diện cũ. vì khi design và upload file XML lên, mình có thể bỏ widget hoặc là giữ lại. Nhưng trong giao diện mới lại không có phần đó, mình rất bùn vì điều đó... Hjx, không biết các bạn thường sài giao diện mới thấy thế nào...
Sr vì cm ko liên quan đến chủ đề này nhá :)

Reply
12

Đây là lý do mà mình tạo gấp thêm vài cái blog nữa và loại bỏ những widget k xóa được ở giao diện mới. Nhiều phản ánh vấn đề này nhưng Blogger vẫn bỏ qua, đơn giản đó là widget mang bản sắc (hay bản quyền nhỉ :D) của Blogger. Mình thậm chí loại hết js của Blogger :))

Reply
14

Thế thì tiêu thật rồi pác ạ... hix
Sau này thiết kế thì bị vướng nhiều chỗ lắm đây...

Reply
16

Giao diện mới rất "đáng ghét" khi chỉnh sửa template mình làm cứ hay bị báo lỗi x27.... gì đó phải chuyển sang giao diện cũ mới OK đc

Reply
15

thủ thuật "mượt" quá , cảm ơn bác Duy.

Reply
17

tks nha anh Duy, Style 2 đẹp quá

Reply
18

Em vừa tạo tem đầu tiên.bác sang cho ý kiến phát

Reply
19

bác Duy này, không biết tại máy hư hay gì mà anh Chrome nhà mình không comment được vậy :D

Reply
20

bác duy nghiêm cứu vấn đề này giúp mình với

Reply
21

duy ơi. giúp mình với. sao blog mình vào nó cứ báo nhiễm url: mal
máy mình cài avast
xem giúp mình với nhé http://www.a3fc.tk/

Reply
22

Nhận xét này đã bị quản trị viên blog xóa.

Reply
23

Em vừa mới đổi Templates xong, mời bác Duy qua chơi và cho em ý kiến nhé. Thank!^^

Reply
24

bác triển khai dịch vụ sử và làm thủ thuật theo yêu cầu có tính phí đi em ủng hộ

Reply
25

Tự dưng thấy chán Blogger quá, đang muốn chuyển qua làm site template, đây mới là sở thích của mình.

Reply
26

Mở dịch vụ đê pác. Em huởng ứng luôn đây :D

Reply
27

không hiển thị là sao nhỉ

Reply
28

Đừng đánh đố mình với những nhận xét kiểu này, nếu thực sự quan tâm làm ơn để lại link blog và đã áp dụng nó.

Reply
29

http://khiphien.blogspot.com/

Anh ơi, em làm rồi như hướng dẫn mà ko hoạt động, em cũng ko biết chỉnh sửa sao nữa, tại cái comment đã chỉnh sửa từ trước nữa rồi, giờ làm thêm bước này thấy nó rối quá, em ko biết làm sao cho nó hoạt động nữa. Nếu có thể anh chỉ em với nha.

Reply
30

Giao diện cũ của Blogger sẽ bị xóa trong tháng tới. Điều gì sẽ xảy ra nếu mìh ko nâng cấp?? các bác giúp em với

Reply
31

Thanks Bro.. my comment-form fixed now :) God Bless You, Duy Pham.

Reply
32

http://dulichtongiao.blogspot.com/ khung comment của tôi không thể đi chuyển làm ơn chỉ dùm tôi với

Reply
35

Bạn đã áp dụng thành công nên mình k reply lại, còn vấn đề gì nữa bạn nói rõ để mình trả lời.

Reply
36

ah! Mình bấm vào trả lời thì khung comment không đi theo! bạn chỉ mình với? Cảm ơn DP

Reply
37

thẻ đóng &lt/div> của id threaded-comment-form cần nằm phía sau iframe của comment, tức là thẻ div với id=threaded-comment-form này phải bao quanh tag a và tag iframe. Ở blog của bạn nó chỉ bao quanh khung hướng dẫn chèn emoticons mà thôi, bạn di chuyển &lt/div> lại cho phù hợp.

Reply
38

Cảm ơn! mình tìm ra rồi

Reply
33

bạn ơi!///

Reply
34

Mình cần sự hỗ trợ từ bạn! bạn ơi????

Reply
39

Bạn ơi! Bộ emotions (Biểu tượng) tại sao nó chỉ hiện ra ở người còm đầu tiên còn người sau thì chỉ hiện ra mỗi box comments thôi là tại sao? Không biết là lỗi gì? Mình vừa cài được bộ code để cho mọi người gửi trực tiếp được link nhạc và clip youtube vào thẳng comment luôn,vui lắm bạn ạ ! Cảm ơn Duy nhiều!

Bạn ghé qua nhà mình xem hộ cái Box comment nó bị làm sao nhé!

http://minhdungbc.blogspot.com/

Reply
40

http://www.vncode.biz khung comment của mình không thể đi chuyển làm ơn chỉ dùm tôi với

Reply
41

Hjx rồi mình viết mấy hàng ghi chú vào chổ nào thế Add

Reply
42

Cài đặt > Bài đăng và nhận xét > Thư thông báo mẫu nhận xét

Reply
43

Ở bên bài"Chèn emoticons và ảnh, Youtube, Nhaccuatui vào Thread Comment" bạn hướng dnẫ mình qua đây cài thêm thủ thuật ở đây,cài xong các biểu tượng vẫn bị biến mất ở còm thứ hai,gửi bạn bộ code này sau khi dùng thủ thuật ở đây nhé ! Bạn dành thời gian xem lại hộ mình tí nhé ! Cảm ơn http://www.mediafire.com/?ba3857c1jzke7pu

Reply
44

Hình ảnh của hộp comment khi bài vừa mới đăng :
http://i842.photobucket.com/albums/zz345/conguyendk/Decorated%20images/Hinh%20danh%20cho%20blog/Khibaivuamoidang_zpsd86d4957.jpg

Và sau khi có một nhận xét thì biểu tượng lại biến mất,đồng thời cái ô màu hồng của bạn lúc này mới xuất hiện:
http://i842.photobucket.com/albums/zz345/conguyendk/Decorated%20images/Hinh%20danh%20cho%20blog/Vasaukhidang1nhanxet_zpsf8b3c14f.jpg

Mình không biết Code CSS nhà mình bị lỗi gì,bạn xem dùm nhé !

Reply
45

Duy :Muốn thêm thành phần nào cần di chuyển theo khung nhận xét bạn chỉ cần đặt nó vào trong thẻ (div id...-form) mình không hiểu cách thực hiện theo như bạn nói.

Reply
46

sao trong bài viết của mình mất đi cái khung comment, mặc dù mình sử dụng 1 templ cho 2 cái blog, 1 cái thì có 1 cái thì không, mong các bạn chỉ giúp

Reply
47

Cảm ơn bạn rất nhiều!

Nhưng của mình nó lại ko hiện đầy đủ khung ghi chú, bạn giúp mình với http://hungole.blogspot.com/2011/07/cach-hat-karaoke-tren-may-tinh-cuc-hay.html

Reply
48

mình làm dc rồi, cảm ơn bạn :)

Reply

Đăng nhận xét

Cancel reply

• Những nhận xét spam sẽ bị xóa.
• Public tài khoản Blogger để được trợ giúp.
• Nặc danh thường không được chào đón.