Beautify Hexo Blog

1.下载Next

Next主题是Github上Star最多的Hexo主题,有着丰富的界面设置选项,方便的配置
在文件主目录的命令窗口里输入
git clone https://github.com/theme-next/hexo-theme-next themes/next
后面的路径不一定要这么填,但是在文件_config.yml里面要写绝对路径,如果按照我这么填就直接在配置文件里面写
theme: next

2.主题的配置

主题有四种风格,有Muse、Mist、Pisces、Gemini
在themes/next/_config.yml文件里面找到以下内容写
scheme: Gemini

在配置文件里面看到
menu: #设置博客各个页面的相对路径,默认根路径是blog/source
home: / || home
about: /about/ || user
tags: /tags/ || tags
categories: /categories/ || th
archives: /archives/ || archive

#schedule: /schedule/ || calendar #日历

#sitemap: /sitemap.xml || sitemap #站点地图,供搜索引擎爬取

#commonweal: /404/ || heartbeat # 腾讯公益404

#Enable/Disable menu icons / item badges.
menu_settings:
icons: true # 是否显示各个页面的图标
badges: true # 是否显示分类/标签/归档页的内容量
如果自己需要的话就可以吧#注释删除,就可以使用了

3.动态背景

#Canvas-nest

#Dependencies: https://github.com/theme-next/theme-next-canvas-nest
canvas_nest: # 网络背景
enable: true
onmobile: true # display on mobile or not
color: ‘0,0,0’ # RGB values, use ‘,’ to separate
opacity: 0.5 # the opacity of line: 0~1
zIndex: -1 # z-index property of the background
count: 150 # the number of lines

#JavaScript 3D library.

#Dependencies: https://github.com/theme-next/theme-next-three

#three_waves
three_waves: false

#canvas_lines
canvas_lines: false

#canvas_sphere
canvas_sphere: false

#Canvas-ribbon

#Dependencies: https://github.com/theme-next/theme-next-canvas-ribbon

#size: The width of the ribbon.

#alpha: The transparency of the ribbon.

#zIndex: The display level of the ribbon.
canvas_ribbon:
enable: false
size: 300
alpha: 0.6
zIndex: -1

按照自己喜欢的来使用,但是只能让一个true,而且还需要下载相应的资源包,链接在注释里面,使用方式如下
git clone https://github.com/theme-next/theme-next-canvas-nest themes/next/source/lib/canvas-nest

4.设置头像

配置文件找到

avatar:

#in theme directory(source/images): /images/avatar.gif

#in site directory(source/uploads): /uploads/avatar.gif

#You can also use other linking images.
url: /images/author.jpg #将我们的头像图片放置在blog/themes/next/source/images目录下,填写具体地址

#If true, the avatar would be dispalyed in circle.
rounded: true #鼠标放在头像上时是否旋转

#The value of opacity should be choose from 0 to 1 to set the opacity of the avatar.
opacity: 1 #头像放缩指数

#If true, the avatar would be rotated with the cursor.
rotated: true #头像是否设为圆形,否则为矩形