Tutorial 2x Make BB-Code Toggler more visible - Làm BB-Code Toggler rõ ràng hơn XenForo 2.2

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,734
Được Like
12,680
Make BB-Code Toggler more visible - Làm BB-Code Toggler rõ ràng hơn XenForo 2.2

Bạn và các thành viên của bạn nhiều lúc không xác định được thanh BB-Code liệu nó có bật hay không?

Nút ngay cả trên màn hình lớn cũng không hiển thị theo mặc định và thành thật mà nói, biểu tượng dấu ngoặc cũng không rõ ràng đối với tất cả mọi người.

Bước đầu tiên, bạn cần làm cho nút luôn hiển thị. Đó là phần dễ dàng.

Chỉ cần truy cập yourdomain.tld /admin.php?button-manager/edit&type=toolbarButtons

Mở menu ở bên phải và tăng số lượng nút hiển thị hoặc di chuyển nút [ ] sang bên trái.

Bạn cần thực hiện việc này đối với tất cả các kích thước của thanh mà bạn muốn hiển thị nút.

1616926635204.png

Bây giờ, nút này ít nhất cũng có thể nhìn thấy. Nhưng, Trạng thái Bật/Tắt và biểu tượng đối với nhiều người vẫn còn lúng túng.

Vì vậy, hãy truy cập https://fontawesome.com/icons?d=gallery&p=2 và tìm kiếm một biểu tượng phù hợp với nhu cầu của bạn. Trong bài viết này sử dụng biểu tượng máy đánh chữ https://fontawesome.com/icons/typewriter?style=solid.

Sao chép mã unicode của biểu tượng này.
Trong trường hợp này là: f8e7

Bây giờ, hãy đi và chỉnh sửa extra.less

Thêm vào cuối đoạn code sau. Sử dụng màu để hiển thị rõ ràng nút hiện đang bật hoặc tắt.
Less:
.fr-toolbar .fr-command.fr-btn[data-cmd="xfBbCode"]
{
    color: @xf-successColor;
    &.fr-active {
        color: @xf-errorColor;
    }
    i:before {
        content: "\f8e7";
    }
}

Bây giờ bạn đã hoàn thành. Và, bạn có thể làm điều này cho mọi style khác nhau nếu bạn muốn.

Kết quả sẽ trông thế này theo style mặc định:

1616927206691.png

BB-Code đang bật

1616927227207.png

BB-Code đang tắt
Chúc các bạn thành công.


Nguồn: xenforo.com​
 

Hướng dẫn sử dụng

XenForo 1 XenForo 2
Translate by PVS

Dịch vụ XenForo của VNXF

Mr. Tuấn

Mobile/Zalo: 0988 488 096

Telegram: bluekpro

Email: [email protected]

Nhà Tài Trợ

Mút Xốp Không Gian
pallet Thịnh Phát
Top Bottom