Hexo + icarus 博客搭建(二)

Hexo + icarus 博客搭建(二)

本文主要介绍 Hexo + icarus 主题自定义

首先自定义博客的头像及其角标信息,将自己做好的图片替换即可。

详细的配置文件如下,全部做了中文翻译,文件位置如图:

_config.yml 配置文件

_config.yml >folded
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
164
165
166
167
168
169
170
171
172
173
174
175
# Hexo Configuration
## Docs: https://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/
##################################################################################################################### Site信息
# Site
# 网站标题,此处配置会被_config.icarus.yml覆盖
title: Zhang's Blog

# 网站副标题
subtitle: 'Blog'

# 网站描述:比较重要,它主要用于 SEO,用来告诉搜索引擎关于站点的信息,在其中包含网站的关键词。
description: 'IT'

keywords:

# 您的名字
author: MooneyZW

# 国际化参数,支持 en, zh-CN, zh-TW 等
language: zh-CN

# 网站时区。Hexo 默认使用您电脑的时区。时区列表。
timezone: ''

##################################################################################################################### URL信息
# URL
## If your site is put in a subdirectory, set url as 'http://example.com/child' and root as '/child/'
# 网址
url: http://example.com
#网址根目录
root: /
# 文章的永久链接格式
permalink: :year/:month/:day/:title/
# 永久链接中各部分的默认值
permalink_defaults:
pretty_urls:
trailing_index: true # Set to false to remove trailing 'index.html' from permalinks
trailing_html: true # Set to false to remove trailing '.html' from permalinks

##################################################################################################################### 文件目录
# Directory
# 资源文件,用来存放内容,映射到根目录下的source,在其中的_posts存放*.md文件即可完成博客发布
source_dir: source
# 公共文件夹,生成的站点文件存放在这个地方
public_dir: public
# 标签文件夹
tag_dir: tags
# 归档文件夹
archive_dir: archives
# 分类文件夹
category_dir: categories
# include code文件夹
code_dir: downloads/code
# 国际化i18n文件夹
i18n_dir: :lang
# 跳过指定文件的渲染,您可使用 glob 表达式来匹配路径,如果也有别的页面不需要渲染,直接在下方添加就可以了
skip_render:
- 404.html #将404.html加进去,【-】之后要有空格隔开

##################################################################################################################### 编辑信息
# Writing
# 新文章的文件名称
new_post_name: :title.md # File name of new posts
# 预设布局
default_layout: post
# 把标题转换为 title case
titlecase: false # Transform title into titlecase
# 在新标签中打开链接
external_link:
enable: true # Open external links in new tab
field: site # Apply to the whole site
exclude: ''
# 把文件名称转换为 (1) 小写或 (2) 大写
filename_case: 0
# 显示草稿
render_drafts: false
# 启动 Asset 文件夹,asset是md文件链接图片时存放图片的默认文件夹
# 需要 npm install hexo-asset-image --save
post_asset_folder: true
# 把链接改为与根目录的相对位址
relative_link: false
# 显示未来的文章
future: true
# 代码块的设置
highlight:
enable: true
line_number: true
auto_detect: false
tab_replace: ''
wrap: true
hljs: false
prismjs:
enable: false
preprocess: true
line_number: 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: 8
order_by: -date

#####################################################################################################################
# Category & Tag
default_category: uncategorized
category_map:
tag_map:

#####################################################################################################################
# Metadata elements
## https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta
meta_generator: true

##################################################################################################################### 时间与日期格式
# 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
## updated_option supports 'mtime', 'date', 'empty'
updated_option: 'mtime'

##################################################################################################################### 分页设置
# Pagination
## Set per_page to 0 to disable pagination
# 每页显示的文章量 (0 = 关闭分页功能)
per_page: 8
# 分页目录
pagination_dir: page

#####################################################################################################################
# Include / Exclude file(s)
## include:/exclude: options only apply to the 'source/' folder
include:
exclude:
ignore:

##################################################################################################################### 主题配置
# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: icarus

live2d:
enable: true

feed:
enable: true
type: atom
path: atom.xml
limit: 20
hub:
content:
content_limit: 140
content_limit_delim: ' '
order_by: -date
icon: icon.png
autodiscovery: true
template:

##################################################################################################################### 部署配置
# Deployment
## Docs: https://hexo.io/docs/one-command-deployment
deploy:
type: 'git'
repo:
github: git@github.com:local-host-8080/local-host-8080.github.io.git,master
# coding: git@git.dev.tencent.com:localhost-8080/localhost-8080.git,master

_config.icarus.yml 配置文件

_config.icarus.yml >folded
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
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
##################################################################################################################### 配置文件版本
# Version of the configuration file
# 配置文件与优先级
# 除了在_config.icarus.yml的默认主题配置文件外,Icarus也会从如下位置获取替代配置:
# 位于_config.yml的站点配置文件
# 位于_config.post.yml和_config.page.yml的布局配置文件
# 文章/页面的front-matter
# (已弃用) 位于themes/icarus/_config.yml的旧主题配置文件
# (已弃用) 位于themes/icarus/_config.post.yml和themes/icarus/_config.page.yml的旧布局配置文件

# 配置文件版本
###### 这个版本号与主题版本号相关却不总是相同。
###### Icarus使用此版本号来决定是否升级默认主题配置文件。 请不要自己更改这个版本号。
version: 4.0.0

##################################################################################################################### 主题变体
# Icarus theme variant, can be "default" or "cyberpunk"
# 主题变体
###### 通过此设置为Icarus更换”皮肤“。 此设置目前支持”default“和”cyberpunk“两种值。
variant: default

