第三方插件

第三方插件引用实现雪花效果

同时在前端页面我引入了雪花动态效果可以很直观的看到细雪纷飞的景色，使前端页面极具观赏性。代码直接引入到前端页面中即可。

1、唯美浪漫雪花飘落jquery特效代码。

演示页面：http://www.lmlblog.com/winter/。

代码添加如下：

<script src="http://www.lmlblog.com/winter/templets/xq/js/snowy.js"></script>
<style type="text/css">
.snow-container{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:100001;}</style>
<div class="snow-container"></div>

2、冬季HTML5 3D雪花斜着飘落动画场景特效

演示页面：
http://www.lmlblog.com/blog/12/
http://www.lmlblog.com/blog/xue2/

代码添加如下：

<script src="http://www.lmlblog.com/winter/templets/xq/js/snowy.js"></script>
<script src="http://www.lmlblog.com/blog/12/js/Snow.js"></script>
<style type="text/css">
.snow-container{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:100001;}
</style>
<div class="snow-container"></div>

3、html5 canvas制作3D逼真冬天雪景雪花飘场景

演示页面：
http://www.lmlblog.com/blog/14/
http://www.lmlblog.com/blog/xue1/

代码添加如下：

<script src="http://www.lmlblog.com/winter/templets/xq/js/snowy.js"></script>
<script src="http://www.lmlblog.com/blog/14/js/Snow.js"></script>
<style type="text/css">
.snow-container{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:100001;}
</style>
<div class="snow-container"></div>

第三方插件引用实现Live2D 看板娘

在左下角我们可以发现一个动漫式的人物，也是引入的一个第三方插件，叫Live2D看板娘，是一个比较经典的博客互动模型，支持换装，换人物，信息互动等功能。也可自定义功能。集成也非常简单网上一找一大堆。而我采用的是一个最简便的方式，直接通过js代码直接引用，无需写更多的代码即可在我们的页面上出现一个活波可爱的看板娘了。当然它的弊端就是我们不可以对他进行自定义人物布局，换装等功能，只能使用已经提供好的一些功能。

三种引用方式：

第一种：功能比较简单只有一个人物，可自定义宽高，位置等。如何安装看板娘：只需在网页中引入这几行代码即可。

<script src="https://cdn.jsdelivr.net/npm/live2d-widget@3.0.4/lib/L2Dwidget.min.js"></script>
<script type="text/javascript">
    L2Dwidget.init({

        "display": {
            "position": "right", // 定位位置（"left"/"right"/"top"/"bottom"）
            "width": 105, // 宽度
            "height": 170, // 高度
            "hOffset": 0,
            "vOffset": 0
        },
        "mobile": {
            "show": true,
            "scale": 0.5
        },
        "react": {
            "opacityDefault": 1, // 透明度
            "opacityOnHover": 0.8
        },

        "dialog":{
            enable:true,
            script:{
                'tap body':'2',
                'tap face':'3',
            }
        }
    });

第二种：功能多一点，可以换装和换人物，出现在页面的左下角不可调整位置

<script src="https://cdn.jsdelivr.net/npm/jquery/dist/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/font-awesome/css/font-awesome.min.css"/>
<script src="https://cdn.jsdelivr.net/gh/stevenjoezhang/live2d-widget/autoload.js"></script>

第三种：以下代码粘贴后，你可以在网页上看见一个大大的初音未来，如果你还行更换为其它模型，则需要将上面的代码稍微改动一下，将init函数中的jsonPath中的地址更换为你喜欢的模型名称即可

<script src="https://eqcn.ajz.miesnfu.com/wp-content/plugins/wp-3d-pony/live2dw/lib/L2Dwidget.min.js"></script>
<script>
	L2Dwidget.init({
        "model": {
            jsonPath: "https://unpkg.com/live2d-widget-model-miku@1.0.5/assets/miku.model.json",
            "scale": 1
        },
        "display": {
            "position": "left",
            "width": 150,
            "height": 300,
            "hOffset": 0,
            "vOffset": -20
        },
        "mobile": {
            "show": true,
            "scale": 0.5
        },
        "react": {
            "opacityDefault": 0.3,
            "opacityOnHover": 0.2
        }
    });
</script>

部分2D模型名称
live2d-widget-model-chitose
live2d-widget-model-epsilon2_1
live2d-widget-model-gf
live2d-widget-model-haru/01 (use npm install --save live2d-widget-model-haru)
live2d-widget-model-haru/02 (use npm install --save live2d-widget-model-haru)
live2d-widget-model-haruto
live2d-widget-model-hibiki
live2d-widget-model-hijiki
live2d-widget-model-izumi
live2d-widget-model-koharu
live2d-widget-model-miku
live2d-widget-model-ni-j
live2d-widget-model-nico
live2d-widget-model-nietzsche
live2d-widget-model-nipsilon
live2d-widget-model-nito
live2d-widget-model-shizuku
live2d-widget-model-tororo
live2d-widget-model-tsumiki
live2d-widget-model-unitychan
live2d-widget-model-wanko
live2d-widget-model-z16
注:部分动画效果可以到https://huaji8.top/post/live2d-plugin-2.0/查看

