本站之宝 - 二次元看板娘设置教程

手机版打开可能会无法显示,你可以将链接复制到浏览器,设置浏览器标识为电脑,就能看到二次元老婆了 :huaji3:

 

动态显示,而且这个插件还可以支持换装,换人物,点击一下她就会移动,还会说很多话哦! :huaji2: 刺激吧~

插件为wordpress插件,下载后解压直接上传到wp-content/plugins文件夹即可

插件文末下载

当然你也可以选择自己做,好处就是任务可以自己选择更多

自己搭建可以增加更多功能,还可以添加聊天

推荐一个live2sd 模型的网站YJLAugus

教程开始

1.先在路径为wp-content/themes/你的主题名称,文件夹的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 文件。

 

插件及教程搬自小游网

感谢小游大佬提供

插件下载地址(蓝奏云):

抱歉,只有登录并在本文发表评论才能阅读隐藏内容

 

:huaji3: 反正滑稽就对了

点赞
  1. 昔日轮回 hyk0416说道:

    :huaji: 咋没人评论呢 我好难啊 :huaji2:

发表评论

昵称和uid可以选填一个,填邮箱必填(留言回复后将会发邮件给你)
tips:输入uid可以快速获得你的昵称和头像

Title - Artist
0:00