|
|
|
# Material X
|
|
|
|
|
|
|
|
一个简约的卡片式Hexo博客主题。
|
|
|
|
|
|
|
|
![](https://img.vim-cn.com/52/a54815c02ce232f11f54b2c547c1337828833c.png)
|
|
|
|
|
|
|
|
|
|
|
|
#### 完全自由的模块化、易于定制化设计
|
|
|
|
|
|
|
|
- 可以自由决定每个页面是否需要封面、封面是否需要背景图片、多少图片、是否需要轮播、速度如何。
|
|
|
|
- 可以自由决定每个页面是否需要侧边栏、侧边栏小部件显示什么卡片、顺序如何。
|
|
|
|
- 可以自由决定每个页面的主体结构(默认文章+评论),可以按需增加卡片(与侧边栏小部件共用卡片库)。
|
|
|
|
- 可以自由决定每篇文章的meta标签(日期、更新日期、分类、标签、分享、阅读统计、置顶)显示与否、放置在文章开头还是末尾。标题、缩略图、小图标(用于归档页面)、页面专属的音乐播放器也算做meta标签,但是它们的位置固定。
|
|
|
|
- 大部分按钮可以自由设置图标、文字、target、nofollow等
|
|
|
|
- 方便更换主题色、自定义字体、边距、圆角、阴影等视觉效果,快速实现暗色主题。
|
|
|
|
|
|
|
|
#### 易于扩展
|
|
|
|
|
|
|
|
- 使用 [import](https://xaoxuu.com/wiki/material-x/config/#import) 字段方便导入css和js到主题中。
|
|
|
|
|
|
|
|
#### 移动端优化
|
|
|
|
|
|
|
|
- 针对移动端布局进行了大量优化。
|
|
|
|
|
|
|
|
#### 更多功能的支持
|
|
|
|
|
|
|
|
- 支持4种评论系统:Disqus、Gitalk、来必力和Valine评论。
|
|
|
|
- 提供主题CDN,也可自定义CDN。
|
|
|
|
- 使用卡片设计元素以及交互动效。
|
|
|
|
- 使用 fontawesome 5.6.3 免费版图标。
|
|
|
|
- 支持APlayer播放器,可以播放网易云、QQ音乐、虾米、酷狗平台以及其它服务器的音乐。
|
|
|
|
- 支持不蒜子阅读统计、百度分析、Google分析。
|
|
|
|
- 支持渲染MathJax数学公式,优化了渲染效果。
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<br>
|
|
|
|
|
|
|
|
## 博客示例
|
|
|
|
|
|
|
|
| 博客 | 源码 | 说明 |
|
|
|
|
| ----------------------------------- | -------------------------------------- | ------------------ |
|
|
|
|
| [@mxclub](https://mxclub.github.io) | https://github.com/xaoxuu/blog-example | master分支默认效果 |
|
|
|
|
| [@xaoxuu](https://xaoxuu.com) | 暂未开源 | myblog分支效果 |
|
|
|
|
|
|
|
|
|
|
|
|
- **更多示例请见 [#示例博客](https://github.com/xaoxuu/hexo-theme-material-x/issues/97)**
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<br>
|
|
|
|
|
|
|
|
## 下载安装
|
|
|
|
|
|
|
|
### A. 使用脚本全自动安装(目前仅支持macOS)
|
|
|
|
|
|
|
|
1. 打开终端输入下面命令安装脚本,脚本文档见[#hexo.sh](https://xaoxuu.com/wiki/hexo.sh/)。
|
|
|
|
```bash
|
|
|
|
curl -s https://xaoxuu.com/install | sh -s hexo.sh
|
|
|
|
```
|
|
|
|
|
|
|
|
2. 安装成功后,在你的博客路径打开终端,输入下面命令即可安装主题和依赖包。
|
|
|
|
```bash
|
|
|
|
hexo.sh i x
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
### B. 手动安装
|
|
|
|
|
|
|
|
1. 下载主题到 `themes/` 文件夹
|
|
|
|
```bash
|
|
|
|
git clone https://github.com/xaoxuu/hexo-theme-material-x themes/material-x
|
|
|
|
```
|
|
|
|
|
|
|
|
2. 然后安装必要的依赖包
|
|
|
|
```bash
|
|
|
|
npm i -S hexo-generator-search hexo-generator-json-content hexo-renderer-less
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<br>
|
|
|
|
|
|
|
|
## 文档
|
|
|
|
|
|
|
|
https://xaoxuu.com/wiki/material-x/
|