第三方插件引用实现音乐盒

史上最精简的音乐播放器！300多行js！你想要的功能zplayer都有！
该博主的github：https://gitee.com/mnb/zplayer

1、down下来本项目后，在页面内引入 css/zplayer.min.css和js/zplayer.min.js

2、使用方法以及参数说明（autoplay，showlrc，fixed，listFolded，listMaxHeight五个参数可以不传，则走默认值,具体见以下代码示例）。

<div id="player"></div>
<script>
    var zp = new zplayer({
        element: document.getElementById("player"),
        autoPlay: false,/*是否开启自动播放,默认false*/
        lrcStart: true,/*是否开启歌词功能 ，默认false（为true时musics集合中需要传入lrc字段。）*/
        showLrc: true,/*开启歌词功能后是否立即展示歌词内容 ，默认false*/
        fixed: true, /*是否固定在底部，默认false*/
        listFolded: true, /*列表默认折叠，默认false*/
        listMaxHeight: 300, /*列表最大高度，默认240*/
        musics: [{
            title: "可能否",
            author: "木小雅",
            url: "http://music.163.com/song/media/outer/url?id=569214126.mp3",
            pic: "http://p1.music.126.net/SJYnDay7wgewU3O7tPfmOQ==/109951163322541581.jpg?param=300x300",
            lrc:"[00:00] 作曲 : 木小雅\n[00:01] 作词 : 木小雅\n[00:17]春天的风 能否吹来夏天的雨\n[00:25]秋天的月 能否照亮冬天的雪\n[00:34]夜空的星 能否落向晨曦的海\n[00:42]山间的泉 能否遇上南飞的雁\n[00:49]能否早一点 看透命运的伏线\n[00:53]能否不轻易就深陷\n[00:57]能否慢一点 挥霍有限的时间\n[01:01]能否许我一个永远\n[01:07]可能我撞了南墙才会回头吧\n[01:11]可能我见了黄河才会死心吧\n[01:15]可能我偏要一条路走到黑吧\n[01:20]可能我还没遇见 那个他吧\n[01:26]\n[01:44]断掉的弦 能否扯破自缚的茧\n[01:52]熄灭的火 能否烧光残留的念\n[02:00]梦中的云 能否化作熟悉的脸\n[02:08]前世的劫 能否换来今生的缘\n[02:16]能否早一点 相信年少的誓言\n[02:20]能否不轻易说再见\n[02:24]能否慢一点 感受岁月的缱绻\n[02:28]能否许我一次成全\n[02:34]可能我撞了南墙才会回头吧\n[02:38]可能我见了黄河才会死心吧\n[02:42]可能我偏要一条路走到黑吧\n[02:46]可能我还没遇见 那个他吧\n[02:53]\n[02:54]可能我撞了南墙才会回头吧\n[02:58]可能我见了黄河才会死心吧\n[03:02]可能我偏要一条路走到黑吧\n[03:06]可能我还没遇见 那个他吧\n[03:14]可能我还没忘掉 哪个他吧\n[03:20]\n[03:22]制作人：王佳依\n[03:24]监制：姚政\n[03:25]编曲：闫津\n[03:26]吉他：吴金迪\n[03:28]录音师：陈程\n[03:31]缩混：陈程\n"
        },{
            title: "讲真的",
            author: "曾惜",
            url: "http://music.163.com/song/media/outer/url?id=30987293.mp3",
            pic: "http://p1.music.126.net/cd9tDyVMq7zzYFbkr0gZcw==/2885118513459477.jpg?param=300x300",
            lrc:"[by:却连一句我爱你都不能说出口]\n[ti:讲真的]\n[ar:曾惜]\n[al:不要你为难]\n[by:冰城离殇]\n[00:00] 作曲 : 何诗蒙\n[00:01] 作词 : 黄然\n[00:18]今夜特别漫长\n[00:21]有个号码一直被存放\n[00:25]源自某种倔强\n[00:30]不舍删去又不敢想\n[00:33]明明对你念念不忘\n[00:37]思前想后愈发紧张\n[00:41]无法深藏\n[00:43]爱没爱过想听你讲\n[00:48]讲真的\n[00:51]会不会是我 被鬼迷心窍了\n[00:54]敷衍了太多 我怎么不难过\n[00:58]要你亲口说 别只剩沉默\n[01:03]或许你早就回答了我\n[01:06]讲真的\n[01:08]想得不可得 是最难割舍的\n[01:11]各自好好过 也好过一直拖\n[01:15]自作多情了 好吧我认了\n[01:19]至少能换来释怀洒脱\n[01:23]没丢失掉自我\n[01:42]今夜特别漫长\n[01:44]有个号码一直被存放\n[01:49]源自某种倔强\n[01:53]不舍删去又不敢想\n[01:57]明明对你念念不忘\n[02:01]思前想后愈发紧张\n[02:05]无法深藏\n[02:08]爱没爱过想听你讲\n[02:13]讲真的\n[02:15]会不会是我 被鬼迷心窍了\n[02:19]敷衍了太多 我怎么不难过\n[02:23]要你亲口说 别只剩沉默\n[02:27]或许你早就回答了我\n[02:30]讲真的\n[02:32]想得不可得 是最难割舍的\n[02:35]各自好好过 也好过一直拖\n[02:40]自作多情了 好吧我认了\n[02:44]至少能换来释怀洒脱\n[02:47]没丢失掉自我\n[03:04]讲真的\n[03:05]会不会是我 被鬼迷心窍了\n[03:09]敷衍了太多 我怎么不难过\n[03:14]要你亲口说 别只剩沉默\n[03:18]或许你早就回答了我\n[03:21]讲真的\n[03:22]想得不可得 是最难割舍的\n[03:26]各自好好过 也好过一直拖\n[03:30]自作多情了 好吧我认了\n[03:35]至少能换来释怀洒脱\n[03:38]没丢失掉自我\n"
        }]
    });
    zp.init();
