Freemind - Yet Another Bootstrap Theme for Hexo

Freemind 是我为 Hexo 编写的一个开源主题。

• Demo
• Q&A
• 标签插件
• 颜色主题

特点

Freemind 和 HaHack 所用的主题的基本相似，特点在于：

• Bootstrap - 基于 Bootstrap 3.1.1 ；
• 标签插件 - 专门编写了一系列的 Bootstrap tag plugins ，以最大程度的发挥 Bootstrap 的威力。包括：
  • textcolor - 插入一段带有特殊颜色标记的文本；
  • button - 插入一个按钮，并允许为其指定超链接、文本及颜色；
  • label - 插入一个标签，并为其指定文本和样式；
  • badge - 插入一个徽章，并为其指定文本；
  • alert - 插入一段警报文本信息，并为其指定样式。
• 本地搜索 - 自带一个 本地搜索引擎 ，基于我的另一个项目 hexo-generator-search ；
• 颜色主题 - 内置多套颜色主题。总有一套符合你的口味；
• 文章置顶 - 将重要文章置于首页顶部；
• 内置评论系统 - 内置的评论系统，基于我的另一个项目 comment.js 。

安装

1. 安装主题：

1

$ git clone https://github.com/wzpan/hexo-theme-freemind.git themes/freemind

2. 安装 hexo-tag-bootstrap （可选）:

1

$ npm install hexo-tag-bootstrap --save

3. 安装 hexo-generator-search （可选）：

1

$ npm install hexo-generator-search --save

4. 创建页面

Freemind 预先定义了 Categories（分类）、Tags（标签） 和 About（关于）页面，要使用它们，你需要先在你的博客的 source 目录中添加相应页面。

例如，要创建 Categories 页面，你可以在 source/categories/ 目录（如果没有这个目录，就新建一个）下创建一个 index.html 文件，内容如下：

1
2
3

title: Categories
layout: categories
---

Tags 页面和 About 页面与此类似，不同的是 layout 分别为 tags 和 page。

启用

修改 _config.yml 文件里的 theme 选项为 freemind 即可。

更新

1
2

$ cd themes/freemind
$ git pull

配置

Freemind 的配置文件如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66

slogan: Yet another bootstrap theme.

menu:
  - title: Archives
    url: archives
    intro: All the articles.
    icon: fa fa-archive
  - title: Categories
    url: categories
    intro: All the categories.
    icon: fa fa-folder
  - title: Tags
    url: tags
    intro: All the tags.
    icon: fa fa-tags
  - title: About
    url: about
    intro: About me.
    icon: fa fa-user

links:
  - title: My Github
    url: http://www.github.com/wzpan
    intro: My Github account.
    icon: fab fa-github
  - title: My LinkedIn
    url: http://www.linkedin.com/pub/weizhou-pan/5b/8a0/161
    intro: My Linkin account.
    icon: fa fa-linkedin

widgets:
- search
- recent_comments
- category
- tagcloud
- recent_posts
- links

rss: atom.xml
favicon: favicon.png
fancybox: true
duoshuo_shortname:

# analytics
google_analytics:
  enable: false
  siteid:
baidu_tongji:
  enable: false
  siteid:

# Search
swiftype_key: 

# share button
bdshare: true
jiathis: false

# built-in comment system
comment_js:
  type: "github"
  user: "wzpan"
  repo: "hexo-theme-freemind-blog"
  client_id: "xxxxxx"
  client_secret: "xxxxxx"
  count: 5

其中：

• slogan - 修改显示在博客首页的个性签名；
• theme - 要使用的颜色主题；
• menu - 导航菜单；
• links - 修改 links 小挂件的推荐链接；
• widgets - 在博客边栏显示的挂件列表；
• rss - RSS 链接；
• fancybox - 是否启用 Fancybox；
• duoshuo_shortname - 多说ID，如果希望使用多说取代 Disqus 做评论系统；
• analytics - 统计 ID 。支持 Google Analytics 和百度统计；
• swiftype_key - Swifttype key 。如果希望使用自建的本地搜索引擎，则可以留空或注释掉这句话。
• swiftype_key - Swifttype 站内搜索的 key 。如果希望使用内置的搜索引擎，则可以保留为空，而不去配置它。
• bdshare - 百度分享；
• jiathis - jiathis分享；
• comment_js - comment.js 的配置
  • type: 要作为后端的站点。目前支持 Github 和 OSChina 。
  • user: 您的 Github 用户名。
  • repo: 您用作评论后端的仓库名。
  • client_id(可选但建议)：您注册的 OAuth App 的 client id。
  • client_secret(可选但建议)：您注册的 OAuth App 的 client secret。
  • count(可选)：列表的最大长度。

1
2

# Disqus
disqus_shortname:

Front-Matter

Freemind 主题额外提供了一些新的 front-matter 的选项，利用这些选项可以更好的装饰你的文章。

• description - 在文章顶部插入一段简短的摘要信息
• feature - 为文章添加一张 feature 图片，这张图片将展示在主页的文章列表中
• toc - 生成 table of contents
• top - 是否要将本文置顶。
• issue_id - comment.js 的 issue_id ，用于显式地指定 Github 上的哪个 issue 与本文相对应。通常情况下你并不需要手动设置这个，因为 comment.js 会根据文章标题自动寻找匹配的 issue 。当文章没有和你要的 issue 对应的时候你才需要设置它。

示例：

1
2
3
4
5
6
7
8

title: Tag Plugins
date: 2014-03-16 10:17:16
tags: plugins
categories: Docs
description: Introduce tag plugins in freemind.
feature: images/tag-plugins/plugins.jpg
toc: true
---

Q&A

• 为本主题的 Github 项目 加颗星；
• Fork 这个项目，尽情DIY，然后给我发 pull request;
• 这个项目遵循 MIT 开源协议，你可以在本主题基础上创建你的主题。不过如果你能在你的主题页面中声明主题基于 Freemind 就再好不过了。

1
2
3
4
5
6
7
8
9
10

# Markdown
## https://github.com/chjj/marked
markdown:
  gfm: true
  pedantic: false
  sanitize: false
  tables: true
  breaks: false
  smartLists: true
  smartypants: true