为wordpress文章添加目录 方便阅读文章

目 录

在阅读文章的时候,有个目录来导航,相信还是很方便阅读的,所以本站也弄了这么一块,特别是长点的文章,导航还是很有必要的

在functions.php中添加创建目录的函数

代码中的目录标签你要以自行定义,本站用的是h3标签

在main.js中添加以下代码

当点击目录时,能平滑移动到相应的位置,添加了一个样式:smooth

添加目录所需要的样式

样式根据自己的网站风格设置就是。

添加目录入口

本站显示目录是放在右下侧导航上的,以下代码是显示目录与点击目录上隐藏按钮的JS

使用文章目录

要想在文章中能显示目录,在发表文章时,要含有目录标签,如本站的是h3,那要写文章时,要有h3标签的标题。最终显示效果如下: