Digital Marketing

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

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

Thêm huy hiệu bên cạnh tên quản trị viên khi nhận xét về WordPress

Xin chào, chào ngày mới các bạn! Hôm nay Hocban.vn có một game rất hay, đó là: Thêm huy hiệu bên cạnh tên Admin khi comment trên WordPress. Theo một cách khác, chúng ta có thể gọi nó là Nhãn vai trò người dùng . Nó đơn giản và nhanh chóng 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 Quản trị viên khi bình luận trên WordPress

Thủ thuật này thực sự là một thủ thuật đơn giản với CSS và nó đặc biệt liên quan đến :after Selector . Không chỉ áp dụng cho WordPress mà còn cho các nền tảng khác như Blogspot chẳng hạn.

Còn làm như thế nào trên WordPress thì tùy từng theme, hiện tại theme mà Hocban.vn đang sử dụng là Themezee’s Smartline, admin comment tên là:

.bypostauthor .fn {.....}

Bây giờ, nếu bạn muốn thêm thứ gì đó ở phía sau, tôi sẽ thêm :after Nhập sau như thế này:

.bypostauthor .fn:after {...}

Trong {….} Sẽ là định dạng cho nội dung và nội dung hiển thị ở đó, nó có thể là một ngôi sao như hình ảnh tiêu đề, một dấu xác minh hoặc một văn bản màu xanh lục như: Hocban.vn (quản trị viên) nhu la.

Bạn làm như sau: Vào Customize >> CSS bổ sung >> dán đoạn mã bên dưới vào đó và 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 bạn muốn đổi huy hiệu khác, bạn có thể xem các mẫu huy hiệu khác theo bảng mã: Giá trị danh sách mã unicode Genericons. Cái này là theo phông chữ Genericons, và phông chữ khác không thể sử dụng CSS ở trên.
  • Nếu bạn muốn thay thế huy hiệu bằng từ Admin, hãy dán 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, bạn nghĩ sao? Quá tốt phải không? Hãy cứ dựa vào cách này mà nghĩ ra nhiều game hay ho khác, và comment kết quả bên dưới cho các bạn cùng chiêm ngưỡng nhé: v

Cuối cùng, sau một thời gian dài mà không viết được gì, mình xin chia sẻ bài này với các bạn để trao đổi một chút. Nếu bạn có bất kỳ câu hỏi hoặc góp ý nào, hãy để lại bình luận bên dưới

Bài viết liên quan

  • Hướng dẫn thêm Nhãn vai trò người dùng bên cạnh tên người bình luận trong WordPress
  • Đếm số lượng bình luận của mỗi người, số lượng bình luận của người dùng trên WordPress

4.3 / 5 – (6 phiếu bầu)


Marketing online


Thông tin thêm

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

#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
[rule_3_plain] #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

Thêm huy hiệu bên cạnh tên admin khi bình luận trên WordPress
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.
MỤC LỤC NỘI DUNG1 Cách thêm huy hiệu bên cạnh tên Admin khi bình luận trên WordPress2 Bài viết liên quan
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é ????
Bài viết liên quan

Hướng dẫn thêm User Role Label cạnh tên người comment trong WordPress
Đếm số bình luận của mỗi người, user comment count trên WordPress

4.3/5 – (6 votes)

window.addEventListener(‘DOMContentLoaded’, function() {
jQuery(document).ready(function( $) {
$.post( ‘https://hocban.vn/wp-admin/admin-ajax.php’, {action: ‘mts_view_count’, id: ‘9107’});
});
});
#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
[rule_2_plain] #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
[rule_2_plain] #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
[rule_3_plain]

#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

Thêm huy hiệu bên cạnh tên admin khi bình luận trên WordPress
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.
MỤC LỤC NỘI DUNG1 Cách thêm huy hiệu bên cạnh tên Admin khi bình luận trên WordPress2 Bài viết liên quan
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é ????
Bài viết liên quan

Hướng dẫn thêm User Role Label cạnh tên người comment trong WordPress
Đếm số bình luận của mỗi người, user comment count trên WordPress

4.3/5 – (6 votes)

window.addEventListener(‘DOMContentLoaded’, function() {
jQuery(document).ready(function( $) {
$.post( ‘https://hocban.vn/wp-admin/admin-ajax.php’, {action: ‘mts_view_count’, id: ‘9107’});
});
});

Related Articles

Trả lời

Email của bạn sẽ không được hiển thị công khai.

Back to top button