摘要
JQuery Content Directory 是一个Wordpress插件，它只能在 WordPress 2.7 或以上的版本下工作。是由jquery-table-of-contents插件增强制作而成。

该插件可以为你的博客文章自动生成一个文章目录置于文章的右上角，浏览者可以从文章目录了解到你的文章层次，以及可以快速跳转至感兴趣的段落进行阅读。

JQuery Content Directory

JQuery Content Directory 安装非常简单，上传激活即可，或者直接在 WordPress 后台安装，但是设置的时候需要一点Wordpress和css基础。 安装之后可以到 WordPress 后台 => 设置 => 自动文章目录设置 进行设置：

插件使用效果预览

是不是很漂亮呀？只要安装了 JQuery Content Directory，再经过简单的配置，你的博客也能拥有这样的功能哦。

设置文章目录定位

JQuery Content Directory需要设置你的博客主题对文章的定位，即需要告诉插件你的文章是在哪个标签之中的，以及你的文章是以哪个标签作为分段标识的：  比如我博客的文章是被限定在 .jquerycd .entry 标签中的，并且以 h2 标签作为分段标识，因此设置如下：

如何查看标签

有的朋友不知道怎么查看自己的文章是在博客主题的哪个标签中，那么你通过下面的步骤查找：

• WordPress 后台 => 外观 => 编辑 => single.php
• 找到
  这段代码，然后查看在它之前最近的标签的类名 class，比如我的如下图：

因此我的限定标签是 .jquerycd .entry

文章目录生成样式设置

JQuery Content Directory 支持用户自定义目录的样式，在后台可以设置目录的标题和通过修改CSS来控制目录样式：

比如目录标题我们设置为“我是标题”，那么最后结果显示为：

JQuery Content Directory 的CSS默认是通过 jquery-toc.css 文件来设定的，当然你也可以在style.css中自己定义一个新的CSS规则，只要符合如下格式即可。比如你可以在style.css中新增一个#newstyle 来设置目录样式：
/* 列表样式 */
#newstyle ul {
padding: 5px 0 0 14px;
margin:0px;
border-top:2px solid #050;
}

#newstyle ul a{
color:#050
}

/* 目录标题样式 */
#newstyle strong{
font-size:16px;
line-height:30px;
}

/* 显示/隐藏标签样式 */
#newstyle span {
margin-left:5px;
}

然后设置CSS名称为 newstyle

最终显示结果如下：