本文主要讲述一下使用Hexo搭建博客的一些Tips。
hexo基本指令
- hexo clean 清除
- hexo new page “menu name” 新建菜单
- hexo g == hexo generate 生成
- hexo d == hexo deploy 部署
- hexo s == hexo server 启动本地
- hexo n == hexo new 新建
首页文章显示
在md文件中添加<!--more-->，那么首页就只会显示这个标签之上的内容了，并显示一个阅读全文的按钮。
部署到Github保证README.md不被渲染
- 在Hexo目录下的source根目录下创建README.md文件,并编辑保存。
编辑Hexo目录的_config.yml文件中的“skip_render”参数。
1
skip_render: README.md
部署到Github，然后看仓库是否有README.md。
博客基本配置
打开hexo目录下的_config.yml文件。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
67
68
69
70
71
72
73# Hexo Configuration
## Docs: https://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/
# Site
title: 听雪楼 #站点名，站点左上角
subtitle: 那是一座悲欢离合聚集的楼。 #副标题，站点左上角
description: #对站点的描述
author: 最后的温存 #作者
language: zh-Hans #语言
timezone: #时区
# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://lijia92.github.io/ #站点Url
root: /
permalink: :year/:month/:day/:title/
permalink_defaults:
# Directory
source_dir: source
public_dir: public
tag_dir: tags
archive_dir: archives
category_dir: categories
code_dir: downloads/code
i18n_dir: :lang
skip_render:
# Writing
new_post_name: :title.md # File name of new posts
default_layout: post
titlecase: false # Transform title into titlecase
external_link: true # Open external links in new tab
filename_case: 0
render_drafts: false
post_asset_folder: false
relative_link: false
future: true
highlight:
enable: true
line_number: true
auto_detect: false
tab_replace:
# Category & Tag
default_category: uncategorized
category_map:
tag_map:
# Date / Time format
## Hexo uses Moment.js to parse and display date
## You can customize the date format as defined in
## http://momentjs.com/docs/#/displaying/format/
date_format: YYYY-MM-DD
time_format: HH:mm:ss
# Pagination
## Set per_page to 0 to disable pagination
per_page: 10
pagination_dir: page
# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: hexo-theme-next #主题插件
# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy: #部署相关信息
type: git
repository: https://github.com/LiJia92/LiJia92.github.io.git
branch: master
分类与标签
1.若已存在分类或标签，则直接修改。
打开hexo/source/tags/index.md。修改为如下。1
2
3title: tags
date: 2016-03-16 15:33:44
type: "tags"
时间可随意修改，必须设置type字段为”tags”。
分类也如此：1
2
3title: categories
date: 2016-03-16 15:33:56
type: "categories"
2.若不存在，则直接新建，修改为1中所示即可。1
2$ hexo new page "tags"
$ hexo new page "categories"
index.md中不需要再额外写什么东西，它会根据你日志的分类、标签自动匹配。1
2
3
4
5
6title: Windows使用Hexo + Github Pages搭建自己的博客
date: 2016-03-17 11:30:45
tags:
- blog
- hexo
categories: hexo
主题
hexo有许多主题可以选择，可以参考知乎回答选择自己喜欢的主题。
我这里选择的是next主题。
下载主题
使用Git Bash进入到hexo目录。输入指令下载主题：1
$ git clone https://github.com/iissnan/hexo-theme-next themes/next
使用主题
回到上面的_config.yml配置文件中，找到theme字段，修改成next主题：1
2
3
4 Extensions
# Plugins: https://hexo.io/plugins/
# Themes: https://hexo.io/themes/
theme: hexo-theme-next
Next主题相关
语言
hexo/_config.yml的配置中，language字段若要使用中文，需使用zh-Hans。
菜单
hexo/themes/hexo-theme-next/_config.yml的配置中。menu是设置菜单，menu_icons是设置菜单对应的图标。这里对应的key都必须是一样的，大小写也有区分。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# ---------------------------------------------------------------
# Menu Settings
# ---------------------------------------------------------------
# When running hexo in a subdirectory (e.g. domain.tld/blog)
# Remove leading slashes ( "/archives" -> "archives" )
menu:
home: /
categories: /categories
archives: /archives
tags: /tags
# about: /about
commonweal: /404.html
# Enable/Disable menu icons.
# Icon Mapping:
# Map a menu item to a specific FontAwesome icon name.
# Key is the name of menu item and value is the name of FontAwsome icon.
# When an question mask icon presenting up means that the item has no mapping icon.
menu_icons:
enable: true
# Icon Mapping.
home: home
about: user
categories: th
tags: tags
archives: archive
commonweal: heartbeat
设置个人信息
hexo/themes/hexo-theme-next/_config.yml的配置中。
将图像avatar.png放在hexo/themes/hexo-theme-next/source/images目录下。avatar–>个人头像，author–>昵称，description–>描述1
2
3
4
5avatar: /images/avatar.png
author: lastwarmth
description: 如果要飞得高，就该把地平线忘掉
社交信息
hexo/themes/hexo-theme-next/_config.yml的配置中。
设置社交信息与icon，与菜单一样，key值需要完全对应，区分大小写。1
2
3
4
5
6
7
8
9
10
11
12# Social links
social:
GitHub: https://github.com/LiJia92
Weibo: http://weibo.com/2950244271
# Social Icons
social_icons:
enable: true
# Icon Mappings
GitHub: github
Twitter: twitter
Weibo: weibo
Schemes
hexo/themes/hexo-theme-next/_config.yml的配置中。
Next主题有三种Scheme，可随意切换。1
2
3scheme: Muse
scheme: Mist
scheme: Pisces
网站图标
与设置个人图像类似。1
2# Place your favicon.ico to /source directory.
favicon: /images/avatar.png
集成多说
hexo/themes/hexo-theme-next/_config.yml的配置中。
设置duoshuo_shortname字段。1
2
duoshuo_shortname: lastwarmth
这个ShortName怎么来？
进入多说
红色方框填写的即是ShortName
代码高亮
hexo/_config.yml的配置中。
修改auto_detect字段为true1
2
3
4
5highlight:
enable: true
line_number: true
auto_detect: true
tab_replace:
hexo/themes/hexo-theme-next/_config.yml的配置中。
修改highlight_theme: normal字段。NexT使用Tomorrow Theme作为代码高亮，共有5款主题供你选择，可选的值有 normal，night， night blue， night bright， night eighties。1
2
3
4
5 Code Highlight theme
Available value:
normal | night | night eighties | night blue | night bright
https://github.com/chriskempson/tomorrow-theme
highlight_theme: normal
问题
本地预览没问题，deploy后主页显示大面积空白
更多
更多请查看 Next 官网