搭建你自己的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
本文链接 : http://blog.newbmiao.com/2015/06/16/hexo-on-your-github.html