Làm đẹp cho giao diện của các forum con Xenforo

nttruong

MasterCorporal
Tham gia
25/02/2015
Bài viết
368
Được Like
614
Bài viết này hướng dẫn các bạn cách làm đẹp cho giao diện của các forum con ở page forum_view của Xenforo.
Demo:


subforum-columns-png.49


Cách làm:

Thêm đoạn code sau vào template EXTRA.CSS:


Mã:
/* SUBFORUM COLUMNS */

.nodeList .node.level_2.node_15, .nodeList .node.level_2.node_18,
.nodeList .node.level_2.node_19, .nodeList .node.level_2.node_20,
.nodeList .node.level_2.node_21, .nodeList .node.level_2.node_22,
.nodeList .node.level_2.node_23, .nodeList .node.level_2.node_24 {
border: 1px solid #a5cae4;
border-radius: 3px;
display: inline-block;
margin: 5px 0;
width: 24%;
background-color: #e7f4fd;
}

.nodeList .node.level_2.node_15 .nodeLastPost, .nodeList .node.level_2.node_18 .nodeLastPost,
.nodeList .node.level_2.node_19 .nodeLastPost, .nodeList .node.level_2.node_20 .nodeLastPost,
.nodeList .node.level_2.node_21 .nodeLastPost, .nodeList .node.level_2.node_22 .nodeLastPost,
.nodeList .node.level_2.node_23 .nodeLastPost, .nodeList .node.level_2.node_24 .nodeLastPost { display:none; width: 0;}

.nodeList .node.level_2.node_15 .nodeText, .nodeList .node.level_2.node_18 .nodeText,
.nodeList .node.level_2.node_19 .nodeText, .nodeList .node.level_2.node_20 .nodeText,
.nodeList .node.level_2.node_21 .nodeText, .nodeList .node.level_2.node_22 .nodeText,
.nodeList .node.level_2.node_23 .nodeText, .nodeList .node.level_2.node_24 .nodeText
{ margin: 5px 0px 5px 10px; }

.nodeList .node.level_2.node_15 .nodeIcon, .nodeList .node.level_2.node_18 .nodeIcon,
.nodeList .node.level_2.node_19 .nodeIcon, .nodeList .node.level_2.node_20 .nodeIcon,
.nodeList .node.level_2.node_21 .nodeIcon, .nodeList .node.level_2.node_22 .nodeIcon,
.nodeList .node.level_2.node_23 .nodeIcon, .nodeList .node.level_2.node_24 .nodeIcon {display: none;}

.nodeList .node.level_2.node_15 .tinyIcon, .nodeList .node.level_2.node_18 .tinyIcon,
.nodeList .node.level_2.node_19 .tinyIcon, .nodeList .node.level_2.node_20 .tinyIcon,
.nodeList .node.level_2.node_21 .tinyIcon, .nodeList .node.level_2.node_22 .tinyIcon,
.nodeList .node.level_2.node_23 .tinyIcon, .nodeList .node.level_2.node_24 .tinyIcon {display: none;}

/* SUBFORUM COLUMNS */
Thay thế node_id tương ứng với các id của forum con site bạn là ok!

Chúc các bạn thành công!
 
  • Like
Reactions: THB

THB

Founder
Thành viên BQT
Tham gia
25/02/2015
Bài viết
6,646
Được Like
3,931
nếu muốn chia làm 2 cột hoặc 3 cột thì sao?
 

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

XenForo 1 XenForo 2
Translate by PVS

Dịch vụ XenForo của VNXF

Mobile/Zalo: 0906081284

Telegram: anhanhxf

Chỉ nhận web nội dung lành mạnh

Nhà Tài Trợ

Mút Xốp Không Gian
Mút Sofa Không Gian
Top Bottom