Next.Mist for Typecho 模板发布

以前一直想换一个简洁大方不花哨的博客主题,Typecho 默认主题显得太简陋了一点。用过一段时间的 cho 的 Maupassant 和 Navy 主题,不久之后我便开始审美疲劳了,后来有一天我在 v2ex 上看到了IIssNan 分享了他的 Next 主题 ,看到它的第一眼我就喜欢上了。似乎有那么一种“这就是我要的滑板鞋”的既视感,只可惜它只能用在 Hexo 上。后来 IIssNan 发布了这个主题的另外一个样式:Mist Scheme(就是本站现在用的的这个)感觉它似乎更加地适合我。

于是我便开始着手把它移植到 Typecho 上,过程说起来并不复杂,就是写 php 生成 html 结构的代码,再套上 Next 主题的 css 样式和 js 脚本就ok了,不过这玩意儿细节还是挺多的,所以我花了好多个周末才基本完成(毕竟高三dog也没啥空)。

在主题移植过程中我参考了许多人的代码,原本Next主题只支持多说评论,我把 Navy 的主题的评论样式略微修改了下,感觉它和 Next 的契合度还可以,实现了原生评论的功能。Next 主题文章页自带文章目录的功能,文章目录一般需要在后台生成,然而 Typecho 似乎并没这样的 api,而且我感觉文章输出前后台各种解析html似乎是一个极其低效的操作。后来我在 Typecho 论坛看到钜添移植了这个主题的默认Scheme,他利用js实现了在前台解析所有的<h2><h3>标签并生成文章目录列表的功能,于是我也拿过来用了。在此表示感谢~

<s>目前还剩下标签页没整,Typecho的统计的widget似乎没有标签个数的统计,自己暂时也懒得去写插件生成了(也有那么一点强迫症的原因),先凑合着吧,高考完之后再抽时间更新。</s>
模板发布之后 newraina 把这个主题的 Pisces 版本移植过来了,而且实现了标签页的功能,算是开源之后的一个意外的惊喜吧

关于这个主题

  1. 支持 Typecho 原生评论(评论样式来自 cho 的 Navy 主题)和多说评论框<s>(自行替换comments.php中的代码)</s>。
  2. 侧边栏显示友情链接,友情链接只有在安装了 HannyLinks插件 才可显示,未安装不影响使用。
  3. 自带了分类归档标签友链页面模板
  4. js 解析文章目录并显示在侧边栏上(来自 http://howboring.us/ 的代码)

安装方法

  1. 下载源码,解压,将其中文件夹重命名为 next 并上传至博客的 /usr/themes 目录下
  2. 在博客后台点击启用
  3. 设置分类页: 新建一个缩略名为 categories 的页面,在选项的自定义模板选择 categories
  4. 设置归档页: 新建一个缩略名为 archive 的页面,在选项的自定义模板选择 <s>archives</s> archive
  5. 设置标签页: 新建一个缩略名为 tags 的页面,在选项的自定义模板选择 tags
  6. 前往外观设置设置头像,昵称等等

下载

点击链接下载最新版本:立即下载
Github:https://github.com/zgq354/typecho-theme-next/

Next.Pisces传送门:Next.Pisces

鸣谢

IIssNan:设计了这个简洁大方漂亮的主题
钜添:前台生成文章目录的js的作者

使用有任何问题欢迎向我反馈~~

已有 73 条评论
  1. 阿土伯 阿土伯

    我使用了这个主题,有两个问题向你请教下:
    1、标签栏,怎么不在 “首页 分类 归档 留言 关于 ” 这里显示出来,但是点击 右边 https://www.XXXXXX/tags.html 又是可用的?
    2、我安装你的主题,显示的https://www.XXXXX/index.php/tags.html, 多了一个index.php/ ,请问 怎么设置起来跟你的一样 , 没有 index.php/ 呀?

  2. 来过

  3. 文章目录我好像生成不了,用的是MD 也是h2,h3

  4. 已解决,用了自带的Markdown解析就好了,不用插件的

  5. 米奇 米奇

    主题是不是采用了谷歌字体,一直显示“正在等待 fonts.googleapis.com 的响应”

  6. 米奇 米奇

    header.php中有一段“<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Lato:300,400,700,400italic&subset=latin,latin-ext"/>”这一条有谷歌字体加载项,是不是可以直接删除这一条,或者还有其他更好的办法避免谷歌字体的加载?ps:本人测试时没有采用加速,所以谷歌字体这个问题还是比较突出的,站长可以提供方法吗。

    1. 不好意思刚刚才看到评论,谷歌字体加载不了的话删掉也是可以的,或者换成国内的字体镜像

  7. 米奇 米奇

    link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Lato:300,400,700,400italic&subset=latin,latin-ext"/

    1. 米奇 米奇

      删除之后,多个浏览器测试了,可以,也不加载谷歌字体了,站点秒开。

  8. Vihor Vihor

    额… 主题怎么两年没更新啊,啥时候更新一下呀

    1. 还是比较想重构一下的,无奈暂时精力分不出来哇

  9. saucerman saucerman

    你好,请问怎么去除文章目录自动生成编号呢,找了挺久的了

    1. 在 footer.php 里面 41-44 行有个判断,把这一部分去掉就可以了

      <?php if ($this->is('post')): ?>
      <script type="text/javascript" src="<?php $this->options->themeUrl('/js/bootstrap.scrollspy.js?v=0.4.5.2');?>"></script>
      <script type="text/javascript" src="<?php $this->options->themeUrl('/js/post_sidebar.js?v=0.4.5.2');?>"></script>
      <?php endif; ?>
    2. saucerman saucerman

      解决了谢谢!

添加新评论