建站教程

建站教程

Products

当前位置:首页 > 建站教程 >

WordPress主题开发教程十一:模板侧边栏

GG网络技术分享 2025-03-18 16:09 0


这一篇我们主要讲解 WordPress 主题的侧边栏,让你很快掌握它的结构,并能编码和样式化它。

在开始侧边栏之前,这是现在 index.php 文件的样子。

第1步:创建 id 为 sidebar 的 DIV

首先让我们创建一个名字为sidebar的 DIV,这样可以把侧边栏中的所有东西都放入其中。在container的后面和标签的前面输入以下代码:

第2步:给侧边栏的 DIV 添加无序列表

在新的sidebar的 DIV 标签中创建一个新的无序列表。

    – 开始无序列表
– 结束无序列表

第3步:给这个无序列表添加原属

增加一个列表元素(LI)到无序列表(UL)的中间并把一个子标题添加到这个列表中。

注意添加制表符到

  • 标签之前为了代码缩进。

  • – 开始列表元素

    – 开始子标题– 输出字符Categories

    – 结束子标题
  • – 结束列表条目

    保存index.php文件并未刷新浏览器。现在应该可以看到Categories子标题结构应该是这样:

    子标题前面的小圆点指明这个子标题是在一个列表元素中(LI)。如果无序列表(UL)有两个列表元素,那么将有两个小点。

    第4步:添加分类链接列表

    在列表条目中添加下面的代码:

    这里是上面代码的解释:

      – 开始另一个无序列表– 调用分类链接列表
    – 结束无序列表

    保存并刷新浏览器。下面是分类链接列表的样子:

    默认的分类是Uncategorized。如果你没有把日志发布到多个分类下面,那么你的列表链接列表应该是只有一个链接 Uncategorized。

    更进一步地解释道:

    • sort_column=name– 把分类按字符顺序排列
    • optioncount=1– 显示每个分类含有的日志数
    • hierarchial=0– 不按照层式结构显示子分类,这就解释了为什么子分类链接是列在列表中的第一级。
    标签:

    提交需求或反馈

    Demand feedback