##################################################################################################################### 站点logo
# Path or URL to the website's logo
# Logo图标
###### 设置你站点的logo。 此logo会显示在导航栏和页脚。
###### logo配置的值既可以是你的logo图片的路径或URL地址:
###### 示例1 logo: /img/logo.svg
###### 示例2 logo:
###### ----------text: My Beautiful Site
logo: /img/logo.svg

##################################################################################################################### 站点Head
# Page metadata configurations
# Favicon
###### 你可以在head配置中指定你的网站favicon的路径或URL地址。
head:
# URL or path to the website's icon
favicon: /img/favicon.svg
# Web application manifests configuration
# https://developer.mozilla.org/en-US/docs/Web/Manifest
# Web App Manifest
# Icarus支持基本的PWAmanifest.json的生成与Meta标签。
###### 要开启web app manifest,请再主题配置中使用如下的配置。 你也可以参考MDN来了解每个配置项的详情。
manifest:
# Name of the web application (default to the site title)
# Web应用的名称 (默认为站点标题) name: Icaurs - Hexo Theme
name: Zhang's Blog

# The displayed name of the web application
# when there is not enough space to display full name
# Web的显示名称
# 当没有空间显示全名时显示 short_name: Icarus
short_name: Blog

# The start URL of the web application
# Web应用的初始URL start_url: https://ppoffice.github.io/
start_url:

# The default theme color for the application
# 应用的默认主题颜色 theme_color: "#3273dc"
theme_color:

# A placeholder background color for the application page to display
# before its stylesheet is loaded
# 在应用的样式表加载之前显示的应用页默认占位背景颜色 background_color: "#3273dc"
background_color:

# The preferred display mode for the website
# 网站首选的展示模式 display: standalone
display: standalone

# Image files that can serve as application icons for different contexts
# 在不同上下文下用作应用图标的图片文件
icons:
-
# The path to the image file
# 图片文件的路径 src: icons/touch-icon-iphone.png
src: ''

# A string containing space-separated image dimensions
# 空格分割的表示图标尺寸的字符串 sizes: 144x144
sizes: ''

# A hint as to the media type of the image
# 图片的媒体类型提示 (可选) type: image/png
type:

# Open Graph metadata
# 你可以在head配置中设置Open Graph。
# 参考https://hexo.io/docs/helpers.html#open-graph
# 你应该在配置文件中将绝大部分配置留空。 仅在需要的时候在文章的front-matter中为这些设置赋值。
open_graph:

# Page title (og:title) (optional)
# You should leave this blank for most of the time
# 页面标题 (og:title) (可选)
# 大部分情况下请留空
title:

# Page type (og:type) (optional)
# You should leave this blank for most of the time
# 页面类型 (og:type) (可选)
# 大部分情况下请留空
type: blog

# Page URL (og:url) (optional)
# You should leave this blank for most of the time
# 页面URL地址 (og:url) (可选)
# 大部分情况下请留空
url:

# Page cover (og:image) (optional)
# You should leave this blank for most of the time
# 页面封面图 (og:image) (可选)
# 大部分情况下请留空
image:

# Site name (og:site_name) (optional)
# You should leave this blank for most of the time
# 站点名称 (og:site_name) (可选)
# 大部分情况下请留空
site_name:

# Page author (article:author) (optional)
# You should leave this blank for most of the time
# 页面作者 (article:author) (可选)
# 大部分情况下请留空
author:

# Page description (og:description) (optional)
# You should leave this blank for most of the time
# 页面描述 (og:description) (可选)
# 大部分情况下请留空
description:

# Twitter card type (twitter:card)
# Twitter卡片类型 (twitter:card)
twitter_card:

# Twitter ID (twitter:creator)
twitter_id:

# Twitter Site (twitter:site)
twitter_site:

# Google+ profile link (deprecated)
# Google+个人主页链接 (已弃用)
google_plus:

# Facebook admin ID
fb_admins:

# Facebook App ID
fb_app_id:

# Structured data of the page
# https://developers.google.com/search/docs/guides/intro-structured-data
# 你应该在配置文件中将绝大部分配置留空。 仅在需要的时候在文章的front-matter中为这些设置赋值。
structured_data:

# Page title (optional)
# You should leave this blank for most of the time
# 页面标题 (可选)
# 大部分情况下请留空
title:

# Page description (optional)
# You should leave this blank for most of the time
# 页面描述 (可选)
# 大部分情况下请留空
description:

# Page URL (optional)
# You should leave this blank for most of the time
# 页面URL地址 (可选)
# 大部分情况下请留空
url:

# Page author (article:author) (optional)
# You should leave this blank for most of the time
# 页面作者 (article:author) (可选)
# 大部分情况下请留空
author:

# Page images (optional)
# You should leave this blank for most of the time
# 页面图片 (可选)
# 大部分情况下请留空
image:

# Additional HTML meta tags in an array
# 页面元信息
###### 你可以通过head部分的meta设置来向生成的HTML中添加自定义<meta>标签。
###### 每一个meta标签应作为meta数组中的一个元素出现。
###### meta设置每一个元素的值应为<属性名>=<属性值>的格式,其中属性名和属性值分别代表着<meta>标签的属性和值。
###### 如果<meta>标签有多个属性和值,请使用;来分隔<属性名>=<属性值>。
meta:
# Meta tag specified in <attribute>=<value> style
# E.g., name=theme-color;content=#123456 => <meta name="theme-color" content="#123456">
- ''

# URL or path to the website's RSS atom.xml
# 你可以通过head部分的rss设置来添加RSS链接信息。rss: /path/to/atom.xml
rss:

