Cách thêm nhãn nổi bật cho Menu giao diện flatsome cực đơn giản

Làm thế nào để thay đổi được màu sắc cũng như tên của những cái nhãn, hay thay đổi chữ trên nhãn ý cho nó thuần việt.

Làm thế nào để đổi chữ New thành chữ mới.

Làm thế nào để đổi chữ popular sang phổ biến.

Làm thế nào biến đổi tùy chỉnh theo ý thích của bạn thì đây chính là bài hướng dẫn để bạn dễ dàng thực hiện.

Nếu như trên menu mà có những label cụ thể như này. Bạn sẽ điều hướng khách hàng tốt hơn vào các mục mình cần nhấn mạnh hoặc gây chú ý. Sự nổi bật của nó khiến cho menu không trở nên nhàm chán nữa.

Chèn label vào menu flatsome

Còn vấn đề các bạn mà chưa biết chèn code vào để menu hiển thị thì làm theo hướng dẫn sau:

Vào menu bạn cần chỉnh sửa. Kiểm tra phần tùy chọn hiển thị (góc phải trên cùng). Xem có phần CSS như hình dưới đây không. Nếu không thì tích vào nhé. Nhìn như hình

Tiếp theo thì vào từng phần menu con bạn điền nhãn vào là được.

Với cú pháp label-tên bạn đặt ở phía dưới. Như vậy là nó hiển thị ngon lành rồi.

Đây là cách đơn giản nhất để thay đổi màu nền và việt hóa nhãn:

Nếu bạn muốn thay đổi mã màu và tên nhãn như chú thích thì cần sử dụng 1 chút code nữa.

Đoạn code chính

Phần này nhớ thêm vào custome CSS nhé.

Hướng dẫn luôn cho các bạn chưa biết. Đầu tiên, bạn đnăg nhập vào trang quản trị này, dò menu cột trái đến giao diện/tùy biến.

Nó chuyển trang và bạn kéo xuống gần cuối trang. Thấy chữ addition CSS. Thêm đoạn code phía dưới vào là xong.

Nhớ lưu lại và tận hưởng nhé.

/**
* Code goes in style.css of your child theme or Advanced > Custom CSS
*/
.label-purple.menu-item > a:after {
content: 'Purple'; /* Thay đổi tên nhãn, có thể là Big sale, hot, mới, hoặc bất cứ thứ gì mình muốn */
display: inline-block;
font-size: 9px;
line-height: 9px;
text-transform: uppercase;
letter-spacing: -0.1px;
margin-left: 4px;
background-color: #572fbd; /* thay đổi màu sắc - Copy mã màu nào bạn cần */
font-weight: bolder;
border-radius: 2px;
color: #fff;
padding: 2px 3px 3px;
position: relative;
top: -2px;
}