春节挂件图标修复教程

问题现象

开启春节主题后，所有挂件（小鱼、花灯、福袋、财神等）显示的都是同一张图片 homes.png，没有各自对应的图标。

原因分析

themes/hexo-theme-matery/layout/layout.ejs 中，所有挂件的 <img src> 都指向了同一个占位图：

<!-- 错误写法：全部使用同一个图片 -->
<img class="caishenpic lala" src="https://cdn.jsdelivr.net/gh/haoxihuan/666@main/spring-img/homes.png">
<img class="caishenpic huadengpic" src="https://cdn.jsdelivr.net/gh/haoxihuan/666@main/spring-img/homes.png">
<img class="caishenpic fudai" src="https://cdn.jsdelivr.net/gh/haoxihuan/666@main/spring-img/homes.png">
<!-- ...全部都是 homes.png -->

另外部分挂件使用了已失效的外部链接 https://7.dusays.com/...，导致图片加载失败。

修复步骤

第一步：确认本地图片资源存在

检查 themes/hexo-theme-matery/source/medias/spring-img/ 目录，确认以下文件齐全：

baozhu.png      爆竹
caishen.png     财神
denglong.png    灯笼
dragon-boat.png 划船
fish.png        小鱼
fudai.png       福袋
fudao.png       福到
gugu.png        大鼓
homes.png       节日模式按钮（保留原样）
huadeng.png     花灯
lion.png        老虎
maozi.png       帽子
nianhuo.png     年货
shanzi.png      扇子

第二步：修改 layout.ejs

文件路径： themes/hexo-theme-matery/layout/layout.ejs

找到所有挂件区域（约第102-236行），按以下对应关系修改 src：

挂件名称	CSS 类名	正确的 src 路径
节日模式按钮	chunjiepic	https://cdn.jsdelivr.net/gh/haoxihuan/666@main/spring-img/homes.png（不改）
小鱼挂件	lala	/medias/spring-img/fish.png
花灯挂件	huadengpic	/medias/spring-img/huadeng.png
福袋挂件	fudai	/medias/spring-img/fudai.png
财神挂件	caishenpic	/medias/spring-img/caishen.png
大门挂件	huadengpic	/medias/spring-img/denglong.png
扇子挂件	shanzipic	/medias/spring-img/shanzi.png
福到挂件	fudao	/medias/spring-img/fudao.png
年货挂件	huadengpic	/medias/spring-img/nianhuo.png
老虎挂件	lions	/medias/spring-img/lion.png
划船挂件	huadengpic	/medias/spring-img/dragon-boat.png
爆竹挂件	lions	/medias/spring-img/baozhu.png
大鼓挂件	gugus	/medias/spring-img/gugu.png
标签小帽子	labelmz	/medias/spring-img/maozi.png
头像小帽子	xiaomaozitx	/medias/spring-img/maozi.png
友链小帽子	friendmz	/medias/spring-img/maozi.png

修改示例

<!-- 修改前 -->
<img class="caishenpic lala" src="https://cdn.jsdelivr.net/gh/haoxihuan/666@main/spring-img/homes.png">

<!-- 修改后 -->
<img class="caishenpic lala" src="/medias/spring-img/fish.png">

<!-- 修改前（失效链接） -->
<img class="caishenpic gugus" src="https://7.dusays.com/2021/02/15/ac9830e410169.png">

<!-- 修改后 -->
<img class="caishenpic gugus" src="/medias/spring-img/gugu.png">

第三步：验证并生成

hexo clean && hexo g && hexo s

打开浏览器访问 http://localhost:4000，点击页面上的节日模式按钮，检查每个挂件是否显示了各自对应的图标。

注意事项

1. 节日模式按钮不改：chunjiepic 类的 homes.png 是切换按钮的图标，不是挂件，保持原样。
2. 使用本地路径：建议用 /medias/spring-img/xxx.png 而非外部 CDN，加载更快且不受外部链接失效影响。
3. 路径开头有斜杠：/medias/... 而非 ./medias/... 或 medias/...，确保从网站根目录正确解析。

修改文件清单

文件	修改内容
themes/hexo-theme-matery/layout/layout.ejs	将所有挂件的 src 从占位图/失效链接改为正确的本地图标路径