WordPress 文章目录插件:自动生成目录+侧边栏固定(Easy Table of Contents 教程)

这是一篇完整的「WordPress文章目录」插件完整教程,我们将使用「 Easy Table of Contents 」这款插件,在 WordPress 文章,自动生成大纲目录。

在文章加入索引目录,站在读者角度,可让他们在阅读前,迅速掌握文章重点,快速找到想看的段落,优化用户体验。

站长角度,新增 WordPress文章目录,妥善运用标题标签(H1、H2、H3 等 .. ),可更方便 Google 爬虫抓取网站内容,有助提升 SEO 排名! 更多 WordPress SEO 插件推荐。

制作「WordPress文章目录 」后,还可使用「Q2W3 Fixed Widget for WordPress」插件,将文章目录固定在侧边栏,读者就不用回到文章最顶端,才能找到想看的章节。

本文章节如下。

  • 1. Easy Table of Contents 是什么?
  • 2. Easy Table of Contents 安装启用+设定
  • 3. 目录基础设定+外观修改
  • 4. 添加文章目录
  • 5. 添加+固定侧边栏目录(额外分享)
  • 常见问题

1. Easy Table of Contents 是什么?

WordPress 目录插件:Easy Table of Contents

Easy Table of Contents 是一款优质的 WordPress文章目录插件,可在任何地方(文章、页面等 .. )自动生成目录。

新增文章后,站长可能会需要新增索引目录,方便读者阅读、搜索章节内容。 有了目录,也更方便 Google 爬虫抓取内容,有助于提升 SEO 排名。

Easy Table of Contents 会抓取文章中的标题标签,自动生成目录,对于网站文章较多的站长来说,非常方便。 更多 WordPress 插件推荐清单。

同时后台已有中文版本,对于英文不好的站长来说,是一款容易上手的插件。


2. Easy Table of Contents 安装+启用

这个章节,我们会安装+启用 Easy Table of Contents 插件。

前往 WordPress 后台 > 安装插件 > 搜索「 Easy Table of Contents 」插件,安装+启用。

WordPress 文章目录插件:安装+启用 Easy Table of Contents

3. 目录基础设定+外观修改

Easy Table of Contents 安装+启用完成后,我们就可以进行基础设定:)

前往 WordPewss 设置 > 内容目录,即可进入 Easy Table of Contents 的设置页面。

小备注:本文以生成文章目录为范例,若需生成其他类型目录,也可参考下方教程做设定。

常见设置

第一个块,我们会先看到「 常规设置」。 将启用目录内容类型 、 自动插入内容目录的内容类型 」勾选文章类别。

显示位置可依据站长习惯调整,这边我维持预设,设定在内文第一个标题前也就是跟本文一样的形式。

WordPress 文章目录插件:更改生成目录类型为“ 文章 ”

接着往下滑,我们变更显示条件为 1,这样文章中标题数只要为 1 个以上(含 1 个)时,便会自动生成目录,就比较不会因为有条件不足,而看不到目录的问题。

我们可选择是否显示目录标题,调整标题为中文字。 其余项目可依照站长需求进行调整。

WordPress 文章目录插件:更改显示条件、设定标题标签

内容目录外观

接着下滑,第二个区块可以调整目录的外观样式,像是:宽度、对齐方式、字体大小 / 粗细等 .. 设定。

最后的「外观样式」选项,先选「自定义」才能自由修改颜色样式

WordPress 文章目录插件:选中“ 自定义 ”选项

下滑可以看到颜色修改选项,可更改项目如下:

WordPress 文章目录插件:修改目录颜色样式

高级设置

这个区块可对目录表单进行更多细项修改。

我们先将锚点小写、使用连字号选项选选,接着往下的标题层级,全部选选。

另外,站长可自行决定哪些标题层级将会被 Easy Table of Contents 插件,给自动收录到目录列表中(这个依自己需求调整即可)。

WordPress 文章目录插件:勾选“ 锚点小写 、 使用连字号 、 标题级别 ”

往下可以设定生成目录时,自动被系统排除的标题。

可以参照 Easy Table of Contents 说明,加入「 * 」或「 | 」 符号,进行标题排除。

