Hexo 主题 3-hexo

  1. 设计思路
    1. 整体设计
    2. 通过分类过滤
    3. 通过标题关键字搜索
    4. 通过作者搜索
    5. 通过标签搜索
    6. 评论功能
    7. 打赏功能
    8. 文章置顶
    9. 返回头部
  2. 使用
    1. 1. 安装
    2. 2. 配置
    3. 3. 更新

阮一峰曾言:喜欢写 blog 的人,会经历三个阶段

第一阶段,刚接触 Blog,觉得很新鲜,试着选择一个免费空间来写。
第二阶段,发现免费空间限制太多,就自己购买域名和空间,搭建独立博客。
第三阶段,觉得独立博客的管理太麻烦,最好在保留控制权的前提下,让别人来管,自己只负责写文章。

有对搭建个人 blog 有兴趣的朋友,可以翻看我往期文章。

笔者从去年开始通过 hexo 写 blog,使用了 yilia 主题,但是随着文章数量的上升,检索等操作就显得特别笨重。

在遍寻无果的情况下,就写下了 3-hexo 主题。Demo:http://yelog.org

多图预警 ↓↓↓

设计思路

整体设计

** 三段式设计:**
三段式设计

通过分类过滤

分类过滤文章

通过标题关键字搜索

文章标题关键字搜索

通过作者搜索

** 若开启了多作者模式,则可以通过输入 @,进行作者搜索,如下所示 **
通过作者搜索

通过标签搜索

** 输入 #,就会出现标签提示 **
通过标签搜索

评论功能

测试一下评论

打赏功能

打赏功能

文章置顶

文章置顶

返回头部

返回头部

使用

1. 安装

$ git clone https://github.com/yelog/hexo-theme-3-hexo.git themes/3-hexo

2. 配置

1) 修改 hexo 根目录的 _config.yml 的两处,如下

theme: 3-hexo
highlight:
  enable: false #关闭 hexo 渲染高亮,使用主题代码块高亮

2) 在 hexo 根目录 source 下添加 avatar.jpg 文件,作为头像

3) 安装字数统计 (由于主题使用这个插件,必须安装,否则会报错)

$ $ npm i --save hexo-wordcount

** 注意:** 如果没有安装会在 hexo g 的时候报错

3. 更新

$ cd themes/3-hexo
$ git pull

转载请注明来源,欢迎对文章中的引用来源进行考证,欢迎指出任何有错误或不够清晰的表达。可以在下面评论区评论,也可以邮件至 jaytp@qq.com

×

喜欢就点赞,疼爱就打赏