xenforo 子版面横排的方法

进入后台–语言及模板–编辑模板,打开Extra.css,在内容最下方添加:

.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%;
}

打开以下的模板:

  1. node_category_level_2
  2. node_forum_level_2
  3. node_link_level_2
  4. node_page_level_2

添加:

<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>

打开以下模板:

  1. node_category_level_n
  2. node_forum_level_n
  3. node_link_level_n
  4. node_page_level_n

在第一行的CLASS中,添加:

{xen:if $renderedChildren, ‘ fullWidth’}

例如:<li class=”node category level-n node_{$category.node_id}”>

更发为:<li class=”node category level-n node_{$category.node_id} {xen:if $renderedChildren, ‘fullWidth’}”>

XenForo默认图片库中没有read.png这个文件,需要下载后上传至@imagePath/xenforo/widgets目录中

也可以直接点击右边的图片,目标另存为即可:   或者点击此处下载

效果见:http://www.drymt.com

 

Tags:
shuxin

发表评论

电子邮件地址不会被公开。 必填项已用*标注