WordPress 文章目录插件:生成目录时,排除的标题

4. 添加文章目录

基础设定完成后,下一步就是在文章上新增目录。

新增文章

前往 WordPress 后台 > 文章 > 添加文章。

WordPress 文章页面 :新增 WordPress 文章
新增 WordPress文章

在这边,我们依序输入文章标题、内容。

特殊需求:指派标题层级

在上个章节的进阶设定,我们已勾选全部标题层级,让 Easy Table of Contents 插件去判读这些标题层级,来自动生成目录。

如果有特别需求(例如:希望单一文章目录只显示 H2 标题,不显示 H3 标题),可以参考下图设定。

滑到你的文章下方,找到想显示的标题层级分别勾选即可(这边的优先级别比较高)。

WordPress 文章目录插件:指派子标题层级

小备注:若没有特殊需求的站长,上图可以不用特别勾选,因为只要在 Easy Table of Contents 进阶设定中,有勾选标题层级,插件就会判读该文章有哪些文章标题是需抓取的,而自动产生目录啰!

文章目录上线

发布、更新文章后,到前台刷新检查,会发现文章目录已被自动抓取!

成功自动生成文章目录~

除了在文章中生成标题,我们也能将文章目录新增+固定于侧边栏。

这样的好处是,当访客下滑阅读长文时,可随时从侧边栏目录点击想看的段落,不用再上滑寻找。

本章节,会带领大家新增侧边栏目录,并使用Q2W3 Fixed Widget for WordPress 固定小工具插件,来帮助侧边栏目录固定在文章中。 用简单几个步骤完成!

Step1:新增文章目录至侧边栏

前往 WordPress 后台 > 外观 > 小工具,搜索「 内容目录 」并加入到 Main Sidebar 侧边栏,然后修改标题、颜色等 ..,最后储存设定。

WordPress 文章目录插件:将“ 内容目录 ”小工具新增至侧边栏

前往前台文章刷新检查,发现侧边栏目录新增成功啰~

成功新增侧边栏目录~

小备注:本文使用 WordPress 新版区块小工具 进行教程,若想使用传统小工具,可安装 Classic Widgets(传统小工具)插件,参考相关内容学习唷:)

Step2:安装 Q2W3 插件

前往 WordPress 后台 > 安装插件 > 搜索 Q2W3 Fixed Widget for WordPress 插件,安装+启用。

WordPress固定小工具插件安装+启用

Step3:勾选固定目录在侧边栏上

安装插件后,我们回到 WordPress 外观 > 小工具,点击“ 内容目录 ”,勾选“ 固定这个小工具 ”选项,进行储存。

WordPress 文章目录插件:选择“ 固定这个小工具 ”选项

Step4:显示成果一览

前往前台文章,上下滚动测试,发现侧边栏目录固定成功啰~

成功固定 WordPress侧边栏目录~

常见问题

如何制作 WordPress文章目录?

使用 Easy Table of Contents 插件,即可自动抓取文章中的标题标签(如:H1、H2、H3 等 .. ),并生成目录,对于文章内容庞大的站长来说,是一款优质的「 WordPress 文章目录 」生成插件。

除此之外,还能修改目录样式外观,使样式更贴近网站设计风格唷。 更多 Logo 设计+网站配色分享。

为什么要制作 WordPress文章目录?

在文章加入索引目录,可让读者迅速掌握文章重点,快速找到想看的段落,优化用户体验。

将标签标题汇整成目录,会更方便 Google 爬虫获取网站内容,可有效提升文章的 SEO 排名。

如何将文章目录新增+固定在侧边栏?

将目录新增至侧边栏,可前往 WordPress 外观 > 小工具,找到「 内容目录 」小工具,新增至 Main Sidebar(主要侧边栏)即可。

新旧版小工具的新增大同小异,可参考文章+影片同时学习。 更多 WordPress 新版区块小工具教程。

最后,使用 Q2W3 Fixed Widget for WordPress 工具固定插件,即可将目录固定至侧边栏中,上下滚动时,读者便可在侧边栏搜寻想看的段落。

发表评论