Tutorial 2x Node icons with image - Biểu tượng Node bằng hình ảnh cho XenForo 2

Bài Viết Mới

PVS

Generalissimo
Thành viên BQT
Node icons with image - Biểu tượng Node bằng hình ảnh cho XenForo 2

Bạn có muốn thay đổi biểu tượng node Font Awesome mặc định của mình bằng hình ảnh như thế này không?

Screenshot 2019-11-09 at 11.51.00.png

Node đã xem

Screenshot 2019-11-09 at 11.51.11.png

Node chưa xem
Để thay đổi biểu tượng node bằng hình ảnh, hãy thêm đoạn code sau vào template Extra.less của bạn:
Mã:
/*** Node icons with image **/
.node.node--idX {
    .node-icon i { display: none; }

    &.node--forum {
        .node-body {
            /*padding-left: 5px;*/
        }
        .node-icon {
            background-image: url('/images/your_image.png');
            background-repeat: no-repeat;
            background-position: center;
            background-size: contain;
        }
        &.node--read .node-icon {
            opacity: 0.4;
        }
    }
}
/*****/

Thay X bằng ID node của bạn.

Thay /images/your_image.png bằng vị trí hình ảnh 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

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ã:
/*** Node icons with image **/
.node {
    .node-icon i { display: none; }

    &.node--forum, &.node--category {
        .node-body {
            /*padding-left: 5px;*/
        }
        .node-icon {
            background-image: url('/images/your_image.png');
            background-repeat: no-repeat;
            background-position: center;
            background-size: contain;
        }
        &.node--read .node-icon {
            opacity: 0.4;
        }
    }
}
/*****/

Thay /images/your_image.png bằng vị trí hình ảnh của bạn.

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

Hỗ trợ trực tuyến

Support Quảng cáo
Mr. San (PVS)

Skype chat, instant message

Mr. Tuấn (Blue)

Skype chat, instant message

Mr. Tuấn
0988 488 096
Mr. Trọng
0906 081 284
kinhdoanh@vnxf.vn

Nhà Tài Trợ

Mút Xốp Không Gian
pallet Thịnh Phát
Điện Lạnh Thịnh Phát
Top