更换Hexo主题
我使用的是Next主题。该主题简洁易用,在移动端也表现不错。
下载主题
在blog文件夹中空白处右击打开Git Bash输入:
git clone https://github.com/xirong/hexo-theme-next.gitthemes/next
或者建议使用使用国内的仓库
git clone https://git.coding.net/tianyu211/next.gitthemes/next
修改网站的主题为Next
打开D:\blog下的_config.yml文件,找到theme字段,将其修改为next:
# Extensions
## Plugins: http://hexo.io/plugins/
## Themes: http://hexo.io/themes/
theme: next
验证主题是否可用
输入hexo s #启动服务,调试用,
再在浏览器输入
http://localhost:4000/确认网站主题是否切换为Next。
博客blog根目录下的_config.yml配置网站信息
_config.yml配置请点
参考Hexo博客nexT主题优化
阅读全文按钮
编辑主题配置_config.yml:
auto_excerpt:
enable: false
length: 150(可自行设置)
把enable设置为true之后,每篇文章都会在第150个字符处截断。
搜索界面
执行代码:
npm install hexo-generator-search --save
然后编辑hexo的_config.yml:
search:
path: search.xml
field: post
相册界面
执行hexo new page“photos”,然后在hexo/source文件夹下能够找到photos文件夹,进入文件夹,编辑index.md文件,添加字段:
type: photos
然后编辑主题配置_config.yml,在menu选项中添加photos项:
menu:
home: /
categories: /categories
about: /about
#archives: /archives
tags: /tags
#commonweal: /404.html
photos: /photos
进入hexo/themes/next/languanges文件夹,编辑zh-Hans.yml文件,在menu菜单里添加photos对应的中文名称,修改如下:
menu:
home:首页
archives:归档
categories:分类
tags:标签
about:关于
search:搜索
commonweal:公益404
photos:相册
然后为相册页在菜单下的链接添加图标,在Fontawesome中找到自己喜欢的图标,记录名称,在编辑主题配置config.yml,在menu_icons字段中增加一行photos::
menu_icons:
enable: true
#KeyMapsToMenuItemKey: NameOfTheIconFromFontAwesome
home: home
about: user
categories: th
tags: tags
archives: archive
commonweal: heartbeat
photos: photo
然后在hexo/source/photos/index.md中,增加代码:
{% raw %}
{% endraw %}
* ![](URL)
* ![](URL)
{% raw %}
{% endraw %}
把其中的URL换成要展示的图片的地址,本地或者外链都可以。
重新编译,生成。
文章添加阅读次数
关于Hexo的文章阅读量设置问题,大多数人都是使用不蒜子的代码实现。但是这个方法仅局限于在文章页面显示阅读数,首页是不显示的。所以我推荐使用leanCloud管理阅读量数据。
在Hexo 5.0版本以后,已经自带可以直接开启文章阅读量统计:
进入leanCloud官网注册个账号,可以不用手机号,只用邮箱激活,然后点击头像进入控制台,
创建一个应用,命名为Counter,
点击应用右上角的齿轮,进入应用设置界面,点击存储创建一个Class命名为Counter,设置权限为无限制,
创建完毕后点击应用的设置,找到应用Key,复制下来App ID和App Key,
打开next根目录下的_config.yml配置文件找到leancloud_visitors字段,把你上一步的AppID和AppKey粘贴过来,看起来大概像这样:
leancloud_visitors:
enable: true
app_id: 40LJ62BsvIsNX0gRT8Lf0cuR-gzGzoHsz
app_key: SJ7F5qRaBjcYv8yHhex3pHcv
重新编译部署hexo clean、hexo g -d