Hexo博客配置

Hexo博客配置

基于hexo-theme-hiker主题

先看myblog下的_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
74
75
76
77
78
79
80
81
82
83
84
# Hexo Configuration
## Docs: https://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/

# Site
title: Fan()
subtitle:
description:
author: a dba's blog
language: zh-CN
timezone: Asia/Shanghai

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://yoursite.com
root: /Fandb.github.io
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: true
tab_replace:

# Home page setting
# path: Root path for your blogs index page. (default = '')
# per_page: Posts displayed per page. (0 = disable pagination)
# order_by: Posts order. (Order by date descending by default)
index_generator:
path: ''
per_page: 6
order_by: -date

# 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: hiker

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
type: git
repository:
github: https://github.com/Fanduzi/Fandb.github.io.git
coding: https://git.coding.net/Fandb/Fandb.blog.git
branch: master

Note

冒号后面要空一格

解释部分区块设置

site

1
2
3
4
5
6
7
# Site
title: Fan()
subtitle:
description:
author: a dba's blog
language: zh-CN
timezone: Asia/Shanghai

此处控制

img

language设置为zh-CN,否则会产生问题,比如会显示成法文

timezone: Asia/Shanghai 没啥可解释的了

writing

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
# 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: true
tab_replace:

这里控制代码块的显示,唯一要注意的是auto_detect,默认是false,不会检测语言代码,从而根据不同的语言产生不同的代码高亮

Home page setting

1
2
3
4
5
6
7
8
# Home page setting
# path: Root path for your blogs index page. (default = '')
# per_page: Posts displayed per page. (0 = disable pagination)
# order_by: Posts order. (Order by date descending by default)
index_generator:
path: ''
per_page: 6
order_by: -date

per_page: 6 表示一页显示6篇文章

Extensions

1
2
3
4
# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: hiker

theme: hiker 选择你想要的themes文件夹下的主题,你可以在themes文件夹下下载多个主题,然后在配置文件中选择一个使用

1
2
TiM@TiMdeMacBook-Pro  ~/Documents/myblog/themes  ls
hiker landscape

主题配置文件设置

先看完整配置

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
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
# ---------------------------------------------------------------
# Site Information Settings
# ---------------------------------------------------------------

# Header Menu
menu:
Home: /
Archives: archives
#Categories: /categories
Tags: /tags
About: /about
rss: /atom.xml

since: 2013

# Set default keywords (Use a comma to separate)
keywords: ""

# Put your favicon.ico or avatar.jpg into `hexo-site/themes/hiker/source/` directory.
avatar:
enable: true
border: true
width: 124
height: 124
top: 0
url: css/images/mylogo.jpeg


# Homepage
# eg. home_background_image: [css/images/home-bg.jpg, http://t.cn/RMbvEza]
home_background_image:
enable: true
rolling: true
url: [css/images/1.jpg, css/images/2.jpg, css/images/3.jpg, css/images/4.jpg]

home_logo_image:
enable: false
border: false
url: css/images/homelogo.jpg


# AboutPage background
about_big_image: css/images/pose.jpg


# Archive pagination
archive_pagination: true


# Post Article's Content
post_catalog:
enable: true


# Content
fancybox: true


# Sidebar
sidebar: right
widgets:
- social
- category
- tag
- tagcloud
- archive
- recent_posts


# Social Links
# Key is the name of FontAwsome icon.
# Value is the target link (E.g. GitHub: https://github.com/iTimeTraveler)
social:
Github: https://github.com/Fanduzi
Weibo: http://weibo.com/1278787855/profile?topnav=1&wvr=6
Twitter: https://twitter.com/FanAshic
Facebook:
Google-plus:
Instagram:
Pinterest:
Flickr:
email: 18501341937@163.com


# Search
search:
insight: true # you need to install `hexo-generator-json-content` before using Insight Search
swiftype: # enter swiftype install key here
baidu: false # you need to disable other search engines to use Baidu search, options: true, false


# comment ShortName, you can choose only ONE to display.
gentie_productKey: #your-gentie-product-key
duoshuo_shortname:
disqus_shortname:
livere_shortname: MTAyMC8yOTQ4MS82MDQ5
uyan_uid:
wumii:


# Code Highlight theme
# Available value:
# default | normal | night | night eighties | night blue | night bright
# https://github.com/chriskempson/tomorrow-theme
highlight_theme: default


# Article theme color
# Available value:
# random | orange | blue | red | green | black
theme_color: random


# display widgets at the bottom of index pages (pagination == 2)
index_widgets:
- category
- tagcloud
- archive


# widget behavior
archive_type: 'monthly'
show_count: true

# Google Webmaster tools verification setting
# See: https://www.google.com/webmasters/
google_site_verification:
baidu_site_verification:
qihu_site_verification:

# Miscellaneous
google_analytics:
gauges_analytics:
baidu_analytics:
tencent_analytics:
twitter:
google_plus:
fb_admins:
fb_app_id:

# Facebook SDK Support.
# https://github.com/iissnan/hexo-theme-next/pull/410
facebook_sdk:
enable: false
app_id: #<app_id>
fb_admin: #<user_id>
like_button: #true
webmaster: #true

# CNZZ count
cnzz_siteid: 1260716016

# busuanzi count
# http://busuanzi.ibruce.info/
show_busuanzi_view_counts: true


# donation button
donate:
enable: true
message: '如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!'
wechatImage: https://raw.githubusercontent.com/Fanduzi/Fandb.github.io/master/css/images/WechatIMG65.jpeg
alipayImage: https://raw.githubusercontent.com/Fanduzi/Fandb.github.io/master/css/images/WechatIMG64.jpeg

Header menu

1
2
3
4
5
6
7
8
# Header Menu
menu:
Home: /
Archives: archives
#Categories: /categories
Tags: /tags
About: /about
rss: /atom.xml

注释掉的不会在菜单中显示

Tags,About

参考
http://theme-next.iissnan.com/theme-settings.html#tags-page
我的配置与效果

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 TiM@TiMdeMacBook-Pro  ~/Documents/myblog/source/tags  more index.md
---
title: Tagcloud
date: 2017-08-04 23:06:48
type: "tags"
---
# [MySQL](https://fanduzi.github.io/Fandb.github.io/tags/MySQL/)
- [PMM](https://fanduzi.github.io/Fandb.github.io/tags/PMM/)
- [MHA](https://fanduzi.github.io/Fandb.github.io/tags/MHA/)
- [Sysbench](https://fanduzi.github.io/Fandb.github.io/tags/Sysbench/)
TiM@TiMdeMacBook-Pro  ~/Documents/myblog/source/tags  cd ..
TiM@TiMdeMacBook-Pro  ~/Documents/myblog/source  cd about
TiM@TiMdeMacBook-Pro  ~/Documents/myblog/source/about  more index.md
---
title: about
date: 2017-08-04 22:40:02
---
About Me
一个菜<U+1F413>dba

img
img

自定义title图片

1
2
3
4
5
6
7
8
# Put your favicon.ico or avatar.jpg into `hexo-site/themes/hiker/source/` directory.
avatar:
enable: true
border: true
width: 124
height: 124
top: 0
url: css/images/mylogo.jpeg

url: css/images/mylogo.jpeg 控制

img

Homepage

1
2
3
4
5
6
# Homepage
# eg. home_background_image: [css/images/home-bg.jpg, http://t.cn/RMbvEza]
home_background_image:
enable: true
rolling: true
url: [css/images/1.jpg, css/images/2.jpg, css/images/3.jpg, css/images/4.jpg]

url: [css/images/1.jpg, css/images/2.jpg, css/images/3.jpg, css/images/4.jpg]

控制这里的图片滚动

img

你可以将自己喜欢的图片放到

1
myblog/themes/hiker/source/css/images

搜索

1
2
3
4
5
# Search
search:
insight: true # you need to install `hexo-generator-json-content` before using Insight Search
swiftype: # enter swiftype install key here
baidu: false # you need to disable other search engines to use Baidu search, options: true, false

要安装

1
2
cd myblog
npm install hexo-generator-json-content save

然后就可以看到搜索按钮(博客内文章搜索)
img

其他的看我的配置就大概能看懂了,不解释了

需要注意的文章格式

默认文章是没有标题的,并且是全部显示没有read more按钮

要添加文章标题需要在文章开头添加

1
2
3
4
5
---
title: 你的文章标题
datte: 2017-08-05 10:10:10
tags: [你的标签,你的标签2]
---

而read more则是在文章你想要开始隐藏的位置前添加

1
<!-- more -->

文章中的图片建议我仍然放到了

1
myblog/themes/hiker/source/css/images

然后hexo d上传代码后,去找一个图片地址,类似于这样

1
![img](https://raw.githubusercontent.com/Fanduzi/Fandb.github.io/master/css/images/hexo1.jpg)

Powered by Hexo and Hexo-theme-hiker

Copyright © 2013 - 2022 Fan() All Rights Reserved.

访客数 : | 访问量 :