Hexo 好看且实用的主题推荐

       昨天在腾讯云开发CloudBase，搭建了一个属于自己的Hexo静态博客，然后还绑定了自己的已ICP备案的个人域名，但是了博客主题还是默认的，是时候要换一个博客主题了。今天在网上搜索Hexo博客主题时，还真有一款主题，我一眼就看中了，就是那种“一见钟情”的感觉。

一、主题简介

Fluid 是基于 Hexo 的一款 Material Design 风格的主题，由 Fluid-dev 负责开发与维护。

主题 GitHub: https://github.com/fluid-dev/hexo-theme-fluid(opens new window)

预览网站：Fluid's blogzkqiang's blog

该主题相较于其他主题的优势：

1. 优雅的颜值，使用 Material Design 风格突出层次感，但又不失简约，让用户能专注于写作；
2. 提供大量定制化配置项，使每个用户使用该主题都能具有独特的样式；
3. 响应式页面，适配手机、平板等设备，包括极端的分辨率都能轻松应对；
4. 主题中少有的整合了 LaTeX 和 mermaid 的支持

 二、安装Fluid主题

1、搭建Hexo博客

如果你还没有 Hexo 博客，请按照Hexo官方文档进行安装、建站。或者看我发布的当Hexo遇到云开发CloudBase，搭建静态博客，如此简单一文，自行搭建。

2、获取最新版本

Hexo 5.0.0 版本以上，推荐通过 npm 直接安装，进入博客目录执行命令：

npm install --save hexo-theme-fluid

 然后在博客目录下创建 _config.fluid.yml，将主题的 _config.yml 内容复制过去，然后保存文件，用电脑上的记事本也可以操作，但我建议用Notepad++这个软件来操作。

3、指定主题

如下修改 Hexo 博客目录中的 _config.yml：#后面的文字提示，不用写进去。

theme: fluid  # 指定主题

language: zh-CN  # 指定语言，会影响主题显示的语言，按需修改

设置好后，需要使用hexo clean,hexo g -d ，进行重新编译和发布，那么这时，就会报一个错误 提示，如下图所示：

解决的方法就是在 “language”后面加一个“s”,如下图

 然后就可以正常地进行编译和发布了，如下图：所示

 

 4、创建关于页

首次使用主题的「关于页」需要手动创建

hexo new page about

创建成功后修改 /source/about/index.md，添加 layout 属性，用Notepad++ 编辑输入以下内容

---
title: 标题
layout: about
---

这里写关于页的正文，支持 Markdown, HTML

当然也可以用Markdown语法，书写自己的“关于页”，页面内容。

三、总结

按照上面的步骤来操作，我们就可以为自己的Hexo博客安装上Fluid主题了，因为我的Hexo博客是架设地腾讯云开发上面，最后还需要使用“CloudBase CLI工具”将本地hexo新编译好的文件，上传上去，这样才能更新网站的内容。