为了让Hexo更加个性化,Hexo也提供了不同的主题。官网主题:https://hexo.io/themes
以目前用的最多的Next为例
1.下载主题至Hexo的theme文件夹
git clone https://github.com/iissnan/hexo-theme-next themes/next
2.启用主题。
在站点目录中(blog),打开配置文件_config.yml
,修改theme:next
3.打开本地调试服务
hexo s
4.在浏览器预览
localhost:4000
5.主题设定
在next
主题目录下的_config.yml
文件中将scheme
设定为Pisces
6.语言设定
在站点根目录下修改配置文件_cofig.yml
中的language
为zh-Hans
(简体中文)
7.修改菜单项
在主题目录下修改配置文件_cofig.yml
中的menu
增添一个something
(注:千万不要在这设置中文,后面的值那是查找文件的地方!若你的站点运行在子目录中,请将链接前缀的 / 去掉)
menu:
home: / || home
about: /about/ || user
#tags: /tags/ || tags
#categories: /categories/ || th
archives: /archives/ || archive
tags: /tags
这些配置都要与你主题目录下的languages文件中对应的yml文档里配置相关联。比如你在站点根目录中的配置文件设置language为zh-Hans,那么就要进入到主题目录下的languages文件中修改zh-Hans.yml,这样才能显示出菜单项新增的中文内容(以something为例子)
menu:
home: 首页
archives: 归档
categories: 分类
tags: 标签
about: 关于
search: 搜索
schedule: 日程表
sitemap: 站点地图
something: 有料
8.设置菜单项图标
对应的字段是menu_icons
格式为item name:icon name
其中item name
与所配置的菜单名字对应icon name
是Font Awesome
图标的名字。而 enable
可用于控制是否显示图标,你可以设置成false
来去掉图标。
menu_icons:
enable: true
# ---------------------------------------------------------------
# Scheme Settings
# ---------------------------------------------------------------
# Schemes
#scheme: Muse
#scheme: Mist
scheme: Pisces
#scheme: Gemini
9.设置侧栏位置
修改主题目录下sidebar
的position
值
sidebar:
# Sidebar Position, available value: left | right (only for Pisces | Gemini).
position: left
#position: right
# Sidebar Display, available value (only for Muse | Mist):
# - post expand on posts automatically. Default.
# - always expand for all pages automatically
# - hide expand only when click on the sidebar toggle icon.
# - remove Totally remove sidebar including sidebar toggle.
10.设置头像
在站点根目录下载配置文件中新增avatar
值设置为头像的链接地址。地址可以是网络地址,也可以是本地地址(放置在source/images/
目录下)
avatar: /images/ossend.jpg
11.设置文章代码主题
在主题目录下修改配置文件highlight_theme
默认值为nomal
可以设置为night
highlight_theme: night
12.添加标签页面
前面通过修改next
主题下的_config.yml
文件中的menu选项,可以在主页面的菜单栏添加标签选项,但是此时点击标签,跳转的页面会显示page not found
此时我们要新建一个页面
hexo new page tags
在新建的index.md文件中添加type: "tags"
---
title: tags
date: 2018-04-14 16:19:27
type: "tags"
---
当要为某一篇文章添加标签,只需在blog/source/_post目录下的具体文章的tags中添加标签即可,如: