Typecho 主题集成文章目录功能

18/03/201918:39:12
评论
224

Typecho添加主题目录的教程好像不是很多,而且我找到的仅有的几个都是前台JS实现的,总感觉这样不如后台实现来的好。既然Typecho找不到现成的,只好“曲线救国”,由于实现文章目录的原理是通用的,所以就去WP里找了,那可是大把大把的。

function createCatalog($obj) {    //为文章标题添加锚点
    global $catalog;
    global $catalog_count;
    $catalog = array();
    $catalog_count = 0;
    $obj = preg_replace_callback('/<h([1-6])(.*?)>(.*?)<\/h\1>/i', function($obj) {
        global $catalog;
        global $catalog_count;
        $catalog_count ++;
        $catalog[] = array('text' => trim(strip_tags($obj[3])), 'depth' => $obj[1], 'count' => $catalog_count);
        return '<h'.$obj[1].$obj[2].'><a name="cl-'.$catalog_count.'"></a>'.$obj[3].'</h'.$obj[1].'>';
    }, $obj);
    return $obj;
}

function getCatalog() {    //输出文章目录容器
    global $catalog;
    $index = '';
    if ($catalog) {
        $index = '<ul>'."\n";
        $prev_depth = '';
        $to_depth = 0;
        foreach($catalog as $catalog_item) {
            $catalog_depth = $catalog_item['depth'];
            if ($prev_depth) {
                if ($catalog_depth == $prev_depth) {
                    $index .= '</li>'."\n";
                } elseif ($catalog_depth > $prev_depth) {
                    $to_depth++;
                    $index .= '<ul>'."\n";
                } else {
                    $to_depth2 = ($to_depth > ($prev_depth - $catalog_depth)) ? ($prev_depth - $catalog_depth) : $to_depth;
                    if ($to_depth2) {
                        for ($i=0; $i<$to_depth2; $i++) {
                            $index .= '</li>'."\n".'</ul>'."\n";
                            $to_depth--;
                        }
                    }
                    $index .= '</li>';
                }
            }
            $index .= '<li><a href="#cl-'.$catalog_item['count'].'">'.$catalog_item['text'].'</a>';
            $prev_depth = $catalog_item['depth'];
        }
        for ($i=0; $i<=$to_depth; $i++) {
            $index .= '</li>'."\n".'</ul>'."\n";
        }
    $index = '<div id="toc-container">'."\n".'<div id="toc">'."\n".'<strong>文章目录</strong>'."\n".$index.'</div>'."\n".'</div>'."\n";
    }
    echo $index;
}

使用方法

1、把上面的代码放到主题文件functions.php最后一行之前

2、继续在functions.php内搜索关键词function themeInit

如果有themeInit这个函数,则在themeInit这个函数内添加下面的代码

if ($archive->is('single')) {
    $archive->content = createCatalog($archive->content);
}

如果没有themeInit这个函数,则在functions.php最后一行之前添加下面的代码

function themeInit($archive) {
    if ($archive->is('single')) {
        $archive->content = createCatalog($archive->content);
    }
}

3、最后在需要输出文章目录的位置调用<?php getCatalog(); ?>即可

这是通用的方法,具体到每个人使用时,可以根据自己的需求修改,不再赘述。

Typecho 响应式博客主题 Echo 未分类

Typecho 响应式博客主题 Echo

Echo主题简介一套基于layui框架的Typecho主题Echo,主题名取自博客域名(www.echo.so)。主题极简美观,并进行了响应式布局,使博客在手机和平板电脑上也有更好的浏览阅读体验。主题...
Typecho 漂亮的单栏主题 Aria 未分类

Typecho 漂亮的单栏主题 Aria

主题简介书写属于自己的篇章,一款简洁漂亮的单栏Typecho博客主题Aria,具体样式大家可以看底部下载部分的作者演示站,总的来说算是一个功能比较完整的主题了,最主要是作者更新的相对来说比较勤。主题预...
Typecho 简约大图封面主题 Cola 未分类

Typecho 简约大图封面主题 Cola

主题简介这是由网友@可乐投稿的作品,主题采用了大图封面的单栏设计,整体看上去比较干净,不过该主题可以优化的细节之处还有很多,比如:1.评论样式有点粗糙 2.配色有点不够统一,特别是按钮触发的部分 3....
Typecho程序伪静态规则大全 开发日志

Typecho程序伪静态规则大全

Typecho程序的伪静态规则不同于wp直接默认可用,需要我们手工加载到空间中才可以生效。这里TypechoTips整理了一些不同的主机环境中的伪静态规则,希望对大家有所帮助!1、Linux Apac...
匿名

发表评论

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: