ZBlogPHP给文章增加一个动态目录

原创  郑建华   2020-06-13   193人阅读  9 条评论

前言    

    好像别人的网站文章,正文都有目录索引,这是一个好东西。特别是当文章篇幅足够长时,让文章结构更清晰,更加适合阅读。那如何给网站增加一个目录呢。本站是ZBlog程序搭建的,就介绍一种ZBlog的方法。下面一起来看看吧。

方法

 一、引入插件

打开应用中心,引入正文目录索引插件

image.png

二、配置插件

根据当前使用主题,配置正文区域类目以及索引标签

image.png

三、查看效果

查看文章效果,滚动条向上滚动时,左侧生成了目录结构

image.png

但是效果与我的预期有些不符,我想要文章打开后就生成目录结构,并且一直显示,而不是向上滚动显示目录,向下滚动隐藏目录,并且手机上同时显示了目录结构。

四、插件改造

1、打开网站根目录下的插件js,注释掉红框中的代码

image.png

2、打开网站根目录下的插件include.php文件,在jztest标签中,添加jzDown类名

image.png

3、在插件配置界面增加如下自定义CSS

image.png

@media (max-width: 768px){
    .jztagtree{
        opacity: 0 !important;
    }
}

五、改造后效果

pc端正常显示,且滚动后无影响

image.png

手机端,显示正常,无目录展示

image.png

结语

    除了要引入插件以及改造外,我们编写文章时,也需要按照格式来,否则目录还是没有办法动态生成目录的。

本文地址:https://www.zjh336.cn/?id=1855
版权声明:本文为原创文章,版权归 郑建华 所有,欢迎分享本文,转载请保留出处!

发表评论


表情

 评论列表

  1. 凹凸学社
    凹凸学社 【实习生】  @回复

    我靠,真是要什么来什么,我这几天正在想怎么让单页面跟百度百科一样能有这个功能就好了。

  2. 凹凸学社
    凹凸学社 【实习生】  @回复

    博主大神,如果我只想让单页面里面有这个功能,其他的文章页不需要,可以实现吗?

    • 郑建华
      郑建华 【站长】 2020-07-02 16:30:22  回复

      @凹凸学社理论上是能实现的,但是目前这个是zblog的插件,是基于全部文章的。要搞的话,可以参考插件,提取其中的js,单独做个功能

  3. 凹凸学社
    凹凸学社 【实习生】  @回复

    好的。感谢了!

  4. 凹凸学社
    凹凸学社 【实习生】  @回复

    跟你的站没办法比啊,我好久没更新了。因为个人原因公司破产了,现在都没时间更新了。

  5. 凹凸学社
    凹凸学社 【实习生】  @回复

    加油,继续更新!坚持下去总会有收获的。感觉你技能挺多的,去知乎混混!