- Tham gia
- 28/02/2015
- Bài viết
- 16,410
- Được Like
- 12,633
Change default FA node icon - Thay đổi biểu tượng Node FA mặc định của XenForo 2
Bạn muốn thay đổi biểu tượng node Font Awesome mặc định của mình thành như thế này không?
Node đã xem
Node chưa xem
Để thay đổi một biểu tượng node bằng một biểu tượng Font Awesome khác, hãy thêm đoạn code sau vào template Extra.less của bạn:
Thay X bằng ID node của bạn.
Nếu node của bạn là một categoy, page hoặc link, hãy thay đổi .node--forum thành .node--category, .node--page hoặc .node--link
Để thay đổi biểu tượng Font Awesome, hãy thay đổi dot-circle (ở ví dụ trên) thành bất kỳ tên biểu tượng khác.
Để thêm một biểu tượng Font Awesome khác cho node chưa đọc, hãy thêm .m-faContent(@fa-var-exclamation-circle); bên dưới đoạn .node-icon i:before {.
Cách để thay đổi biểu tượng node có cùng hình ảnh cho tất cả các node và category:
Thêm đoạn code này vào template Extra.less của bạn:
Để thay đổi biểu tượng Font Awesome, hãy thay đổi dot-circle (ở ví dụ trên) thành bất kỳ tên biểu tượng khác.
Để thêm một biểu tượng Font Awesome khác cho node chưa đọc, hãy thêm .m-faContent(@fa-var-exclamation-circle); bên dưới đoạn .node-icon i:before {.
Bạn muốn một biểu tượng Pro cho 1 style cụ thể?
Chỉnh sửa .m-faBase(); và thay nó bằng .m-faBase('Pro', @faWeight-solid);, .m-faBase('Pro', @faWeight-regular); hoặc .m-faBase('Pro', @faWeight-light);.
Bạn muốn một biểu tượng Brand?
Chỉnh sửa .m-faBase(); và thay nó bằng .m-faBase('Brands');.
Chúc các bạn thành công.
Bạn muốn thay đổi biểu tượng node Font Awesome mặc định của mình thành như thế này không?
Node đã xem
Node chưa xem
Mã:
/*** Change default FA node icon **/
.node.node--idX {
&.node--forum {
.node-icon i:before {
.m-faBase();
.m-faContent(@fa-var-dot-circle);
}
&.node--read .node-icon i:before {
opacity: 0.4;
}
}
}
/*****/
Thay X bằng ID node của bạn.
Nếu node của bạn là một categoy, page hoặc link, hãy thay đổi .node--forum thành .node--category, .node--page hoặc .node--link
Để thay đổi biểu tượng Font Awesome, hãy thay đổi dot-circle (ở ví dụ trên) thành bất kỳ tên biểu tượng khác.
Để thêm một biểu tượng Font Awesome khác cho node chưa đọc, hãy thêm .m-faContent(@fa-var-exclamation-circle); bên dưới đoạn .node-icon i:before {.
Cách để thay đổi biểu tượng node có cùng hình ảnh cho tất cả các node và category:
Thêm đoạn code này vào template Extra.less của bạn:
Mã:
/*** Change default FA node icon **/
.node {
&.node--forum, &.node--category {
.node-icon i:before {
.m-faBase();
.m-faContent(@fa-var-dot-circle);
}
&.node--read .node-icon i:before {
opacity: 0.4;
}
}
}
/*****/
Để thay đổi biểu tượng Font Awesome, hãy thay đổi dot-circle (ở ví dụ trên) thành bất kỳ tên biểu tượng khác.
Để thêm một biểu tượng Font Awesome khác cho node chưa đọc, hãy thêm .m-faContent(@fa-var-exclamation-circle); bên dưới đoạn .node-icon i:before {.
Bạn muốn một biểu tượng Pro cho 1 style cụ thể?
Chỉnh sửa .m-faBase(); và thay nó bằng .m-faBase('Pro', @faWeight-solid);, .m-faBase('Pro', @faWeight-regular); hoặc .m-faBase('Pro', @faWeight-light);.
Bạn muốn một biểu tượng Brand?
Chỉnh sửa .m-faBase(); và thay nó bằng .m-faBase('Brands');.
Chúc các bạn thành công.
Nguồn: xenforo.com
Bài viết liên quan
Bài viết mới