为你的博客添加二次元老婆


受够了千篇一律的单调界面?希望自己的博客有一点互动的效果?希望给自己的博客加一个二次元老婆?恭喜你来对地方了!下面我就给大家介绍一些可爱的动漫人物插件,喜欢的可以下载完后留下几个硬币再走?

B站23娘

作为B站的镇站之宝,放在我们的网页上是不是瞬间显得高大上了呢?而且这个插件还可以支持换装,换人物,点击一下她就会移动,还会说很多话哦!

先来几张效果图:

这里感谢插件的制作大佬:小白-白  插件的下载地址:github 

康纳

作为《小林家的龙女仆》的最萌角色,做成插件也是让很多人口馋不已(说的不是我)。

这里安装的话没有之前那个那么简单,需要我们自己手动搭建(不会的可以走了,不过这么可爱的插件你确定不学一学?)

不过如果你真的打算走的话,那么可就亏大了,因为下面介绍的自己搭建的看板娘不仅好看,而且还可以加入聊天功能哦!

先来几张图吸引你们:

1.先在网页的header中head标签中加嵌入如下代码

<link rel="stylesheet" href="/live2d/css/live2d.css" target="_blank" rel="external nofollow"  />

2.接下来就是需要找一个合适的位置插入我们的看板娘元素,注意要在body里面代码如下

注意:不同的模型是需要修改的,别问我怎么改

<div id="landlord" style="left:5px;bottom:0px;">
<div class="message" style="opacity:0"></div>
<canvas id="live2d" width="480" height="640" class="live2d"></canvas>
<div class="live_talk_input_body">
<div class="live_talk_input_name_body">
<input name="name" type="text" class="live_talk_name white_input" id="AIuserName" autocomplete="off" placeholder="你的名字" />
</div>
<div class="live_talk_input_text_body">
<input name="talk" type="text" class="live_talk_talk white_input" id="AIuserText" autocomplete="off" placeholder="要和我聊什么呀?"/>
<button type="button" class="live_talk_send_btn" id="talk_send">发送</button>
</div>
</div>
<input name="live_talk" id="live_talk" value="1" type="hidden" />
<div class="live_ico_box">
<div class="live_ico_item type_info" id="showInfoBtn"></div>
<div class="live_ico_item type_talk" id="showTalkBtn"></div>
<div class="live_ico_item type_music" id="musicButton"></div>
<div class="live_ico_item type_youdu" id="youduButton"></div>
<div class="live_ico_item type_quit" id="hideButton"></div>
<input name="live_statu_val" id="live_statu_val" value="0" type="hidden" />
<audio src="" style="display:none;" id="live2d_bgm" data-bgm="0" preload="none"></audio>
<input name="live2dBGM" value="音乐地址" type="hidden">
<input id="duType" value="douqilai,l2d_caihong" type="hidden">
</div>
</div>
<div id="open_live2d">召唤康纳</div>

3.然后就是在页面的body标签结束前加上如下代码

<script type="text/javascript"src="https://apps.bdimg.com/libs/jquery/1.7.1/jquery.min.js"></script>
<script>
var message_Path = '/live2d/';//资源目录,如果目录不对请更改
var talkAPI = "";//如果有类似图灵机器人的聊天接口请填写接口路径
</script>
<script type="text/javascript" src="live2d/js/live2d.js"></script>
<script type="text/javascript" src="live2d/js/message.js"></script>

4.如果你想添加聊天功能的话,可以到图灵机器人官网注册账号,然后获取apikey,前面的接口路径改成 :网站域名/tlapi.php即可。下面是PHP代码,你需要自己新建一个tlapi.php文件到根目录

<?php
//获得聊天
$appkey = ''; //你的appkey
$talkContent = ""; 
$info=addslashes($_POST['info']);
$userid=addslashes($_POST['userid']);
function send_post($url, $post_data) {  
  

$postdata = http_build_query($post_data);
$options = array(
‘http’ => array(
‘method’ => ‘POST’,
‘header’ => ‘Content-type:application/x-www-form-urlencoded’,
‘content’ => $postdata,
‘timeout’ => 15 * 60 // 超时时间(单位:s)
)
);
$context = stream_context_create($options);
$result = file_get_contents($url, false, $context);

return $result;
}

//使用方法
$post_data = array(
‘key’ => $appkey,
‘info’ => $info,
‘userid’ => $userid,
);
if($appkey==””){
$talkContent = ‘{“code”:”500”,”text”:”我还没学会聊天功能,快和站长联系吧!”}’;
}
else{
$talkContent = send_post(‘http://www.tuling123.com/openapi/api‘, $post_data);
}
header(‘Content-type:text/json’);
echo $talkContent;
?>

教程到此结束,这里再说一下如果你想修改提示的话可以修改提示的请修改 message.json 文件。

这里感谢大佬提供的live2d文件,以及提供教程和文件的可乐

下载地址:点击下载 

纱雾

动漫作品《情色漫画老师》中女主角。跟学生作家和泉正宗没有血缘关系的妹妹,同时也是负责他作品插画的“情色漫画老师”。现在哔哩哔哩里《埃罗芒阿老师》也有她的身影哦!

这里我只展示效果,就不说怎么改了,具体自己参考上面就行了(只要改宽度和高度就行,这里时间有限,我就随便改了一下,实际上你们可以自己细细调整)

下载地址:点击下载  

加藤惠

这里我不不认识就不介绍了,自己下载就好 

下载地址:点击下载

蕾姆

或许你没看过《从零开始的异世界生活》,但你一定会感觉她很眼熟。

下载地址:点击下载

椎名真白

出自樱花庄的宠物女孩,一个很不错的番剧(感谢ashtwo提供)

下载地址:点击下载

伊斯特瓦尔

超次元游戏:海王星里的伊斯特瓦尔。(感谢aDREAMz提供

 

下载地址:点击下载

你肯定还没看够吧,下面给你介绍几位大佬(膜拜大佬)

这里可以下载很多live2d模型

 

这个可以换超多人物,还可以换装,还有小游戏

 

我的看板娘就是这个大佬的作品

 
差不多到这里该结束了,看多这么多的大佬,不禁感觉自己能力有限,向大佬致敬!

文章作者: 小游
版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 小游 !
  目录