php博客添加live2d,在博客中增加自己的live2d纸片人模型方法

准备工具github仓库：存放live2d模型和json文件

如果你的博客支持本地存放文件也可，主要是博客园只支持几种格式，太坑了。

注意如果你使用git仓库的话，firefox浏览器可能不能成功显示，原因是CORS安全策略阻止了跨源申请

现成的带json的live2d模型。

这个可以到资源群或者百度贴吧去找(也可以自己做

如果没有的话，作者推荐了两个少女前线的模型，非常好康，地址放在文末

使用步骤

没有模型请跳过。上传模型到github仓库或本地仓库

这里给出传git的步骤

当然也可以fork到自己的仓库，直接用我的也行呀QwQ注册账号并新建仓库

上传文件，就是上面那个Upload File，格式就是打个包到文件夹中，拖到指定区域就行了

点开文件夹，再点开里面的model.json，此时网址如

https://github.com/用户名/仓库名/blob/master/ots-14/model.json

点击代码框上面的“Raw”按钮，生成外链

这样就准备好了

把下列代码添加到HTML文件中：(如果是博客园用户，需要申请js权限，在“ 页脚Html代码”中输入)

L2Dwidget.init({

"model": {

//jsonpath控制显示模型

jsonPath: "https://raw.githubusercontent.com/parker0523/res/master/ots-14/model.json",

"display": {

"position": "right", //看板娘的表现位置

"width": 200, //宽度

"height": 350, //高度

"hOffset": -50,

"vOffset": -20

"mobile": {

"show": true,

"react": {

"opacityDefault": 1,//不透明度，可调

"opacityOnHover": 0.2

}

});

代码中的网址就是上面准备的网址

有一些参数，可根据自己博客实际来调。

这个是支持交互的，只不过我给的live2d模型没有语音。。。

给一个效果图吧：

附件

就两个网址：

这个是OTS-14的

https://raw.githubusercontent.com/parker0523/res/master/ots-14/model.json

这个是索米的

https://pelom.top/usr/file/live2d/assets/GF/kp31/model.json

直接替换代码中的即可

用不起的或者想找我要live2d模型的可以留言呀QwQ(我尽量及时回复

我目前有的live2d：88type

95 玉玲珑

dsr50 红牡丹/最高出价

fn57 儿童节皮肤

g36c 约会

g41 泳装

格琳娜

灰熊

416 星之茧

索米kp31 幸福使命/泳装

ntw20 女仆咖啡厅

汤姆森恶魔猎人

px4 圣诞节

rfb 圣诞节

小狮子南瓜

type64-ar

vector 盲信者

wa2000 古堡历险

维尔德

ots-14 紫雨心

澄清

少女前线live2d模型有版权，请勿用于商业用途！

php博客添加live2d,在博客中增加自己的live2d纸片人模型方法相关推荐

Hexo博客优化：在Next主题中设置进阶版Live2D看板娘————拒绝踩坑！！！！
最初级的用法使用官方包安装,安装非常简单,但效果一般 hexo live-2d地址:https://github.com/xiazeyu/live2d-widget-models git命令行中输入 ...
html给看板娘添加语音,如何给你的Jekyll博客添加可爱的二次元看板娘(Live2D)
8种机械键盘轴体对比本人程序员,要买一个写代码的键盘,请问红轴和茶轴怎么选? 有朋友问这个右下角的小东西是怎么弄出来的,今天就手把手教你.请往下看: Live2D Add the Sseexxyyy ...
(三) 给你的博客添加看板娘(Live2D)HEXO+icarus
HEXO+icarus主题给博客添加看板娘(Live2D) 最近在很多博客左下角或者右下角有看到小人(看板娘),折腾了一番搜到的都没有达到预期的效果,并且大多数教程都是基于Next来做的,本人使用的 ...
用html5看板娘,HEXO+icarus主题给博客添加看板娘(Live2D)
最近在很多博客左下角或者右下角有看到小人(看板娘),折腾了一番搜到的都没有达到预期的效果,并且大多数教程都是基于Next来做的,本人使用的主题是Icarus,跟Next有细微的区别.后面找到了大神的作 ...
Hexo 博客添加 3D 看板娘替换原来的 Live2D
0.前言前两天用 VRoid Studio 捏了一个 3D 的 loli ,后来想想能不能把这个 3D 形象替换到那个博客站点的原来的 Live2D 看板娘那边去.花了一上午时间在 GitHub 上 ...
WordPress博客添加看板娘
效果如下: WordPress博客添加看板娘(送37套服饰) 1. 从我的github下载压缩包该压缩包已经自带37套服饰.支持换装功能.支持经典动漫台词展示.未来还会支持钉宫日语50音发声喔~ ...
给你的网页添加看板娘（以给博客园博客添加看板娘为例）（保姆级图文）
步骤系列文章前言 1.下载看板娘资源 2.上传资源到文件 3.在设置中调用资源 4.看看效果总结系列文章提示:转到日常小技巧专栏,观看更多内容! 点我直达–>日常小技巧专栏前言给你 ...
Hexo 博客添加看板娘
Hexo 博客添加看板娘相信看到这里的小伙伴都有属于自己的hexo博客了吧,废话不多说,我们直接进入主题我的博客:传送门 1.安装模块在hexo根目录下用Git执行命令 npm install ...
博客园 cnblogs博客添加Google Analytics统计
在cnblogs的文章列表中只可以看到自己的每篇文章的页面浏览量,没有详细的统计信息.Google Analytics作为强大的统计工具,能得到几乎所有想要的统计信息,是博客不可多得的好工具,本文介绍 ...

php博客添加live2d,在博客中增加自己的live2d纸片人模型方法

php博客添加live2d,在博客中增加自己的live2d纸片人模型方法相关推荐

最新文章

热门文章