Hey!俺换新的主题了~ 大家感觉新主题如何 ?
之前一直用的是 NexT 主题下的 Mist 风格,从2015年底博客创建开始
最早是在 微信读书团队博客 上看到了这个主题,真是好看的不行,一用就舍不得换,一用就是两年多
这两年多的时间里,NexT 陪着我写了20W+字,50+篇文章
再好看也架不住审美疲劳啦,于是捉摸换一个主题了
选主题其实是一个很纠结的事情,打开 Themes|Hexo 各种选择困难症开始犯病,卧槽挑花眼啊,201种精选主题,我比较喜欢简约,清新的风格,挑来挑去我看上2款
Terminal
其实我是有一点更喜欢 Terminal 的,本身很简洁,很清新,并且创意超级赞啊,多么符合程序员的身份。只是这主题的功能相对来说少,只支持了 Tags/About 页面,没有 Archive/Categories 页面,也没有搜索与评论功能。
这还不是最主要的,可能是因为我的配置姿势不对,又或遇到了啥不知道的 Bug ?我的博客的文章把 Terminal 部署起来后,模板引擎似乎除了点问题,首页 HTML 的下半部分无法渲染,渲染出来10篇文章后首页的 HTML 就被截断,丢失了一堆 Dom,以及 HTML 尾部的 JS/CSS 资源加载。
如果还年轻的时候可能会想抽空把问题解了,还顺带想撸起袖子帮作者把 Archive/Categories 搞定,顺带也搞搞评论什么的。但现在没那个说干就干的激情了,Anatole 我也很喜欢,等看腻了再说吧 ╮(╯_╰)╭
有同学如果有 Terminal 部署的经验,踩过坑的话求告知~
Anatole
这个也很好看有木有!简约清新又大方!
进入代码仓库,找到文档按着文档配置安装即可使用,文档还是相当全面到位的,并且还是中英双语文档。Anatole 和 Terminal 都是用的是 Pug(原Jade)模板引擎,不同于 Next Swig,记得按着文档说明安装对应 Node 插件就好了
- Anatole 把每篇文章标题都强制英文字母大写
- Anatole 为每篇文章提供了标签与分类的能力,但并没有提供 Tags/Categories 的页面
第一个问题好解决,大写变化是通过 CSS 控制的,在主题代码中 style.css
与 style.scss
2个文件,搜索其中的 text-transform
css 属性,把值为 uppercase
的通通注释掉,就完事了
第二个问题嘛,因为 Pug 模板引擎我没那么熟,忍忍先这样啦,啥时候有兴致了在捣鼓捣鼓,或者啥时候有兴致了,直接去捣鼓 Terminal 了,哈哈哈哈
Gitment
评论一直是我博客的一块心病
- 最早用多说,结果多说停服了
- 尝试切网易云跟帖,结果不支持github.io,后来听说网易云跟帖也停服了
- 切友言,结果友言停服了
- 切Disqus,需要翻墙
- 切来必力,棒子的服务器,天天TMD挺卡,凑合用
去年年底就听说有人拿 Github Issue 搞评论,趁着这次折腾博客,干脆玩一发,于是开始捣鼓起来
Gitment:使用 GitHub Issues 搭建评论系统
Anatole 与 NexT 都有很多家评论的现成功能,只需要配置对应的 id 与 key 到 theme 的 _config.yml
文件中即可。但 Gitment 还是需要把链接中的代码与主题的评论模块结合一下,才能生效
按着说明文档一步步来
- 注册 GitHub OAuth Application
第一步没啥好说的
- 部署引入 Gitment 代码
第二步想要把 Gitment 引入 Anatole,需要先在 theme 的 _config.yml
文件中加入 Gitment 的配置信息
1 | gitment: |
然后找到 layout/partial/comments.pug
模板文件,在里面添加 Gitment 的相关代码即可。
1 | if theme.gitment |
第一次用pug模板,感觉跟swig模板差距好大,╮(╯_╰)╭
注意这里有一点:id: '#{page.title}',
这一行在 Gitment 官方文档上写着缺省,可以不填写,这个值就是用来识别评论所归属文章的 id ,如果直接不填写就会默认用当前文章所在 Url 进行存储。
但这里有个坑,GitHub 的 Issue 的 Title 名字限制在50个字符以内,如果使用 Url 很容易超出 GitHub 的限制,导致评论初始化失败,因此被我改成了 id:'#{page.title}',
- 初始化评论
第三部,在进行之前要求你把页面部署到远端,在本地 localhost 模式下是无法进行的。
部署到远端后,每个文章下面就会出现一个 Gitment 的评论区UI,但当时是不可用状态,先登陆 Github 账号,再点击 init 按钮,当前文章的评论就开启了
Tips:
每次初始化只初始化当前文章的评论,每一篇文章都要初始化一次
如果没有写
id:'#{page.title}',
直接缺省,当 url 超过50字符会导致 init 评论失败每篇文章都要点一次 init 有点蛋疼,其实可以自己写脚本完成
- 评论功能生效
- GitHub 上的评论数据