Hexo 简约主题，响应式设计支持 PC、平板、手机等设备，代码高亮使用 monokai-sublime 风格，支持亮/暗色主题跟随系统。可以最低兼容到 IE8。在线预览。
因为这个主题使用了 less 编译，Hexo 默认的编译器为 hexo-renderer-stylus 要切换为 hexo-renderer-less。
$ npm install hexo-renderer-less --save如果你不需要 hexo-renderer-stylus 可以把它卸载掉。
$ npm uninstall hexo-renderer-stylus --save$ git clone https://github.com/sanonz/hexo-theme-concise.git themes/conciseConcise 主题需要 Hexo 2.4 或者更高的版本
- 在
_config.yml站点配置文件中 把theme值改为concise. - 复制
themes/concise/_config.example.yml配置文件为themes/concise/_config.yml
$ cd themes/concise
$ git stash --include-untracked
$ git pull
$ git stash pop修改 themes/concise/_config.yml 主题配置文件。
# Header
menu:
首页: /
前端: /categories/front-end
后端: /categories/back-end
标签: /tags
归档: /archives
订阅: /atom.xml
关于: /about
# Content
excerpt_link: 阅读更多
content_max_width: 800px
# Sidebar
author:
name: Sanonz
work: Web Developer & Designer
location: Shenzhen, China
avatar_url: /images/avatar.jpg
# Links:
links:
- svg: ./source/svg/_github.svg
url: https://github.com/sanonz
- svg: ./source/svg/_more.svg
url: https://weibo.com/sanonz
- svg: ./source/svg/_twitter.svg
url: https://twitter.com/sanonze
# github comment
git_commit:
enable: true
client_id: 7fbe80427f54741e289f
client_secret: f34ed5fd92e54c9000bd37ba951948cb939deff5
repo: sanonz.github.io
owner: sanonz
admin:
- sanonz
per_page: 10
# Baidu
baidu:
id: e4027971a230b210f4671f485b33846a
# Miscellaneous
rss: /atom.xml
favicon: /images/favicon.ico- menu - 导航列表
- excerpt_link - 文章列表阅读更多显示文字
- content_max_width - 站点布局内容区域的最大宽度，超过最大宽度左右留白出现翻页按钮，默认最大
800px - sidebar - 配置博主个人信息，显示在边栏
- links - 配置博主个人信息下边的链接，icon 存放位置为：./source/svg，文件名最好加上
_前缀 - git_commit - 配置评论，使用的 gitalk 插件，具体配置说明请到官方查看 https://github.com/gitalk/gitalk
- baidu - 配置站点访问统计，需要自行注册 百度统计 然后获取 ID 填写到这里
- rss - 在
<head>标签中显示 RSS 链接 - favicon - favicon URL 地址配置
想要自定义 icon 的话，可以到 fontawesome、iconfont 下载 svg 格式图标，放到 ./source/svg 目录，按着如下例子配置。
links:
- svg: ./source/svg/_github.svg
url: https://github.com/sanonz
- svg: ./source/svg/_mail.svg
url: mailto:[email protected]
- svg: ./source/svg/_twitter.svg
url: https://twitter.com/sanonze ---
title: Hello World
date: 2017-10-20 20:00:00
+ comments: false
---$ hexo new page about
INFO Created: /Projects/blog/source/about/index.md$ hexo new page tags
INFO Created: /Projects/blog/source/tags/index.md ---
title: tags
date: 2019-09-29 17:27:33
+ layout: tags
--- ---
title: Hello World
date: 2017-10-20 20:00:00
+ categories: front-end
---# Archive page setting
archive_generator:
per_page: 30
order_by: -date ---
title: 我发布的第一篇文章
---
这里写简介。
+ <!-- more -->
这里的内容进入详情才能看到。打开 https://sanonz.github.io/ 鼠标右键 显示网页源代码 选项查看效果，如果你也想要这种效果的话按照以下步骤添加。
首先安装 hexo-all-minifier 插件。
$ npm install hexo-all-minifier然后在站点配置文件中 _config.yml 启用插件。
+ # optimizes HTML, CSS, JS and imagages
+ all_minifier: true安装 cross-env 跨平台环境变量设置脚本。
$ npm i cross-env生成站点，当 process.env.NODE_ENV=production 时 hexo-all-minifier 插件才工作。
$ cross-env NODE_ENV=production hexo generate生成后验证 public 目录内的静态文件是否是混淆压缩过的。
为了方便以后使用可以加到 package.json 文件的 scripts 字段中。
{
// ...
"scripts": {
+ "start": "cross-env NODE_ENV=development hexo server",
+ "deploy": "cross-env NODE_ENV=production hexo generate --deploy"
},
// ...
}start 为本地启动命令，deploy 为部署命令。
更多插件相关配置请到插件主页查阅。