在類別中: 款式
鏈接到本文: 全選
代碼: 選擇全部
[url=http://www.phpbb.com/support/docs/en/3.3/kb/article/simple-side-bars-in-prosilver+prosilver-se/]Knowledge Base - Simple side bars in Prosilver & Prosilver_SE[/url]
首先在/ styles / your_style / template文件夾中創建sidebar.html文件,然後在指示的位置添加所需的任何代碼。sidebar.html的示例保留了樣式功能,並具有三個框,您可以根據需要刪除或添加框:
sidebar.html
代碼: 選擇全部
<!-- This is the start of the first sidebar box -->
<div class="forabg">
<div class="inner"><span class="corners-top"><span></span></span>
<ul class="topiclist">
<li class="header">
<dl class="icon">
<dt>First box</dt>
</dl>
</li>
</ul>
<ul class="topiclist forums" style="padding: 0.05cm">
<!-- Code here for the first box -->
</ul>
<span class="corners-bottom"><span></span></span></div>
</div>
<!-- This is the end of the first sidebar box -->
<!-- This is the start of the second sidebar box -->
<div class="forabg">
<div class="inner"><span class="corners-top"><span></span></span>
<ul class="topiclist">
<li class="header">
<dl class="icon">
<dt>Second box</dt>
</dl>
</li>
</ul>
<ul class="topiclist forums" style="padding: 0.05cm">
<!-- Code here for the second box -->
</ul>
<span class="corners-bottom"><span></span></span></div>
</div>
<!-- This is the end of the second sidebar box -->
<!-- This is the start of the third sidebar box -->
<div class="forabg">
<div class="inner"><span class="corners-top"><span></span></span>
<ul class="topiclist">
<li class="header">
<dl class="icon">
<dt>Third box</dt>
</dl>
</li>
</ul>
<ul class="topiclist forums" style="padding: 0.05cm">
<!-- Code here for the third box -->
</ul>
<span class="corners-bottom"><span></span></span></div>
</div>
<!-- This is the end of the third sidebar box -->
打開styles / your_style / template / overall_footer.html並找到:
碼: 全選
代碼: 選擇全部
<div id="page-footer">
<div class="navbar">
代碼: 選擇全部
<div class="page-sidebar">
<!-- INCLUDE sidebar.html -->
</div>
注意:代碼位於total_footer.html中的原因是,我想在呈現論壇之後加載邊欄,您可以將其放置在任意位置。
打開styles / your_style / theme / common.css並找到:
代碼: 選擇全部
#page-body {
margin: 4px 0;
clear: both;
}
代碼: 選擇全部
#page-body {
margin: 4px 0;
clear: both;
width:85%;
float:right;
}
代碼: 選擇全部
#page-body {
margin: 4px 0;
clear: both;
width:85%;
float:left;
}
代碼: 選擇全部
float:auto
碼: 全選
代碼: 選擇全部
.page-sidebar {
float:left;
margin-top:4px;
width:14%;
}
代碼: 選擇全部
.page-sidebar {
float:right;
margin-top:4px;
width:14%;
}
您可以使用寬度來調整大小,只需更改百分比即可。而不是85%,您可以使其達到80%,等等。