动手打造你自己的Wordpress Template and Themes (主题, 模板) Part 5 – 侧边栏篇

七月 12th, 2009

动手打造你自己的WordPress Template and Themes (主题, 模板) Part 5 – 侧边栏篇

动手打造你自己的Wordpress Template and Themes (主题, 模板) Part 5 – 侧边栏篇

Part 1 – 布局 (The Layout)
Part 2 – 标头 (Heaer)
Part 3 – 索引 (Index)
Part 4 – 评论 (Comment)
Part 5 – 侧边栏 (Sidebar)
Part 6 – 底部 (Footer)
Part 7 – 结束语 (Finish!)

关于侧边栏，我们有一些Wordpress标签可以使用，例如显示“页面”、“目录”、“文章”等等。。

首先我们将放一些无序的列表让我们的侧边栏更好管理，我的意思是这样的：

在侧边栏ID，我们将使用<ul>和<li>像这样：

1.
2.      <div id=”sidebar”>
3.       <ul>
4.        <li>
5.         our sidebar content goes here 我们的侧边栏内容会在这里
6.        </li>
7.       </ul>
8.      </div> <!** close sidebar –>
9.

因为我们可以用CSS来控制，所以最好看起来像这样：

1.
2.      <div id=”sidebar”>
3.       <ul>
4.        <li>
5.
6.         <h2>sidebar title</h2>
7.          <ul>
8.           <li>sidebar link1</li>
9.           <li>sidebar link2</li>
10.           <li>sidebar link3</li>
11.          </ul>
12.
13.        </li>
14.       </ul>
15.      </div> <!– close sidebar –>
16.

这样我们可以让每一个部分有自己的标题和内容，例如：我们让网页目录像这样表现：

1.
2.      <div id=”sidebar”>
3.       <ul>
4.        <li>
5.
6.         <h2>Categories</h2>
7.                <ul><BR><?phpwp_list_cats(’sort_column=name&optioncount=1&hierarchical=0′); ?>
8.          </ul>
9.
10.        </li>
11.       </ul>
12.      </div> <!– close sidebar –>
13.

有些人也许注意到，我并没有用<li>来标注目录(Categories)，这是因为Wordpress已经自动使用了<li>和</li>，所以我们不用再次使用<li> (Sulow注：不是已经用了？)

还有一些Wordpress语句可以用在侧边栏：

<?php wp_get_archives(’type=monthly’); ?>
- 显示阅读文章

<P><?phpwp_list_cats(’sort_column=name&optioncount=1&hierarchical=0′); ?>
- 显示网页目录

<?php get_links_list(); ?>
- WordPress自定义的连接

你可以在这里找到跟多有用的语句，WordPress Template Tags .

这是一些我建立的侧边栏代码，可以用在你的sidebar.php里

1.
2.      <div id=”sidebar”>
3.       <ul>
4.        <li>
5.
6.          <?phpwp_list_pages(’sort_column=menu_order&title_li=<h2>Pages</h2>’ ); ?>
7.
8.       <li>
9.       <h2>Archives</h2>
10.        <ul>
11.         <?php wp_get_archives(‘type=monthly’); ?>
12.        </ul>
13.       </li>
14.
15.       <li>
16.       <h2>Categories</h2>
17.            <ul><BR><?phpwp_list_cats(’sort_column=name&optioncount=1&hierarchical=0′); ?>
18.        </ul>
19.       </li>
20.
21.        </li>
22.       </ul>
23.      </div> <!– close sidebar –>
24.