Những nhận xét, bình luận là một trong những tiêu trí dùng để đánh giá mức độ thành công và nổi tiếng của blog bạn. Độc giả thường bình luận trên blog bạn để hỏi đáp những vấn đề họ khúc mắc trong bài viết của bạn, hay đơn giản chỉ để cảm ơn hoặc đánh giá về tác giả của bài viết đó. Một cách có thể khuyến khích độc giả comment trên trang của bạn là thông báo cho họ thấy bài viết họ đang xem có bao nhiêu người comment (tất nhiên nếu con số càng lớn thì co thấy bài viết đó được quan tâm càng nhiều). Bài viết này namkna sẽ hướng dẫn cho các bạn cách thêm một thông báo số lượng nhận xét được đăng trên một bài viết vào ngay sau tiêu đề của bài viết đó.
(Ảnh minh họa)
Xem trực tiếp trên blog minh họa:
» VIEW DEMO
» Cách tạo số đếm nhận xét đẹp sau tiêu đề bài viết.
1. Đăng nhập vào trang blog của bạn.
2. Vào phần Chỉnh sửa HTML (Edit HLM)
3. Dán đoạn code bên dưới vào trước thẻ đóng ]]></b:skin>.
.comment-bubble {
float : right;
width : 48px;
height : 48px;
background : url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpzDz-q2I5yGcZS6tqcr_yP8_TZqYgQdXxY8fa-f2AdNG4KwvfFcjCwZBPg85uzcYwN160yZnHkvR9lRTWaS-7WFTvogXCz2VGy11sTFPjrEgxSXATy-Hnzq3kdcTz7Bzmafe7PRwZPK8/s1600/text_comment_bubble_comments-namkna-blogspot.png);
background-repeat: no-repeat;
font-size : 18px;
margin-top : -15px;
margin-right : 2px;
text-align : center;
}
4. Tìm đoạn mã chứa tiêu đề bài viết có dạng như bên dưới:
<b:if cond='data:post.title'> <h3 class='post-title entry-title' itemprop='name'>
- Tùy theo từng blog và tác giả của nó mà đoạn code có thể có sự khác nhau nhè nhẹ ví dụ như bên dưới:
<b:if cond='data:post.title'> <h3 class='post-title entry-title'>
5. Sau khi tìm được đoạn code ở bước 4 bạn dán vào sau nó đoạn code bên dưới:
<b:if cond='data:post.allowComments'> <a class='comment-bubble' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick' style='color: #000; font-size: 16px; font-weight: bold;'><data:post.numComments/></a> </b:if>
»Tùy chỉnh mã CSS.
- Thay đổi mã màu chữ số đếm color: #000 cho phù hợp với màu nền của hình ảnh và màu nền trang của bạn nha. bạn có thể sử dụng bảng mã màu namkna cung cấp để chọn màu bạn thích. Bảng mã màu cho blogger.
- Thay thế link ảnh màu đỏ thành link ảnh nền của số đếm nhận xét khác theo ý của bạn. Bạn có thể sử dụng và thay thế thành một số link hình ảnh khác mà mình cung cấp ở bên dưới:
- font-size: 16px Là cỡ chữ của số đếm. bạn hãy điều chỉnh lại cỡ chữ cho phù hợp với từng ảnh nền để nó không bị tràn ra khỏi ảnh hay đè lên ảnh nha.
Namkna hy vọng bài viết sẽ giúp trang blog của bạn có thêm một trải nghiệm mới với giao diện blog có sự thay đổi theo chiều hướng tích cực hơn. Hãy chia sẻ và +1 nếu bài viết có ích với bạn nha. Tất nhiên là hãy để lại comment nếu có bất cứ khó khăn gì khi áp dụng thủ thuật này nha các bạn.
Nhận xét
đã áp dụng nhưng không hiển thị gì hết. anh xem giúp em với :-)
Trả lờiXóaỞ bước 4 mỗi blog thường có 2 đoạn code như vầy. Một đoạn dành cho giao diện mobile, một đoạn cho giao diện web, Hiện tại em chèn vào sau đoạn cho mobile rồi.
Xóaem đã làm được nhưng lại gặp một số lỗi sau: nó không hiện số comment và ảnh chứa số nhận xét bị cắt mất một nữa khúc trên. anh Nam xem giúp em với :-)
Trả lờiXóaanh qua xem trực tiếp trên blog em nhé: TẠI ĐÂY
Trả lờiXóaak nếu em muốn làm cái style chứa số comment giống anh Nam thì làm sao anh Nam nhỉ?
Trả lờiXóa.comment-bubble{border-bottom:1px dotted #0080ff;
Xóabackground:#ddd;
color:#fff;
float : right;
width : 72px;
height : 72px;
font-size : 28px;
margin-top : -15px;
margin-right : 2px;
padding:5px;
text-align : center;}
Chỉnh lại cho thích hợp.
Xóamargin-top : -15px;
margin-right : 2px;
ok, mình đã làm được, cám ơn bạn và anh Nam nhé :_0
Trả lờiXóaNhận xét này đã bị quản trị viên blog xóa.
Trả lờiXóaNhận xét này đã bị quản trị viên blog xóa.
Trả lờiXóaAdmin ơi anh biết làm cách nào để đổi từ "0 comment" trong blogspot thành "Leave a comment" không ạ ? em tìm khắp mọi nơi rồi nhưng ko có cách nào hiệu quả cả :( anh giúp em với :(
Trả lờiXóaÝ bạn là chuyển phần đếm comment thành phần di chuyển tới khung nhận xét phải không .
Xóaem ko hiểu câu hỏi lắm , ý em là muốn nó giống kiểu trang livejournal.com ấy ạ, nếu có 1 comment thì nó sẽ hiển thị là "1 comment", 10 comments thì hiển thị là "10 comments", còn nếu ko có thì là "leave a comment" thôi ạ. Để 0 comment trông blog nó trống trải kiểu gì ấy :((
Xóachào AD ^^! blog của mình hiện có 1 chút vấn đề về phần nhận xét. Đó là phần "tổng quan" chỉ có
Trả lờiXóa[Số lượt xem hôm nay
Bài đăng
Người theo dõi]
chứ không hề có mục đếm phần nội dung comment của blog @@!
còn vào blog, dù cho có comment nó cũng không hiện comment ra mà ẩn đi @@! Chỉ có mỗi khung trả lời thôi @@! Mong ad giúp @@!
Mìnhd đã vào blog 4truyentranh củab bạn thấy nó hoạt động bình thường vẫn hiển thị tốt.
XóaNhận xét này đã bị quản trị viên blog xóa.
Trả lờiXóaAdmin ơi có làm thế nào để số nó canh giữa hình chứ của mình nó toàn bị dính lên đoạn trên của hình nhìn mất thẩm mỹ quá!
Trả lờiXóaBạn thêm vào sau đoạn: .comment-bubble { đoạn code bên dưới:
Xóapadding-top:10px;
padding-right:10px;
chỉnh sửa lại các thuộc tính cho thích hợp nha.
Cảm ơn admin!
Xóacám ơn thông tin của bạn chia sẻ
Trả lờiXóa---------------------------------------------------
trại nấm linh chi | nấm linh chi đỏ