</script>

参考文章

https://blog.csdn.net/weixin_45019350/article/details/108884202

A dream chaser who focuses on technology and often sits at a desk by the window drinking milk tea while reading a book on a warm afternoon.

https://myhkw.cn/admin/#/player/166159348587/code/ 明月浩空音乐播放器

https://html5up.net/dimension/ 一款基于Dimension的个人引导页

https://butterfly.wiki/ 一款好看的樱花个人引导页，基于Dimension的二次修改。

https://github.com/layui/layer/ 丰富多样的 Web 弹出层组件，可轻松实现 Alert/Confirm/Prompt/ 普通提示/页面区块/iframe/tips等等几乎所有的弹出交互。

https://jvectormap.com/ JVectorMap 是一个优秀的、兼容性强的 jQuery 地图插件。它可以工作在包括 IE6 在内的各款浏览器中，矢量图输出，除官方提供各国地图数据外，用户可以使用数据转换程序定制地图数据。例如街道地图、小区地图等等。

https://www.mathjax.org/
https://www.overleaf.com/learn/latex/Mathematical_expressions
https://js.org/
https://www.npmjs.com/package/hexo-renderer-kramed
https://bestzuo.cn/posts/halo-beauty.html
https://i.loli.net/ i.loli.net 是 SM.MS 免费图床的图片 CDN 域名，所有内容均由用户自行上传，如有违反版权、涉及暴力色情恐怖等图片，请及时联系 abuse@loli.net
https://www.sojson.com/rgb.html
https://www.docusaurus.cn/showcase

https://www.imgcook.com 设计稿智能生成代码
https://www.thosefree.com/vue-vben-admin Vue vben admin
https://codepen.io
https://dribbble.com
https://tianli-blog.club/
https://img.api.tianli0.top

一为导航修改

一台服务器创建多个halo站点，修改端口号，"想要修改的端口号:8090"

8090不可更改，前面可以是任意端口。

halo:

image: halohub/halo:2.6.0

container_name: halo3

restart: on-failure:3

volumes:

- ./:/root/.halo2

ports:

- "8091:8090"

菜单

分享

第三方插件

第三方插件

第三方插件引用实现雪花效果

1、唯美浪漫雪花飘落jquery特效代码。

2、冬季HTML5 3D雪花斜着飘落动画场景特效

3、html5 canvas制作3D逼真冬天雪景雪花飘场景

第三方插件引用实现Live2D 看板娘

第一种：功能比较简单只有一个人物，可自定义宽高，位置等。如何安装看板娘：只需在网页中引入这几行代码即可。

第二种：功能多一点，可以换装和换人物，出现在页面的左下角不可调整位置

第三种：以下代码粘贴后，你可以在网页上看见一个大大的初音未来，如果你还行更换为其它模型，则需要将上面的代码稍微改动一下，将init函数中的jsonPath中的地址更换为你喜欢的模型名称即可

第三方插件引用实现音乐盒

1、down下来本项目后，在页面内引入 css/zplayer.min.css和js/zplayer.min.js

2、使用方法以及参数说明（autoplay，showlrc，fixed，listFolded，listMaxHeight五个参数可以不传，则走默认值,具体见以下代码示例）。

参考文章

A dream chaser who focuses on technology and often sits at a desk by the window drinking milk tea while reading a book on a warm afternoon.

评论

speedtest-cli测试网速安装教程

1Panel自定义安装PHP扩展

MaxKB安装教程

随机图片Api

封面设计

ChatGPT搭建API代理服务

FastGPT：一个基于 LLM 大语言模型的知识库问答系统

LibreChat: 一个增强版的 ChatGPT 套壳程序

LobeChat：搭建你的私人 GPT 助手

GitHub Readme Stats