Thêm huy hiệu bên cạnh tên Admin khi bình luận trên WordPress đơn giản với CSS
Hello, chào ngày mới nhé anh em ! Hôm nay Hocban.vn có trò này hay lắm, đó là: Thêm huy hiệu bên cạnh tên Admin khi bình luận trên WordPress. Ở một cách khác ta có thể gọi nó là User Role Label . Đơn giản và nhanh thôi vì nó được thực hiện chỉ với một đoạn CSS ngắn.
Cách thêm huy hiệu bên cạnh tên Admin khi bình luận trên WordPress
Thật ra thủ thuật này là một mẹo đơn giản với CSS và cụ thể nó là liên quan đến :after Selector
. Không chỉ áp dụng cho WordPress không thôi mà đối với các nền tảng khác cũng vậy như Blogspot chẳng hạn.
Rồi cách làm trên WordPress thì nó tùy mỗi theme nhé, giờ theme Hocban.vn đang dùng là Smartline của Themezee, tên admin bình luận nó có class là:
.bypostauthor .fn {.....}
Giờ, muốn thêm cái gì đó ở đằng sau thì ta sẽ thêm :after
vào sau như này nè:
.bypostauthor .fn:after {...}
Trong cái {….} sẽ là định dạng cho nội dung và nội dung cần hiển thị ở đó, nó có thể là ngôi sao như ảnh đầu bài, dấu tick xác minh, hoặc một đoạn text màu xanh lá cây như: Hocban.vn (admin) chẳng hạn.
Các bạn thực hiện theo như sau: Vào Customize >> Additional CSS >> dán đoạn code dưới đây vào trong đó rồi lưu lại để xem kết quả.
.bypostauthor .fn:after { content: '\f513'; color: #03A9F4; display: inline-block; text-decoration: inherit; vertical-align: middle; font-family: 'Genericons'; -webkit-font-smoothing: antialiased; margin-left: 3px; }
- Nếu muốn đổi huy hiệu khác thì bạn xem các mẫu huy hiệu khác theo bảng mã: Genericons unicode codes list values này. Mà cái này là theo font Genericons nhé, còn font khác thì không xài được đoạn CSS trên.
- Nếu muốn thay huy hiệu bằng từ Admin thì dán đoạn này vào:
.bypostauthor .fn:after { content: 'Admin'; color: green; display: inline-block; text-decoration: inherit; vertical-align: middle; font-family: 'arial'; -webkit-font-smoothing: antialiased; margin-left: 3px; }
Xong rồi đó, bạn thấy sao ? Quá được đi chứ nhỉ ? Ta cứ dựa vào cách này và nghĩ ra nhiều trò hay ho khác nhé, và comment thành quả bên dưới để anh em chiêm ngưỡng nhen :v
Cuối cùng, lâu quá không viết lách gì, nay mần bài chia sẻ này đến anh em để giao lưu tí ha. Anh em có điều gì thắc mắc hoặc góp ý cứ để lại bình luận bên dưới nhé 😀
Chào bạn, mình muốn nhờ b vấn đề này nhé. Có cách nào để ẩn ngày/tháng/năm của bài viết trên Google, nhưng vẫn hiển thị ngày/tháng/năm bài viết ở trong WordPress ko nhỉ. Vì nếu để ngày tháng năm trên Google, ví dụ bài viết viết cách đây năm 2016 thì người dùng họ sẽ nghĩ bài đó đã lỗi thời. Mình ko thể cập nhập lại bài viết được, vì đây là những kiến thức cuộc sống. Mình muốn ẩn nó trên Google thôi, còn khi họ truy cập vào bài viết rồi, thì cho họ nhìn thấy ngày… Read more »
Tuy nhiên, bác cũng nên cập nhật lại bài viết, xem xem sửa lại dấu chấm dấu phẩy gì đó rồi lưu lại, nó sẽ hiện thị ngày cập nhật gần đây trên Google. Hơn nữa nếu bác ẩn đi Google trừ điểm đấy 😀
Có thật bị trừ điểm ko bạn, chứ mình tham khảo nhiều nguồn bảo ko bị trừ mà. Ko biết bạn đọc ở đâu, cho mình tài liệu với
Trường thông tin ngày đăng bài / cập nhật nó cho người dùng biết bài viết định xem nó mới hay cũ. Bài đăng thường cập nhật sửa đổi là một tiêu chí để xếp hạng tìm kiếm.
Khi bác dùng thủ thuật ẩn nó đi (đối với posts) là điều không nên làm thay vào đó hãy cập nhật bài viết để nó hiển thị ngày gần nhất. Còn page thì ẩn cũng được vì nó là nội dung không cần cập nhật thường xuyên.
https://support.google.com/webmasters/answer/9253249
Trong phần thiết lập plugin YOAST SEO, bác để như này nhé !
Tuyệt vời cảm ơn bạn nhiều
Không có chi bác 😀
Để áp dụng vào blog xem sao. Cảm ơn Bác.
Thử đi bác, hehe !