Hướng dẫn làm sub forum tùy biến trong xenforo

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,829
Được Like
12,687
Hôm nay mình sẽ hướng dẫn các bạn chỉnh sửa css để tùy biến hiện thị sub forum đẹp đối với xenforo.
Cách làm khá đơn giản.

Đầu tiên bạn vào admin, chọn template đang sử dụng và thêm đoạn css sau vào "EXTRA.css"
Mã:
.subForumsGrid { padding-right: 4px; }
.subForumsGrid .blockLinksGrid { width: 100%; display: inline-block; padding: 5px; }
.subForumsGrid .fullWidth { width: 100% !important; padding-bottom: 4px; }
.subForumsGrid .node { width: 20%; float: left; }
.subForumsGrid .node ol { padding-left: 10px; }
.subForumsGrid .node  a { padding: 5px 10px 5px 18px; }
.subForumsGrid .node .node a { padding: 0px 10px 1px 18px; }
.subForumsGrid .node .nodeTitle { font-size: 11px; white-space: nowrap; overflow: hidden; }
.subForumsGrid .node div,
.subForumsGrid .node div a:hover
{
background-image: url('@imagePath/xenforo/widgets/read.png');
background-repeat: no-repeat;
background-position: 0px 50%;
}
.subForumsGrid .node div.unread,
.subForumsGrid .node div.unread a:hover
{
background-image: url('@imagePath/xenforo/widgets/unread.png');
background-repeat: no-repeat;
background-position: 0px 50%;
}

Tiếp theo thêm vào dưới cùng 4 template
  1. node_category_level_2
  2. node_forum_level_2
  3. node_link_level_2
  4. node_page_level_2
Mã:
<xen:if is="{$level} == 2 AND {$renderedChildren}">
<li class="subForumsGrid">
<ol class="secondaryContent blockLinksList blockLinksGrid">
<xen:foreach loop="$renderedChildren" value="$child">
{xen:raw $child}
</xen:foreach>
</ol>
</li>
</xen:if>

Và cuối cùng, vào template sau
  1. node_category_level_n
  2. node_forum_level_n
  3. node_link_level_n
  4. node_page_level_n
thêm vào sau dòng đầu tiên
Mã:
{xen:if $renderedChildren, ' fullWidth'}


Nguồn: muaban47.net​
 
  • Like
Reactions: THB

tpoclub

Corporal
Tham gia
07/03/2015
Bài viết
115
Được Like
100
Cảm ơn bác đã chia sẻ cho mn! Mình nghĩ với mỗi bài viết của mình, bác nên demo thêm bằng 1 hay 2 hình ảnh sẽ trực quan và thân thiện đến anh em tìm hiểu hơn. Thân mến! jhgjdl;gdfgl;d
 
  • Like
Reactions: THB

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,829
Được Like
12,687
Cảm ơn bác đã chia sẻ cho mn! Mình nghĩ bác nên demo thêm bằng 1 hay 2 hình ảnh sẽ trực quan và thân thiện đến anh em tìm hiểu hơn. Thân mến! jhgjdl;gdfgl;d
Ok bạn, để mình làm :D
 

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,829
Được Like
12,687
0untitled.PNG


untitled.PNG
 

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