##################################################################################################################### 导航栏
# Page top navigation bar configurations
# 导航栏
navbar:
# Navigation menu items
# 导航栏菜单项
menu:
# Home: /
# Archives: /archives
# Categories: /categories
# Tags: /tags
# About: /about
主页: /
时间轴: /archives
分类: /categories
标签: /tags
关于我: /about

# Links to be shown on the right of the navigation bar
# 导航栏右侧的链接
###### 你也可以使用FontAwesome图标来作为纯文字链接的替换,格式如下:
###### <链接名>:
###### icon: <FontAwesome图标的class名>
###### url: <链接URL>
links:
# 问题反馈: 'https://github.com/local-host-8080/'
RSS:
icon: fas fa-rss
url: '/atom.xml'

##################################################################################################################### 页脚
# Page footer configurations
# 页脚
footer:
# Links to be shown on the right of the footer section
# footer部分定义了页脚右侧的链接。 链接的配置格式与navbar中links的配置格式完全一致。
links:
CC BY-NC-SA 4.0:
icon:
- fab fa-creative-commons
- fab fa-creative-commons-by
- fab fa-creative-commons-nc
- fab fa-creative-commons-sa
url: 'https://creativecommons.org/licenses/by-nc-sa/4.0/'
GitHub:
icon: fab fa-github
url: 'https://github.com/local-host-8080/'

##################################################################################################################### 代码高亮
# Article related configurations
# 代码高亮
### 如果你已在Hexo中启用了代码高亮功能,你可以通过article中的highlight设置来自定义代码块。
###### 请从highlight.js/src/styles下列出的所有主题中 选择一个主题。
###### 然后,复制文件名(不带.css后缀)到theme设置项中。
### 如要隐藏复制代码按钮,将clipboard设置为false。
###### 如果你希望折叠或展开所有代码块,将fold设置为"folded"或"unfolded"。
###### 你也可以将fold设置为空来禁止代码块折叠。
article:
# Code highlight settings
highlight:
# Code highlight themes
# 代码高亮主题
# 参考https://github.com/highlightjs/highlight.js/tree/master/src/styles
theme: atom-one-light

# Show copy code button
# 显示复制代码按钮
clipboard: true

# Default folding status of the code blocks. Can be "", "folded", "unfolded"
# 代码块的默认折叠状态。可以是"", "folded", "unfolded"
fold: unfolded

# 此外,你可以在Markdown文件中使用下面的语法来折叠单独的代码块:
###### <figure class="highlight plain"><figcaption><span>可选文件名 >folded</span></figcaption><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">###### ...代码块内容...</span><br><span class="line">###### </span><br></pre></td></tr></table></figure>
<pre><code> # 封面 &amp; 缩略图
### 若要为文章添加封面图,请在文章的front-matter中添加cover选项:
###### 在post.md文件
###### title: Icarus快速上手
###### cover: /gallery/covers/cover.jpg
###### ---
###### Post content...
### 类似地,你也可以在文章的front-matter中为文章设置缩略图:
###### 在post.md文件
###### title: Icarus快速上手
###### thumbnail: /gallery/thumbnails/thumbnail.jpg
###### ---
###### Post content...
### 文章的缩略图会显示在归档页面和最新文章挂件中。
###### 如果你在front-matter中使用的是图片的路径,你需要确保它是绝对或者相对于你的source目录的路径。
###### 例如,为使用&lt;your blog&gt;/source/gallery/image.jpg作为缩略图,
###### 你需要在front-matter中使用/gallery/image.jpg作为图片路径。

# Whether to show estimated article reading time
# 文章阅读时间:你可以将article部分的readtime设置为true来显示文章字数统计以及预计阅读时间。
readtime: true

# Article licensing block
# 文章许可协议
###### 你可以在你的文章/页面的底部展示你的作品的使用许可,许可链接可以是文字或者图标。
###### 这里的配置与导航栏或者页脚的links配置一致:
licenses:
创意社区:
icon: fab fa-creative-commons
url: &#39;https://creativecommons.org/&#39;
CC BY 4.0:
icon: fab fa-creative-commons-by
url: &#39;https://creativecommons.org/licenses/by-nc-sa/4.0/&#39;
CC NC 4.0:
icon: fab fa-creative-commons-nc
url: &#39;https://creativecommons.org/licenses/by-nc/4.0/&#39;
CC SA 4.0:
icon: fab fa-creative-commons-sa
url: &#39;https://creativecommons.org/licenses/by-nc-sa/4.0/&#39;</code></pre>
<p>##################################################################################################################### 搜索</p>
<h1 id="Search-plugin-configurations"><a href="#Search-plugin-configurations" class="headerlink" title="Search plugin configurations"></a>Search plugin configurations</h1><h1 id="https-ppoffice-github-io-hexo-theme-icarus-categories-Plugins-Search"><a href="#https-ppoffice-github-io-hexo-theme-icarus-categories-Plugins-Search" class="headerlink" title="https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Search/"></a><a href="https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Search/">https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Search/</a></h1><p>search:<br> type: insight</p>
<p>##################################################################################################################### 评论</p>
<h1 id="Comment-plugin-configurations"><a href="#Comment-plugin-configurations" class="headerlink" title="Comment plugin configurations"></a>Comment plugin configurations</h1><h1 id="https-ppoffice-github-io-hexo-theme-icarus-categories-Plugins-Comment"><a href="#https-ppoffice-github-io-hexo-theme-icarus-categories-Plugins-Comment" class="headerlink" title="https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Comment/"></a><a href="https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Comment/">https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Comment/</a></h1><h1 id="comment"><a href="#comment" class="headerlink" title="comment:"></a>comment:</h1><h1 id="type-disqus"><a href="#type-disqus" class="headerlink" title="type: disqus"></a>type: disqus</h1><h1 id="Disqus-shortname"><a href="#Disqus-shortname" class="headerlink" title="# Disqus shortname"></a># Disqus shortname</h1><h1 id="shortname-‘’"><a href="#shortname-‘’" class="headerlink" title="shortname: ‘’"></a>shortname: ‘’</h1><p>##################################################################################################################### 打赏</p>
<h1 id="Donate-plugin-configurations"><a href="#Donate-plugin-configurations" class="headerlink" title="Donate plugin configurations"></a>Donate plugin configurations</h1><h1 id="https-ppoffice-github-io-hexo-theme-icarus-categories-Plugins-Donation"><a href="#https-ppoffice-github-io-hexo-theme-icarus-categories-Plugins-Donation" class="headerlink" title="https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Donation/"></a><a href="https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Donation/">https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Donation/</a></h1><p>donates:<br> # Alipay donate button configurations<br> # 登录支付宝并导出个人支付二维码图片。<br> # 将二维码图片保存到你的Hexo网站的附件文件夹下,或将它上传至图床。<br> # 向主题配置中添加如下配置:<br> -<br> type: alipay<br> # Alipay qrcode image URL<br> qrcode: ‘/img/alipayqrcode.png’</p>
<pre><code># Wechat donate button configurations
# 登录微信并导出个人支付二维码图片。
# 将二维码图片保存到你的Hexo网站的附件文件夹下,或将它上传至图床。
# 向主题配置中添加如下配置:
-
type: wechat
# Wechat qrcode image URL
qrcode: &#39;/img/wechatqrcode.png&#39;

# &quot;Afdian.net&quot; donate button configurations
# 爱发电
# -
# type: afdian
# # URL to the &quot;Afdian.net&quot; personal page
# url: &#39;&#39;

# &quot;Buy me a coffee&quot; donate button configurations
# -
# type: buymeacoffee
# # URL to the &quot;Buy me a coffee&quot; page
# url: &#39;&#39;

# Patreon donate button configurations
# -
# type: patreon
# # URL to the Patreon page
# url: &#39;&#39;

# Paypal donate button configurations
# -
# type: paypal
# # Paypal business ID or email address
# business: &#39;&#39;
# # Currency code
# currency_code: USD</code></pre>
<p>##################################################################################################################### 分享</p>
<h1 id="Share-plugin-configurations"><a href="#Share-plugin-configurations" class="headerlink" title="Share plugin configurations"></a>Share plugin configurations</h1><h1 id="https-ppoffice-github-io-hexo-theme-icarus-categories-Plugins-Share"><a href="#https-ppoffice-github-io-hexo-theme-icarus-categories-Plugins-Share" class="headerlink" title="https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Share/"></a><a href="https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Share/">https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Share/</a></h1><h1 id="share"><a href="#share" class="headerlink" title="share:"></a>share:</h1><h1 id="type-sharethis"><a href="#type-sharethis" class="headerlink" title="type: sharethis"></a>type: sharethis</h1><h1 id="URL-to-the-ShareThis-share-plugin-script"><a href="#URL-to-the-ShareThis-share-plugin-script" class="headerlink" title="# URL to the ShareThis share plugin script"></a># URL to the ShareThis share plugin script</h1><h1 id="install-url-‘’"><a href="#install-url-‘’" class="headerlink" title="install_url: ‘’"></a>install_url: ‘’</h1><p>##################################################################################################################### 侧边栏滚动</p>
<h1 id="Sidebar-configurations"><a href="#Sidebar-configurations" class="headerlink" title="Sidebar configurations."></a>Sidebar configurations.</h1><h1 id="Please-be-noted-that-a-sidebar-is-only-visible-when-it-has-at-least-one-widget"><a href="#Please-be-noted-that-a-sidebar-is-only-visible-when-it-has-at-least-one-widget" class="headerlink" title="Please be noted that a sidebar is only visible when it has at least one widget"></a>Please be noted that a sidebar is only visible when it has at least one widget</h1><h1 id="侧边栏"><a href="#侧边栏" class="headerlink" title="侧边栏"></a>侧边栏</h1><h6 id="设置sidebar中某个侧边栏的sticky为true来让它的位置固定而不跟随页面滚动。"><a href="#设置sidebar中某个侧边栏的sticky为true来让它的位置固定而不跟随页面滚动。" class="headerlink" title="设置sidebar中某个侧边栏的sticky为true来让它的位置固定而不跟随页面滚动。"></a>设置sidebar中某个侧边栏的sticky为true来让它的位置固定而不跟随页面滚动。</h6><p>sidebar:<br> # Left sidebar configurations<br> # 左侧边栏设置<br> left:<br> # Whether the sidebar sticks to the top when page scrolls<br> # 是否不随页面滚动<br> sticky: false<br> # Right sidebar configurations<br> # 右侧边栏设置<br> right:<br> # Whether the sidebar sticks to the top when page scrolls<br> # 是否不随页面滚动<br> sticky: false</p>
<p>##################################################################################################################### 布局配置 | 边栏小部件设置</p>
<h1 id="Sidebar-widget-configurations"><a href="#Sidebar-widget-configurations" class="headerlink" title="Sidebar widget configurations"></a>Sidebar widget configurations</h1><h1 id="http-ppoffice-github-io-hexo-theme-icarus-categories-Widgets"><a href="#http-ppoffice-github-io-hexo-theme-icarus-categories-Widgets" class="headerlink" title="http://ppoffice.github.io/hexo-theme-icarus/categories/Widgets/"></a><a href="http://ppoffice.github.io/hexo-theme-icarus/categories/Widgets/">http://ppoffice.github.io/hexo-theme-icarus/categories/Widgets/</a></h1><h1 id="布局配置文件"><a href="#布局配置文件" class="headerlink" title="布局配置文件"></a>布局配置文件</h1><h6 id="布局配置文件遵循着与主题配置文件相同的格式和定义。"><a href="#布局配置文件遵循着与主题配置文件相同的格式和定义。" class="headerlink" title="布局配置文件遵循着与主题配置文件相同的格式和定义。"></a>布局配置文件遵循着与主题配置文件相同的格式和定义。</h6><h6 id="config-post-yml中的配置对所有文章生效,而-config-page-yml中的配置对所有自定义页面生效。"><a href="#config-post-yml中的配置对所有文章生效,而-config-page-yml中的配置对所有自定义页面生效。" class="headerlink" title="_config.post.yml中的配置对所有文章生效,而_config.page.yml中的配置对所有自定义页面生效。"></a>_config.post.yml中的配置对所有文章生效,而_config.page.yml中的配置对所有自定义页面生效。</h6><h6 id="这两个文件将覆盖主题配置文件中的配置。"><a href="#这两个文件将覆盖主题配置文件中的配置。" class="headerlink" title="这两个文件将覆盖主题配置文件中的配置。"></a>这两个文件将覆盖主题配置文件中的配置。</h6><p>############# 例如,你可以在_config.post.yml中把所有文章变为两栏布局:<br>############# 在_config.post.yml文件<br>############# widgets:<br>############# -<br>############# type: recent_posts<br>############# position: left<br>############# -<br>############# type: categories<br>############# position: left<br>############# -<br>############# type: tags<br>############# position: left<br>############# 同时所有其他页面仍保持三栏布局:<br>#############<br>############# 在_config.icarus.yml文件<br>############# widgets:<br>############# -<br>############# type: recent_posts<br>############# position: left<br>############# -<br>############# type: categories<br>############# position: right<br>############# -<br>############# type: tags<br>############# position: right<br>widgets:<br> # Profile widget configurations<br> -<br> # Where should the widget be placed, left sidebar or right sidebar<br> # 个人信息面板部件位置<br> position: left<br> type: profile</p>
<pre><code> # Author name
# 作者名称
author: Zhang&#39;s Blog

# Author title
# 作者签名
author_title: 长路漫漫,未来可期

# Author&#39;s current location
# 作者所在地
location: 中国 · 深圳

# URL or path to the avatar image
# 头像图片地址
avatar: /img/avatar.png

# Whether show the rounded avatar image
# 是否显示圆形头像
avatar_rounded: true

# Email address for the Gravatar
# Gravatar邮箱(如不设置`avatar`项)
gravatar: # mooneyzw@foxmail.com

# URL or path for the follow button
# 关注按钮链接地址
follow_link: &#39;https://github.com/local-host-8080&#39;

# Links to be shown on the bottom of the profile widget
# 社交媒体链接
social_links:
Github:
icon: fab fa-github
url: &#39;https://github.com/local-host-8080&#39;
Bilibili:
icon: fab fa-youtube
url: &#39;https://space.bilibili.com/32683063&#39;
QQ_Group:
icon: fab fa-qq
url: &#39;https://jq.qq.com/?_wv=1027&amp;k=YyEBTYat&#39;
Email:
icon: fas fa-envelope
url: &#39;mailto:mooneyzw@foxmail.com&#39;
# RSS:
# icon: fas fa-rss
# url: /
# Table of contents widget configurations
# 目录组件-右侧固定
-
# Where should the widget be placed, left sidebar or right sidebar
# 小部件应该放在哪里,左边栏还是右边栏
position: right
type: toc
# Whether to show the index of each heading
# 是否显示每个标题的索引
index: true
# Whether to collapse sub-headings when they are out-of-view
# 当子标题看不见时是否折叠它们
collapsed: true
# Maximum level of headings to show (1-6)
# 要显示的标题的最大级别
depth: 3
# Recent posts widget configurations
# 最新文章组件
-
# Where should the widget be placed, left sidebar or right sidebar
# 小部件应该放在哪里,左边栏还是右边栏
# 最新文章
position: right
type: recent_posts
# Archives widget configurations
# 分类组件
-
# Where should the widget be placed, left sidebar or right sidebar
# 小部件应该放在哪里,左边栏还是右边栏
# 文章归档
position: right
type: archives
# Categories widget configurations
# 分类组件
-
# Where should the widget be placed, left sidebar or right sidebar
# 小部件应该放在哪里,左边栏还是右边栏
# 文章分类
position: left
type: categories
# Tags widget configurations
# 标签组件
-
# Where should the widget be placed, left sidebar or right sidebar
# 小部件应该放在哪里,左边栏还是右边栏
# 文章标签
position: left
type: tags
# Recommendation links widget configurations
# 链接组件
-
# Where should the widget be placed, left sidebar or right sidebar
# 小部件应该放在哪里,左边栏还是右边栏
position: left
type: links
# Names and URLs of the sites
# 友站名称与链接
links:
Hexo: &#39;https://hexo.io&#39;
哔哩哔哩: &#39;https://www.bilibili.com/&#39;
# Google FeedBurner email subscription widget configurations
# 订阅更新组件
# -
# # Where should the widget be placed, left sidebar or right sidebar
# # 小部件应该放在哪里,左边栏还是右边栏
# position: left
# type: subscribe_email
# # Hint text under the email input
# description:
# # Feedburner ID
# feedburner_id: &#39;&#39;
# Google AdSense unit configurations
# 广告组件
# -
# # Where should the widget be placed, left sidebar or right sidebar
# # 小部件应该放在哪里,左边栏还是右边栏
# position: left
# type: adsense
# # AdSense client ID
# client_id: &#39;&#39;
# # AdSense AD unit ID
# slot_id: &#39;&#39;</code></pre>
<p>##################################################################################################################### 插件</p>
<h1 id="Plugin-configurations"><a href="#Plugin-configurations" class="headerlink" title="Plugin configurations"></a>Plugin configurations</h1><h1 id="https-ppoffice-github-io-hexo-theme-icarus-categories-Plugins"><a href="#https-ppoffice-github-io-hexo-theme-icarus-categories-Plugins" class="headerlink" title="https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/"></a><a href="https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/">https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/</a></h1><p>plugins:<br> # Enable page startup animations<br> # 网页载入动画,Icarus默认启用网页载入动画<br> animejs: true<br> # Show the “back to top” button<br> back_to_top: true<br> # Baidu Analytics plugin settings<br> # <a href="https://tongji.baidu.com/">https://tongji.baidu.com</a><br> baidu_analytics:<br> # Baidu Analytics tracking ID<br> tracking_id:<br> # Bing Webmaster Tools plugin settings<br> # <a href="https://www.bing.com/toolbox/webmaster/">https://www.bing.com/toolbox/webmaster/</a><br> bing_webmaster:<br> # Bing Webmaster Tools tracking ID in the <meta> tag<br> tracking_id:<br> # BuSuanZi site/page view counter<br> # <a href="https://busuanzi.ibruce.info/">https://busuanzi.ibruce.info</a><br> busuanzi: true<br> # CNZZ statistics<br> # <a href="https://www.umeng.com/web">https://www.umeng.com/web</a><br> cnzz:<br> # CNZZ tracker id<br> id:<br> # CNZZ website id<br> web_id:<br> # Alerting users about the use of cookies<br> # <a href="https://www.osano.com/cookieconsent/">https://www.osano.com/cookieconsent/</a><br> cookie_consent:<br> # The compliance type. Can be “info”, “opt-in”, or “opt-out”<br> # 同意对话框类型。可以为”info”,”opt-in”,或”opt-out”<br> type: info<br> # Theme of the popup. Can be “block”, “edgeless”, or “classic”<br> # 弹出框主题。可以为”block”,”edgeless”,或”classic”<br> theme: edgeless<br> # Whether the popup should stay static regardless of the page scrolls<br> # 是否使弹出框固定,不随页面滚动而滚动<br> static: false<br> # Where on the screen the consent popup should display<br> # 弹出框在屏幕上的位置<br> position: bottom-left<br> # URL to your site’s cookie policy<br> # 你网站的Cookie协议的URL<br> policyLink: ‘<a href="https://www.cookiesandyou.com/&#39;">https://www.cookiesandyou.com/&#39;</a><br> # Enable the lightGallery and Justified Gallery plugins<br> # 画廊插件<br> ###### Icarus的画廊插件同时包含了lightGallery与 Justified Gallery两种插件。<br> ###### 若要启用画廊插件,请将主题配置中plugins &gt; gallery的值设置为true。<br> ###### 参考<a href="https://blog.zhangruipeng.me/hexo-theme-icarus/Plugins/Other/icarus%E7%94%A8%E6%88%B7%E6%8C%87%E5%8D%97-%E5%85%B6%E4%BB%96%E6%8F%92%E4%BB%B6/">https://blog.zhangruipeng.me/hexo-theme-icarus/Plugins/Other/icarus%E7%94%A8%E6%88%B7%E6%8C%87%E5%8D%97-%E5%85%B6%E4%BB%96%E6%8F%92%E4%BB%B6/</a><br> gallery: true<br> # Google Analytics plugin settings<br> # <a href="https://analytics.google.com/">https://analytics.google.com</a><br> google_analytics:<br> # Google Analytics tracking ID<br> tracking_id:<br> # Hotjar user feedback plugin<br> # <a href="https://www.hotjar.com/">https://www.hotjar.com/</a><br> hotjar:<br> # Hotjar site id<br> site_id:<br> # Enable the KaTeX math typesetting support<br> # <a href="https://katex.org/">https://katex.org/</a><br> # 数学公式渲染<br> ###### 你可以使用KaTeX插件来渲染TEX数学公式。 若要启用KaTeX插件,请将主题配置中plugins &gt; katex的值设置为true。<br> katex: false<br> # Enable the MathJax math typesetting support<br> # <a href="https://www.mathjax.org/">https://www.mathjax.org/</a><br> mathjax: false<br> # Enable the Outdated Browser plugin<br> # <a href="http://outdatedbrowser.com/">http://outdatedbrowser.com/</a><br> # 浏览器升级提醒<br> # 你可以使用浏览器升级提醒(Outdated Browser)插件来检测你的网站访客使用的老旧浏览器,并提醒他们升级浏览器。<br> # 若要启用此插件,请将主题配置中plugins &gt; outdated_browser的值设置为true。<br> outdated_browser: false<br> # Show a progress bar at top of the page on page loading<br> # 网页载入进度条<br> progressbar: true<br> # Statcounter statistics<br> # <a href="https://statcounter.com/">https://statcounter.com/</a><br> statcounter:<br> # Statcounter project id<br> project:<br> # Statcounter project security code<br> security:<br> # Twitter conversion tracking plugin settings<br> # <a href="https://business.twitter.com/en/help/campaign-measurement-and-analytics/conversion-tracking-for-websites.html">https://business.twitter.com/en/help/campaign-measurement-and-analytics/conversion-tracking-for-websites.html</a><br> twitter_conversion_tracking:<br> # Twitter Pixel ID<br> pixel_id: </p>
<p>##################################################################################################################### CDN加速</p>
<h1 id="CDN-provider-settings"><a href="#CDN-provider-settings" class="headerlink" title="CDN provider settings"></a>CDN provider settings</h1><h1 id="https-ppoffice-github-io-hexo-theme-icarus-Configuration-Theme-speed-up-your-site-with-custom-cdn"><a href="#https-ppoffice-github-io-hexo-theme-icarus-Configuration-Theme-speed-up-your-site-with-custom-cdn" class="headerlink" title="https://ppoffice.github.io/hexo-theme-icarus/Configuration/Theme/speed-up-your-site-with-custom-cdn/"></a><a href="https://ppoffice.github.io/hexo-theme-icarus/Configuration/Theme/speed-up-your-site-with-custom-cdn/">https://ppoffice.github.io/hexo-theme-icarus/Configuration/Theme/speed-up-your-site-with-custom-cdn/</a></h1><p>providers:<br> # Name or URL template of the JavaScript and/or stylesheet CDN provider<br> cdn: jsdelivr<br> # Name or URL template of the webfont CDN provider<br> fontcdn: google<br> # Name or URL of the fontawesome icon font CDN provider<br> # iconcdn: fontawesome<br> iconcdn: <a href="https://cdn.bootcdn.net/ajax/libs/font-awesome/5.12.0/css/all.css">https://cdn.bootcdn.net/ajax/libs/font-awesome/5.12.0/css/all.css</a></p>
<p>#####################################################################################################################</p>
<h1 id="文章-页面的Front-matter"><a href="#文章-页面的Front-matter" class="headerlink" title="文章/页面的Front-matter"></a>文章/页面的Front-matter</h1><h3 id="如果你只想要在某个文章-页面中覆盖主题配置,你可以在那个文章-页面的front-matter中写下配置。"><a href="#如果你只想要在某个文章-页面中覆盖主题配置,你可以在那个文章-页面的front-matter中写下配置。" class="headerlink" title="如果你只想要在某个文章/页面中覆盖主题配置,你可以在那个文章/页面的front-matter中写下配置。"></a>如果你只想要在某个文章/页面中覆盖主题配置,你可以在那个文章/页面的front-matter中写下配置。</h3><h3 id="例如,你可以像下面这样在一篇文章的front-matter中更改某篇文章的代码高亮主题:"><a href="#例如,你可以像下面这样在一篇文章的front-matter中更改某篇文章的代码高亮主题:" class="headerlink" title="例如,你可以像下面这样在一篇文章的front-matter中更改某篇文章的代码高亮主题:"></a>例如,你可以像下面这样在一篇文章的front-matter中更改某篇文章的代码高亮主题:</h3><h3 id="在source-post-some-post-md文件"><a href="#在source-post-some-post-md文件" class="headerlink" title="在source/_post/some-post.md文件"></a>在source/_post/some-post.md文件</h3><h3 id="title-我的第一篇文章"><a href="#title-我的第一篇文章" class="headerlink" title="title: 我的第一篇文章"></a>title: 我的第一篇文章</h3><h3 id="date-‘2015-01-01-00-00-01’"><a href="#date-‘2015-01-01-00-00-01’" class="headerlink" title="date: ‘2015-01-01 00:00:01’"></a>date: ‘2015-01-01 00:00:01’</h3><h3 id="article"><a href="#article" class="headerlink" title="article:"></a>article:</h3><h3 id="highlight"><a href="#highlight" class="headerlink" title="highlight:"></a>highlight:</h3><h3 id="theme-atom-one-dark"><a href="#theme-atom-one-dark" class="headerlink" title="theme: atom-one-dark"></a>theme: atom-one-dark</h3><h3 id="—"><a href="#—" class="headerlink" title="—"></a>—</h3><h3 id="文章标题"><a href="#文章标题" class="headerlink" title="# 文章标题"></a># 文章标题</h3><p>#####################################################################################################################</p>
<h3 id="上面的配置会为那篇文章覆盖掉-config-post-yml和-config-icarus-yml中的article-highlight。"><a href="#上面的配置会为那篇文章覆盖掉-config-post-yml和-config-icarus-yml中的article-highlight。" class="headerlink" title="上面的配置会为那篇文章覆盖掉_config.post.yml和_config.icarus.yml中的article.highlight。"></a>上面的配置会为那篇文章覆盖掉_config.post.yml和_config.icarus.yml中的article.highlight。</h3><h3 id="这种层次化的配置系统对于页面个性化和不同访客间的差异化优化十分有效。"><a href="#这种层次化的配置系统对于页面个性化和不同访客间的差异化优化十分有效。" class="headerlink" title="这种层次化的配置系统对于页面个性化和不同访客间的差异化优化十分有效。"></a>这种层次化的配置系统对于页面个性化和不同访客间的差异化优化十分有效。</h3><h3 id="比如,你可以为根据你页面目标访客的国家和语言来开启更快的CDN或本地化的评论服务。"><a href="#比如,你可以为根据你页面目标访客的国家和语言来开启更快的CDN或本地化的评论服务。" class="headerlink" title="比如,你可以为根据你页面目标访客的国家和语言来开启更快的CDN或本地化的评论服务。"></a>比如,你可以为根据你页面目标访客的国家和语言来开启更快的CDN或本地化的评论服务。</h3><h3 id="然而需要注意的是,一些Hexo定义的文章或页面属性不会覆盖掉其他配置源中的同名配置,"><a href="#然而需要注意的是,一些Hexo定义的文章或页面属性不会覆盖掉其他配置源中的同名配置," class="headerlink" title="然而需要注意的是,一些Hexo定义的文章或页面属性不会覆盖掉其他配置源中的同名配置,"></a>然而需要注意的是,一些Hexo定义的文章或页面属性不会覆盖掉其他配置源中的同名配置,</h3><h3 id="如-title-date-updated-comments-not-comment-layout-source-photos-和excerpt。"><a href="#如-title-date-updated-comments-not-comment-layout-source-photos-和excerpt。" class="headerlink" title="如 title, date, updated, comments (not comment), layout, source, photos, 和excerpt。"></a>如 title, date, updated, comments (not comment), layout, source, photos, 和excerpt。</h3><p>#####################################################################################################################</p>
<h1 id="站点配置文件"><a href="#站点配置文件" class="headerlink" title="站点配置文件"></a>站点配置文件</h1><h3 id="上面列出的所有配置源,包括主题配置文件,布局配置文件,和文章-页面的front-matter,"><a href="#上面列出的所有配置源,包括主题配置文件,布局配置文件,和文章-页面的front-matter," class="headerlink" title="上面列出的所有配置源,包括主题配置文件,布局配置文件,和文章/页面的front-matter,"></a>上面列出的所有配置源,包括主题配置文件,布局配置文件,和文章/页面的front-matter,</h3><h3 id="会覆盖掉站点配置文件中Icarus使用到的配置。"><a href="#会覆盖掉站点配置文件中Icarus使用到的配置。" class="headerlink" title="会覆盖掉站点配置文件中Icarus使用到的配置。"></a>会覆盖掉站点配置文件中Icarus使用到的配置。</h3><h3 id="例如,-config-icarus-yml中的title设置会覆盖掉-config-yml中的title,"><a href="#例如,-config-icarus-yml中的title设置会覆盖掉-config-yml中的title," class="headerlink" title="例如,_config.icarus.yml中的title设置会覆盖掉_config.yml中的title,"></a>例如,_config.icarus.yml中的title设置会覆盖掉_config.yml中的title,</h3><h3 id="但new-post-name却不会,因为-Icarus-没有用到这个配置项。"><a href="#但new-post-name却不会,因为-Icarus-没有用到这个配置项。" class="headerlink" title="但new_post_name却不会,因为 Icarus 没有用到这个配置项。"></a>但new_post_name却不会,因为 Icarus 没有用到这个配置项。</h3><h3 id="另外,主题配置文件中的theme-config选项会与主题配置文件中的主题配置合并并覆盖掉同名配置。"><a href="#另外,主题配置文件中的theme-config选项会与主题配置文件中的主题配置合并并覆盖掉同名配置。" class="headerlink" title="另外,主题配置文件中的theme_config选项会与主题配置文件中的主题配置合并并覆盖掉同名配置。"></a>另外,主题配置文件中的theme_config选项会与主题配置文件中的主题配置合并并覆盖掉同名配置。</h3><h3 id="然而,我们非常不推荐使用这个配置选项。"><a href="#然而,我们非常不推荐使用这个配置选项。" class="headerlink" title="然而,我们非常不推荐使用这个配置选项。"></a>然而,我们非常不推荐使用这个配置选项。</h3><p>#####################################################################################################################</p>

