2021 hexo matery主题个性魔改

最新推荐文章于 2025-10-02 14:02:06 发布

原创

最新推荐文章于 2025-10-02 14:02:06 发布 · 4.1k 阅读

38 ·

CC 4.0 BY-SA版权

文章标签：

#hexo

本文详细介绍了如何个性化修改hexo matery主题，包括添加雪花飘落效果、星空动态背景、背景图片美化、首页轮播图高度调整、导航栏动态渐变色、屏蔽网页源码、水平分割线和卡片样式改进、自定义个人主页和实现个人简介HTML页面等，通过这些步骤，可以提升博客的视觉效果和用户体验。

hexo matery主题个性修改

一、雪花飘落

先来看看效果：

找到你的博客目录，在主题在/themes/matery/layout/layout.ejs 中写下如下代码即可

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-xgjB6KED-1620877752253)(https://7.dusays.com/2021/05/13/bdb359b4bc530.svg)]

二、一款好看的星空动态背景

效果：

使用html5中canvas，配合jQuery库实现的效果，实现代码：

在/themes/matery/layout/layout.ejs文件中加上以下代码，注意如果没有效果，看是否引入jQuery依赖，一定要有！！！

<!--动态背景-->
<div id="DynamicBackground"><canvas></canvas><canvas></canvas><canvas></canvas></div

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

Codecheng2021

关注关注

5
点赞
踩
38

收藏

觉得还不错? 一键收藏
11
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

基于hexo框架——matery主题的博客魔改记录

m0_46296826的博客

03-27

533

信封动画电脑端信封骨架结构 <div id="computer"> <div id="maincontent"><br> <div id="form-wrap"> <img src="" id="beforeimg"> <div id="envelope"> <form> <div class="formmain">

Hexo Matery主题添加百度统计

Scluis的博客

03-04

1520

前言网站之前一直用的不蒜子统计，没有添加百度统计，今天心血来潮，想用一下。步骤首先需要注册百度统计账号，注册好账号后，点击管理-网站列表-新增网站，如图：添加好网站后，点击获取代码：可以看到百度统计的启用代码，这部分代码添加到我们的网站中后，就可以应用百度统计了。如果是自己写的前台页面，需要自己把这部分代码添加到页面中。而Matery已经为我们准备了这部分代码，在themes\matery\layout\_partial\baidu-analytics.ejs这个文件中。文件中代码如下

11 条评论您还未登录，请先登录后发表或查看评论

Hexo 魔改主题 butterfly

云玩家

05-07

1999

五款令人心动的Hexo主题！

最新发布

2501_90357013的博客

10-02

743

三款优秀的Hexo博客主题：Paperbox、Reimu和Matery。Paperbox以极简主义著称，采用Material Design风格，注重内容呈现；Reimu专为动漫爱好者设计，融入东方Project元素，功能丰富；Matery结合Material Design与响应式布局，插件生态完善。三款主题各具特色，均支持主流功能如代码高亮、评论系统和响应式设计，满足不同用户需求

Hexo下魔改NexT主题

qq_44099416的博客

07-28

750

参数可以根据个人需求修改，color代表线条颜色，opacity为线条透明度，zIndex为层级，一般不需要修改，count为线条数量，数字越大线条越多。修改为rgb(255,255,255)文件，修改第一个duration变量的值。在next主题文件夹根目录下的。在next主题的配置文件（......

Hexo-魔改yilia主题~Yileas

欢迎来到计算机瞎鼓捣小能手的博客空间

05-24

663

基于yilia的魔改操作~yileas GitHub地址：https://github.com/GH670/yileas 存在许多的不足，欢迎大家的issues、PR、star. yileas hexo-theme-yileas???? 基于yilia主题的个性化定制——yileas 欢迎访问我的博客：wblog.tech 查看效果。 yileas → 注重准确,崇尚简洁目前仅仅对原主题进行了魔改 . 后续会慢慢地对其进行更改欢迎各位的PR. 说明魔改：更改：不定期优化简单化的

Hexo主题Aurora的魔改（一）

qq_41674631的博客

08-19

3791

Hexo主题Aurora的魔改（一）刚接触Hexo，就碰到了这么好的主题，如图是Aurora作者的博客展示：你可以从去Github了解Hexo和Aurora主题。虽然主题很好看，但是对于刚接触Hexo，折腾起来是有点棘手。安装出现问题，主题修改摸不着头脑，Deploy出现问题。下面我将从替换源站静态文件和图片文件链接，以及替换cdns.cloudflare.com链接两个方面来介绍我修改的内容，以后可能还有，敬请期待。替换源站链接由于github.io在国内的访问速度很慢，而且也不容易被爬

精选资源

hexo-matery-modified:我个人修改的hexo matery主题，已修复了一些错误

05-02

**Hexo-Matery-Modified：个性化与优化的Hexo Mater主题** Hexo-Matery-Modified 是一个基于原生Hexo Mater主题的个人化版本，由用户进行了一系列的修复和改进，旨在提供一个更加稳定、功能丰富的博客环境。Hexo ...

Matery闪烁之狐免费Hexo博客主题

03-21

Matery主题的引入，为Hexo用户提供了更多的个性化选择，使得博客外观更具现代感和专业性。在提供的文件列表中，我们可以看到以下关键文件： 1. `.gitignore`：这是一个版本控制系统Git的配置文件，用于指定应当...

hexo matery主题博客解析bug问题及主题优化

01-08

matery主题优化时解析出bug matery是个好的主题这个我就不详细地说了，但是优化也难越好的主题、越丰富的主题，插件越多，配置越多，就容易出错最要命的是这种静态网页的部署还要用最原始的方法进行，先在命令行...

hexo-matery主题魔改日记（2）深色模式

qq_51661411的博客

05-18

1898

其实我的网站添加深色模式已经很久了，上次看到群里有小伙伴问我怎么做的，就决定写下来帮助一些想要添加的群友。我的博客链接简述原理简要说一下原理利用js给全局HTML的body标签增加一个class为DarkMode的属性控制开启深色模式，再通过这个全局属性值重新写一个深色模式需要用到的CSS就可以实现点击深色模式按钮进行切换。深色模式颜色的选择如果在深色模式中简单的使用黑底白字会因为两者过高的对比度容易导致视觉疲劳。所以我选择的背景色为淡黑色。文字颜色为浅白色。值得特别注意的是对图片和表格的处理.

Sw-blog:Hexo主题SPFK的魔术更改

05-16

** Sw'blog Hexo 主题：**魔改自，只是对部分代码做了修改，主要是做了主题透明，但是写死了（PS：我真不会前端....这块还是Processor写的）另外一方面添加了搜索框站内搜索，主要是对标题的搜索.... 搜索框需要插件的。 ## rss插件 npm install hexo-generator-feed --save ## 本地搜索插件集成 npm install hexo-generator-search --save 另外配置文件也得做一些修改，根目录下的 _config.yml search: path: search.json field: post 主题下的 _config.yml search_box: true search: path: search.json field: post 和我的桌面毫无违和感。这样就基本没什么问题了。

hexo-blog-lionkk:魔改自butterfly主题，提供完整详细的文档，同时为了回馈开源，这不是生成后的网页文件，是您可以直接使用的源码，您只需要把博客相关信息换成您自己的就可以可以部署了，对于新手或者不懂编程的小伙伴来说，简直是福音！

03-23

:sun: hexo-blog-lionkk 这是我的个人博客库。现在，每个人都可以下载和修改它。如果它可以帮助您建立博客或您喜欢该回购协议，可以给我一个星星！谢谢！目前是已经在做开源的准备了，当然还有一些优化项和功能增加后续在慢慢更新，请小伙伴们关注，点个star即可，然后记得关注readme的动态更新，添加的特性与教程都会与代码同步更新。为了回馈开源，这不是生成后的网页文件，是您可以直接使用的源码，您只需要把博客相关信息换成您自己的就可以部署了，对于新手或者不懂编程的小伙伴来说，简直是福音，大大简化了您合并博客的工作量和复杂度，每个人都可以下载并修改成自己喜欢的样式！给这个开源小项目取个名字吧，由于本人狮子座（单身，苦笑），而且微信公众号名字也是取名：小狮子前端Vue ，由于并非自己开发的主题，起名就不添加theme了，那就叫hexo-blog-lionkk 。<<<<<>>>>>

hexo-theme-memory:最小的十六进制主题

05-10

六方主题记忆记忆是的基本主题。此主题也可用于：幽灵版：依存关系安装以下Hexo插件以释放此主题的全部潜力：十六进制生成器归档生成器标签 hexo-renderer-ejs hexo-renderer-scss 十六进制渲染器标记六分页己烯客制化可通过主题目录下的_config.yml文件来自定义主题。 Hexo的全局_config.yml也可能需要自定义。特别是：将disqus_shortname字段设置为您的disqus短名称。将theme字段设置为hexo-theme-memory 。除了这些设置之外，用户可能还希望编辑/替换以下文件：替换站点徽标： source/img/logo.png ， source/img/logo.psd 图标字体来自。该主题支持以下搜索服务： Google自定义搜索阿尔及利亚搜索 Micros

Hexothemediaspora一款基于WP移植的Hexo响应式主题

08-10

一款基于WP移植的Hexo主题，适合喜欢摄影，影评，乐评和玩弄文字的你，干净，清新；响应式，Ajax，更多好玩的等你来发现。

hexo-matery主题魔改日记（1）

qq_51661411的博客

01-05

1383

hexo-matery添加站点统计页面之前有不少铁子让我写一写教程，一直在折腾就没空写现在空了打算逐步开始写一写（本站大多数页面都是我从别人网站借鉴来的），写出来能帮助到有需要的好兄弟也是挺棒的。演示页面由于本站建站时间太短，数据过少，导致 [统计]<https://hesifan.top/census >效果并不好，可以去[大佬的站点]<https://bestzuo.cn/s/statistics >查看效果。百度统计去百度统计注册账号，添加站点会得到一段js代码以

[EasyHexo 专栏] #2 - 魔改 Next 不完全教程

weixin_33769125的博客

01-21

613

EasyHexo

Hexo博客之butterfly主题优雅魔改系列（持续更新）