Hướng dẫn hiển thị diễn đàn con - Sub Categories in Columns Xenforo 1.2

[Admin]

Cài đặt :

Bước 1: Vào templates node_forum_level_2
Tìm

<xen:if is="{$renderedChildren} AND {$level} == 2 AND @nodeListSubForumPopup">

  <div class="Popup subForumsPopup">

  <a href="{xen:link forums, $forum}" rel="Menu" class="cloaked" data-closemenu="true"><span class="dt">{xen:phrase sub_forums}:</span> {xen:number $forum.childCount}</a>



  <div class="Menu JsOnly subForumsMenu">

  <div class="primaryContent menuHeader">

  <h3>{$forum.title}</h3>

  <div class="muted">{xen:phrase sub_forums}</div>

  </div>

  <ol class="secondaryContent blockLinksList">

  <xen:foreach loop="$renderedChildren" value="$child">

  {xen:raw $child}

  </xen:foreach>

  </ol>

  </div>

  </div>

  </xen:if>

- Thay bằng

<xen:if is="{$renderedChildren} AND {$level} == 2 AND @nodeListSubForumPopup">

  <div class="subForumsPopup">

  <div class="subForumsMenu">

  <ol class="secondaryContent blockLinksList">

  <xen:foreach loop="$renderedChildren" value="$child">

  {xen:raw $child}

    </xen:foreach>

    </ol>

    </div>

    </div>

  </xen:if>

Bước 2: Vào templates node_category_level_2
Tìm

<xen:if is="{$renderedChildren} AND @nodeListSubForumPopup">

  <div class="Popup subForumsPopup">

  <a href="{xen:link categories, $category}" rel="Menu" class="cloaked" data-closemenu="true"><span class="dt">{xen:phrase sub_forums}:</span> {xen:number $category.childCount}</a>



  <div class="Menu JsOnly subForumsMenu">

  <div class="primaryContent menuHeader">

  <h3>{$category.title}</h3>

  <div class="muted">{xen:phrase sub_forums}</div>

  </div>

    <ol class="secondaryContent blockLinksList">

  <xen:foreach loop="$renderedChildren" value="$child">

  {xen:raw $child}

  </xen:foreach>

  </ol>

  </div>

  </div>

  </xen:if>

- Thay bằng

<xen:if is="{$renderedChildren} AND @nodeListSubForumPopup">

  <div class="subForumsPopup">

  <div class="subForumsMenu">

  <ol class="secondaryContent blockLinksList">

  <xen:foreach loop="$renderedChildren" value="$child">

  {xen:raw $child}

  </xen:foreach>

  </ol>

  </div>

  </div>

</xen:if>

Bước 3: Vào template node_forum_level_n.
- Thay thế tất cả nội dung trong template này bằng

<li class="node forum level-n node_{$forum.node_id}">

  <span class="dot"><span></span></span>

  <div {xen:if $forum.hasNew, 'class="unread"'}>

  <h4 class="nodeTitle"><a href="{xen:link forums, $forum}" class="menuRow">{$forum.title}</a></h4>

  </div>

  <xen:if is="{$renderedChildren}">

  <ol>

  <xen:foreach loop="$renderedChildren" value="$child">

  {xen:raw $child}

  </xen:foreach>

  </ol>

  </xen:if>

</li>

Bước 4: Vào template node_category_level_n.
- Thay thế tất cả nội dung template trên bằng:

<li class="node category level-n node_{$category.node_id}">

  <span class="dot"><span></span></span>

  <div {xen:if $category.hasNew, 'class="unread"'}>

  <h4 class="nodeTitle"><a href="{xen:link categories, $category}" class="menuRow">{$category.title}</a></h4>

  </div>

  <xen:if is="{$renderedChildren}">

  <ol>

  <xen:foreach loop="$renderedChildren" value="$child">

  {xen:raw $child}

  </xen:foreach>

  </ol>

  </xen:if>

</li>

Bước 5: Vào template EXTRA.css.

- Thêm vào đoạn code sau (Chú ý: đưa ảnh "green-star.gif" vào đúng đường dẫn)

.subForumsPopup,

.subForumsPopup .blockLinksList,

.subForumsPopup ol,

.subForumsMenu ol li ol li

{
width: 100%;
}

.subForumsPopup .blockLinksList
{
  float: left;
}

.subForumsPopup .dot {

  float: left;

  position: relative;
}

.subForumsPopup .dot span {

  background: url("link ảnh") scroll 0 0 transparent;

  height: 9px;

  margin-left: 5px;

  margin-top: 8px !important;

  position: absolute;

  width: 9px;
  }

.subForumsMenu ol li
{
  width: 50%;
  float: left;
}

.subForumsMenu .node .nodeTitle a
{
  padding-left: 16px;
}

.subForumsMenu .node .node.level-n
{
  display: none;
}

Lưu lại là xong
Chúc các bạn thành công!