仟杉博客

1. 打开主题配置文件

找到你的 Fluid 主题配置文件 _config.fluid.yml，通常位于 themes/fluid/_config.yml。

2. 添加自定义 CSS 和 JS

在 _config.fluid.yml 文件中，找到 custom_css 和 custom_js 配置项。如果这两个配置项不存在，你可以手动添加它们。

3. 添加鼠标效果的 CDN 链接

根据你想实现的效果，将对应的 CDN 链接添加到 custom_js 或 custom_css 中。

示例配置

# 自定义 CSS
custom_css:
  - https://cdn.jsdelivr.net/gh/EmoryHuang/BlogBeautify@1.1/shubiao.css

# 自定义 JS
custom_js:
  - https://cdn.jsdelivr.net/gh/EmoryHuang/BlogBeautify@1.1/love.min.js
  - https://cdn.jsdelivr.net/gh/EmoryHuang/BlogBeautify@1.1/star.min.js
  - https://cdn.jsdelivr.net/gh/EmoryHuang/BlogBeautify@1.1/DynamicLine.min.js

具体效果说明

• love.min.js：鼠标点击时出现爱心效果。
• star.min.js：鼠标移动时跟随的小星星效果。
• DynamicLine.min.js：鼠标跟随时动态线条效果。
• shubiao.css：自定义鼠标指针样式。

1. 烟花爆炸特效（Fireworks）

custom_js:
  - https://cdn.jsdelivr.net/npm/hexo-next-mouse-effect@latest/click/fireWorks.js

2. 鼠标点击出现爱心（Show Love）

custom_js:
  - https://cdn.jsdelivr.net/npm/hexo-next-mouse-effect@latest/click/showLove.js

3. 鼠标点击出现文字（Show Text）

custom_js:
  - https://cdn.jsdelivr.net/npm/hexo-next-mouse-effect@latest/click/showText.js

同时，在主题配置文件中添加自定义文字内容：

ClickShowText:
  text:
    - 富强
    - 民主
    - 文明
    - 和谐
    - 自由
    - 平等
    - 公正
    - 法制
    - 爱国
    - 敬业
    - 诚信
    - 友善
  fontSize: 15px
  random: true
  mobile: false

4. 鼠标移动跟随特效（Fairy Dust）

custom_js:
  - https://cdn.jsdelivr.net/npm/hexo-next-mouse-effect@latest/move/fairyDustCursor.js

5. 动态线条跟随（Dynamic Line）

custom_js:
  - https://cdn.bootcdn.net/ajax/libs/canvas-nest.js/2.0.4/canvas-nest.js

6. 鼠标点击出现礼花（Fireworks）

custom_js:
  - https://cdn.jsdelivr.net/npm/hexo-next-mouse-effect@latest/click/fireWorks.js

7. 鼠标移动跟随小星星（Stars）

custom_js:
  - https://cdn.jsdelivr.net/npm/hexo-next-mouse-effect@latest/move/starCursor.js

8. 鼠标点击出现气泡（Bubble）

custom_js:
  - https://cdn.jsdelivr.net/npm/hexo-next-mouse-effect@latest/click/bubble.js

保存并部署

完成上述配置后，保存文件并重新生成部署你的 Hexo 博客，即可看到这些炫酷的鼠标效果。

这些效果不仅可以提升博客的视觉体验，还能为访客带来更多的互动乐趣。你可以根据自己的喜好选择适合的效果进行添加！