blog►hexo

搭建你自己的Hexo博客

文章目录

  1. 1. hexo安装
  2. 2. 创建博客
  3. 3. hexo landscape-plus主题
  4. 4. deploy
  5. 5. 技巧
  6. 6. plugin

Hexo基于node.js,可用于生成静态博客，结合github和Mac，可以专注创作了。
深入学习见文末引用。

hexo安装

brew install node
sudo npm install hexo-cli -g  #全局安装

创建博客

Hexo使用命令:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
hexo init <folder>  #执行init命令初始化hexo到你指定的目录
hexo new [layout] <title> #创建文章
hexo new page <title> #生成新页面
hexo generate       #自动根据当前目录下文件,生成静态网页
	-d #deploy after
	-w #查看文件变化
hexo publish [layout] <filename> #发布草稿
hexo server         #运行本地服务
	-p #端口
	-s #只生成静态文件
	-l #生成log
	--draft 连草稿也生成预览
hexo deploy
	-g #generate before
hexo render <file1> [file2] ...
	-o #output destination
hexo migrate <type> #Migrates content from other blog systems.
hexo clean #Cleans the cache file (db.json) and generated files (public).
hexo list <type> #Lists all routes.

hexo landscape-plus主题

git clone https://github.com/xiangming/landscape-plus.git themes/landscape-plus
#修改hexo的配置文件_config.yml
theme:landscape-plus

deploy

#使用git前先安装
npm install hexo-deployer-git --save

国内github-page百度抓不到，参见hexo同步托管到gitcafe和github配置

技巧

  • 标签/分类的别名
#在_config.yml里面配置
category_map:
  工具集: tools
  技术集: technique
tag_map:
  Java: java
  JavaScript: js
  css: css
  html5: html5

plugin

  • hexo-generator-sitemap
  • hexo-generator-feed
1
2
3
4
5
#安装
npm install hexo-generator-sitemap --save
npm install hexo-generator-baidu-sitemap --save #针对baidusitemap的优化
npm install hexo-generator-feed	 --save #3.2.2版本会有错误提示但不影响使用
npm install hexo-console-optimize --save #安装 3.2.2版本会加载失败
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
#根目录下_config.yml添加
#Extensions
plugins: #目前最新版3.2.2不需设置此节点，不然连server等plugin也要写这
- hexo-generator-feed
- hexo-generator-sitemap
- hexo-generator-baidu-sitemap
- hexo-console-optimize
#Feed Atom
feed:
	 type: atom
	 path: atom.xml
  limit: 20

#sitemap:
#  path: sitemap.xml #要与baidusitemap.xml共存时需注释

baidusitemap:
     path: 				#默认 baidusitemap.xml，不需设置：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
vim themes\modernist\layout\_partial\baidu_tongji.ejs
# 添加
<% if (theme.baidu_tongji){ %>
<script type="text/javascript">
# 你的百度统计代码
</script>
<% } %>
# 注册并登录百度统计获取你的统计代码。并设置关闭显示百度图标

	vim themes\modernist\layout\_partial\head.ejs
# 在『/head』之前增加：

<%- partial('baidu_tongji') %>
# 重新生成并部署你的站点。
vim themes/landscape-plus/_config.yml
# menu下加
rss: /atom.xml

# Duoshuo
duoshuo_shortname: XXX

# Baidu tongji
baidu_tongji: true

  • 不蒜子

    参考

  • 相关推荐：无觅

    参考

  • 站内搜索

    • 百度
    • swiftype

相比较而言，swiftype更个性化，但是搜索结果只是基于页面内容是否包含，没有百度智能。参考

脚本批量修改下吧~~

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
<?php
//标题和 #中间要有空格
function listDir($dir) {
    static $res = array();
    if (!file_exists($dir) || !is_dir($dir)) {
        return array();
    }
    $dirHandle = opendir($dir);
    while ($file = readdir($dirHandle)) {
        if ($file !== '.' && $file !== '..') {
            $tmp = $dir . "/" . $file;
            if (is_dir($tmp)) {
                listDir($tmp);
            } else if (stripos($file, ".md") !== false) {
                $res[] = $tmp;
            }
        };
    };
    closedir($dirHandle);
    return $res;
}

$path  = '/pathto/blog/source/_posts';
$files = listDir($path);
foreach ($files as $file) {
    file_put_contents($file,
        preg_replace('/^(#+)([^#\s]+)/m', '$1 $2', file_get_contents($file)));
}
echo 'ok';
  • 升级错误（至3.2.2）

    － hexo-console-optimize

3.2.2开始hexo-console-optimize却少依赖不能成功，按提示缺少的安装可以成功，但已放弃使用

－ hexo-generator-feed
另外hexo-generator-feed会有报错提示，但不影响使用

  • plugin配置不需设置

3.2.2不需设置此节点，不然所有plugin也要写

hexo3.2.2 package.json

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
{
  "name": "hexo-site",
  "version": "0.0.0",
  "private": true,
  "hexo": {
    "version": "3.2.2"
  },
  "dependencies": {
    "hexo": "^3.2.2",
    "hexo-deployer-git": "^0.2.0",
    "hexo-generator-archive": "^0.1.4",
    "hexo-generator-baidu-sitemap": "^0.1.2",
    "hexo-generator-category": "^0.1.3",
    "hexo-generator-feed": "^1.1.0",
    "hexo-generator-index": "^0.2.0",
    "hexo-generator-sitemap": "^1.1.2",
    "hexo-generator-tag": "^0.2.0",
    "hexo-migrator-rss": "^0.1.2",
    "hexo-renderer-ejs": "^0.2.0",
    "hexo-renderer-marked": "^0.2.11",
    "hexo-renderer-stylus": "^0.3.1",
    "hexo-server": "^0.2.0",
    "hexo-tag-bootstrap": "0.0.8",
    "minimatch": "^3.0.2"
  }
}

update

  • 移除影响访问速度的字体

    传送门
    如果是landscape-plus主题，source-code-pro字体的css在themes/landscape-plus/layout/_partial/head.ejs

  • atom编辑器+atom-hexo

好用不多说！
atom
atom-hexo

参考自：
hexo-your-blog
深入学习，请看官方文档

如有疑问，请文末留言交流或邮件：newbvirgil@gmail.com 本文链接 : https://newbmiao.github.io/2015/06/16/hexo-on-your-github.html