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 #头像是否设为圆形,否则为矩形