_config.page.yml 配置文件

_config.page.yml >folded
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
# _config.page.yml中的配置对所有自定义页面生效,比如“关于我”
widgets:
# 个人信息组件
# -
# type: profile
# position: right

# 最新文章组件
# -
# type: recent_posts
# position: left

# 分类组件
# -
# type: categories
# position: right

# 标签组件
# -
# type: tags
# position: right

# 时间轴|归档组件
# -
# type: archives
# position: right

# 链接组件
# -
# type: links
# position: right

# 目录组件
# -
# type: toc
# position: right

# 订阅更新组件
# -
# type: subscribe_email
# position: right

# 广告组件
# -
# type: adsense
# position: right

_config.post.yml 配置文件

_config.post.yml >folded
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
# _config.post.yml中的配置对所有“文章”生效
widgets:
# 个人信息组件
# -
# type: profile
# position: right

# 最新文章组件
# -
# type: recent_posts
# position: left

# 分类组件
# -
# type: categories
# position: right

# 标签组件
# -
# type: tags
# position: right

# 时间轴|归档组件
# -
# type: archives
# position: right

# 链接组件
# -
# type: links
# position: right

# 目录组件
-
type: toc
position: left

# 订阅更新组件
# -
# type: subscribe_email
# position: right

# 广告组件
# -
# type: adsense
# position: right

##################################################################################################################### 侧边栏滚动
# Sidebar configurations.
# Please be noted that a sidebar is only visible when it has at least one widget
# 侧边栏
###### 设置sidebar中某个侧边栏的sticky为true来让它的位置固定而不跟随页面滚动。
sidebar:
# Left sidebar configurations
# 左侧边栏设置
left:
# Whether the sidebar sticks to the top when page scrolls
# 是否不随页面滚动
sticky: true
# Right sidebar configurations
# 右侧边栏设置
right:
# Whether the sidebar sticks to the top when page scrolls
# 是否不随页面滚动
sticky: false

大概就是这样了,直接将配置文件全选复制粘贴就可以了。

作者

MooneyZW

发布于

2020-11-19

更新于

2020-11-19

许可协议