开始使用



Material X

一个简约的卡片式Hexo博客主题


GitHub releaseGitHub releaseGitHub release

图片预览

图片有点大,如果看不到图片请刷新一下网页~
图片有点大,如果看不到图片请刷新一下网页~
图片有点大,如果看不到图片请刷新一下网页~
图片有点大,如果看不到图片请刷新一下网页~
图片有点大,如果看不到图片请刷新一下网页~

示例博客

官方博客

博客链接说明
我自己的博客https://xaoxuu.com/blog/myblog分支默认的效果
开源示例博客https://mxclub.github.io/blog-example/myblog分支默认的效果,你可以查看源码
appx.onlinehttps://appx.onlinemaster分支默认的效果,你可以查看源码

特别示例

博客链接说明
小吴博客https://www.wushile.top/基于MaterialX开发了MaterialPlus主题
搅拌糖https://blog.treelo.xin/自定义背景、鼠标点击动画、看板娘
YuGao’s Bloghttps://sxyugao.top/实现了ajax
zerbo’s bloghttps://blog.zerbo.cn/自定义背景

更多博客

博客链接
MicDZ’s bloghttps://www.micdz.cn
MainGuohttps://blog.mainguo.top
Mark’s bloghttps://mark-thinkpad.gitee.io/
gltjkhttps://blog.gltjk.com
BFDZhttps://www.bfdz.ink
Amblizer’s Mainframehttps://amblizer.xyz
Digcorehttps://www.digcore.cn/
Sparky_14145’s bloghttps://sparky-14145.github.io/
假装偶遇http://jzoy.com/
Shan Sanhttps://shansan.top/
Loser007http://www.loser007.com/
Tony Ren’s bloghttps://tonyrenhk.github.io/
Jason’s Bloghttps://blog.jasonzhang.xyz/
yangtao’s bloghttps://istaotao.com
ZYMINhttps://zymin.cn/
Alicehttps://zhengjiameng.github.io/
Radiance Bloghttps://lihaojin.life
小肥羊https://lucksheep.github.io/bgzy/
香蕉博客https://tohot.top/
萌焰博客https://yanhuang0815.github.io
ZZY’s Bloghttps://www.zzy1991.com/
TRHX’S BLOGhttps://trhx.top/
Giskardhttps://getschwifty.cn/
weijiajin’s bloghttps://weijiajin.com
lightsmile’s Bloghttp://www.iamlightsmile.com/
预见未来https://lijunkui.netlify.com/
余城https://sherwinww.github.io/
红发https://hgneer.github.io/
main’s bloghttps://www.intmian.com/
P_Wang’s Bloghttps://tle666.github.io/
codelearn.clubhttps://codelearn.club/
wxwoo’s bloghttps://wxwoo.github.io/
Wiyeeluhttps://wiyeelu.github.io

如果你使用了 Material X 主题,欢迎在下方留言告诉大家,我会抽时间归纳到这里~

下载安装

A. 使用脚本全自动安装(目前仅支持macOS)

如果你使用 hexo.sh 脚本管理和发布博客,在你的博客路径打开终端,输入 hexo.sh i x 即可安装主题。

如果你没有使用过hexo.sh脚本

打开终端输入下面命令即可安装脚本,文档见#hexo.sh

1
curl -s https://xaoxuu.com/install | sh -s hexo.sh

B. 手动安装

1. 下载主题到 themes/ 文件夹

1
git clone https://github.com/xaoxuu/hexo-theme-material-x themes/material-x

2. 然后安装必要的依赖包

1
npm i -S hexo-generator-search hexo-generator-json-content hexo-renderer-less

3. 在博客配置文件中将主题修改为MaterialX

在博客根目录的配置文件中:

1
themes: material-x

许可协议

本主题采用MIT开源许可协议,永久无限制免费使用。

MIT开源许可协议
被授权人有权利使用、复制、修改、合并、出版发行、散布、再授权及贩售软件及软件的副本。
被授权人可根据程式的需要修改授权条款为适当的内容。
在软件和软件的所有副本中都必须包含版权声明和许可声明。

鸣谢

感谢各位网友提供的反馈、建议与大力支持,有了大家的帮助,主题就会做的越来越好~

直接提交源码的网友

提供了宝贵意见和技术支持的网友

还要感谢那些在评论中互相帮助的网友~
如果你又一个好点子或者解决了我这里没有解决的问题,欢迎去GitHub贡献一下代码👏。

收录方

感谢以下网站的收录与分享,让本主题能够被更多人发现,主题就会做的越来越好~

教程和技术分享文章

这些是我不定期从主流搜索引擎搜索到的与MaterialX相关的博文:

作者文章
我自己《Material X 一个简约的卡片式Hexo博客主题》
MicDZ《在material-x上使用KaTeX》
ZYMIN《hexo+ejs+material x 添加CNZZ统计代码》
TRHX《Hexo 博客主题个性化)》

感谢你们的参与和分享!

还有更多参与转载和分享的网友:

乐在分享

把主题分享到SegmenuFault、简书、知乎等平台可以快速增加MaterialX主题被发现和使用的几率,所以如果你喜欢本主题,欢迎写原创文章或者转载分享哦。 文 体 不 限 !

TODO

近期活动和计划

pjax

寻找完美兼容pjax的解决办法。目前兼容性有点问题,代码在这个分支:pjax。主要存在的问题是:切换了页面后侧边栏的目录不会更新、评论系统不会更新。

图片放大预览

寻找可以完美实现图片放大预览的方法。
这个功能的缺失导致图片无法放大看,也导致了二维码分享只能是在新页面打开图片文件。体验比较糟糕。

投票

寻找一个可以嵌入文章中的无后端投票插件(或者使用leancloud作为后端)。

点赞、评分

寻找对文章点赞、评分的无后端插件(或者使用leancloud作为后端)。

问题反馈

有疑问请前往本项目的Issue页面搜索问题,如果没有相关问题,点击【New issue】进行提问。后期可能会不再使用valine评论系统了。




评论