当前位置:首页技术屋网站源码WordPress给网站添加一个聊天机器人
!
也想出现在这里? 联系我们
内容广告区块

WordPress给网站添加一个聊天机器人

效果图

教程

  • 在主题的pages里新建一个php文件,然后把代码复制进去修改成自己想要的信息即可!
<?php

/**
 * Template name: XY - 关于本站
 * Description:   XY - 森巷鹿屿
 */

// 添加聊天机器人
get_header();
?>
<style>

</style>
<link rel="stylesheet" type="text/css" href="../cdn/css/normalize.css" />
<link rel="stylesheet" type="text/css" href="../cdn/css/demo.css">
<link rel="stylesheet" href="../cdn/dist/botui.min.css" />
<link rel="stylesheet" href="../cdn/dist/botui-theme-default.css" />
<main role="main" class="container">
<div class="zib-widget tens">
  <div class="htmleaf-content">
  <div class="botui-app-container" id="home-demo" style="min-height: 300px; padding: 2px 6px 4px; background-color: rgba(242, 242, 242, 0.5); border-radius: 10px;">
      <center><h4 style="font-weight: 700;">你正在与<a href="https://21lhz.cn">森屿</a>对话中...</h4></center>
      <bot-ui></bot-ui>
  </div>
</div>
<script type="text/javascript" src="../cdn/js/vue.min.js"></script>
<script type="text/javascript" src="../cdn/dist/botui.min.js"></script>
<script type="text/javascript">
  var homeBot = BotUI('home-demo');
  homeBot.message.add({
    content: 'Hi, 你好!?'
  }).then(function () {
    return homeBot.message.add({
      delay: 1500,
      content: '我是 森屿'
    });
  }).then(function () {
    return homeBot.message.add({
      delay: 1500,
      content: '我是这个网站的站长,一个可爱的蓝孩子~?'
    });
  }).then(function () {
    return homeBot.message.add({
      delay: 1500,
      content: '我是一名UI设计师,在业余时间玩一下网站!?'
    });
  }).then(function () {
    return homeBot.action.button({
      delay: 1000,
      action: [{
        text: ' 然后呢? ?',
        value: 'sure'
      }, {
        text: ' 少废话! ?',
        value: 'skip'
      }]
    });
  }).then(function (res) {
    if(res.value == 'sure') {
      tutorial();
    }
    if(res.value == 'skip') {
      end();
    }
  });

  var tutorial = function () {
    homeBot.message.add({
      delay: 1000,
      content: "?"
    }).then(function () {
      return homeBot.message.add({
        delay: 1000,
        content: '怎么称呼你呢?'
      });
    }).then(function () {
      return homeBot.message.add({
        delay: 1200,
        content: '你的名字(填写后按回车键)'
      });
    }).then(function () {
      return homeBot.action.text({
        delay: 800,
        action: {
          value: '森屿的小弟',
          placeholder: '填写你的名字'
        }
      });
    }).then(function (res) {
      return homeBot.message.bot({
        delay: 500,
        content: res.value + ' 是个好名字!'
      });
    }).then(function (res) {
      return homeBot.message.bot({
        delay: 1400,
        content:'你有什么想了解的吗?'
      });
    }).then(function () {
    return homeBot.action.button({
      delay: 1000,
      action: [{
        text: ' 你为什么会建这个网站呢? ?',
        value: 'sure'
      }, {
        text: ' 我没什么想了解的! ?',
        value: 'skip'
      }]
    });
  }).then(function (rea) {
    if(rea.value == 'sure') {
      tutorial2();
    }
    if(rea.value == 'skip') {
      end();
    }
  });};
  
  var tutorial2 = function () {
    homeBot.message.add({
      delay: 1000,
      content: '闲着无聊就想着拥有属于自己的网站,于是就创建“森巷鹿屿”,并且对代码格外感兴趣。'
    }).then(function () {
      return homeBot.message.bot({
        delay: 1000,
        content: '学习了一些前端语言、PHP等,现在正在学习C4D建模...'
      });
    }).then(function () {
      return homeBot.message.bot({
        delay: 1000,
        content: '非常喜欢折腾,热爱折腾,目前正在计算机一道上探索中。'
      });
    }).then(function () {
    return homeBot.action.button({
      delay: 1000,
      action: [{
        text: ' 为什么叫 森巷鹿屿 呢? ?',
        value: 'sure'
      }, {
        text: ' 好的!我知道了! ?',
        value: 'skip'
      }]
    });
  }).then(function (rea) {
    if(rea.value == 'sure') {
      tutorial3();
    }
    if(rea.value == 'skip') {
      end();
    }
  });};
  
  var tutorial3 = function () {
    homeBot.message.add({
      delay: 1000,
      content: 'emmm..玩游戏时用的游戏名称,觉得挺好听的,于是我就一直使用到现在!'
    }).then(function () {
    return homeBot.action.button({
      delay: 1000,
      action: [{
        text: '森屿这词是有什么含意吗?(ง •_•)ง',
        value: 'sure'
      }]
    });
  }).then(function (rea) {
    if(rea.value == 'sure') {
      tutorial4();
    }
  });};
   
   var tutorial4 = function () {
    homeBot.message.add({
      delay: 1000,
      content: '其实也没啥含意吧?就是觉得“森屿”这词给人一种很牛逼的感觉。'
    }).then(function () {
    return homeBot.action.button({
      delay: 1000,
      action: [{
        text: '你的网站采用什么进行搭建的?(╹ڡ╹ )',
        value: 'sure'
      }]
    });
    }).then(function (rea) {
    if(rea.value == 'sure') {
          tutorial5();
      }
    });};
    
    var tutorial5 = function () {
    homeBot.message.add({
      delay: 1000,
      content: '本站采用的是WordPress+子比主题来进行搭建与创作的。'
    }).then(function () {
      return homeBot.message.bot({
        delay: 1000,
        content: '最后非常感谢您光临本站,如果我的文章对您有所帮助的话,那么是我最大的荣幸 ?'
      });
    }).then(end);};

  var end = function () {
    homeBot.message.add({
      delay: 1000,
      content: '--------------------- 没有下文了哦 ---------------------'
    }).then(function () {
      return homeBot.message.bot({
        delay: 1000,
        content: '本站首页 <a href="https://www.liz0.top" style="color:#f00;">森巷鹿屿</a> 如果喜欢本站的话可以收藏一下哦!不喜欢的话也没关系,下次再喜欢吧!?'
      })
    });
  };
</script>
</div>
</main>
<?php
get_footer();

接下来就是css跟js了,已经打包好上传了,直接下载解压到根目录即可(你也可以解压到你喜欢的文件夹里,不过php里的css跟js引入路径记得修改)!

资源下载

下载权限

查看
  • 免费下载
    评论并刷新后下载
    登录后下载

查看演示

  • {{attr.name}}:
您当前的等级为
登录后免费下载登录 小黑屋反思中,不准下载! 评论后刷新页面下载评论 支付以后下载 请先登录 您今天的下载次数(次)用完了,请明天再来 支付积分以后下载立即支付 支付以后下载立即支付 您当前的用户组不允许下载升级会员
您已获得下载权限 您可以每天下载资源次,今日剩余
版权声明

   站内部分内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供网络资源分享服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请 联系我们 一经核实,立即删除。并对发布账号进行永久封禁处理。


本站仅提供信息存储空间,不拥有所有权,不承担相关法律责任。

给TA买糖
共{{data.count}}人
人已买糖
技术屋网站源码

ThnBoV1.3.0一款针对WordPress开发的缩略图美化插件

2022-6-20 9:44:29

技术屋网站源码

QQWorld收藏家豪华版(免授权)

2022-6-20 10:31:55

重要声明

如果遇到付费才可观看的文章,建议升级会员或者成为认证用户,全站所有资源任意下免费看”。未经本站的明确许可,任何人不得大量链接本站下载资源,不得复制或仿造本网站。本网站对其自行开发的或和他人共同开发的所有内容、技术手段技术手段和服务拥有全部知识产权,任何人不得侵害或破坏,不得擅自使用

3 条回复 A文章作者 M管理员
😊 表情
  • 眞白花音
  • 枕边童话
  • 嘉然
  • 雫るる
  1. 森语

    历史的发展是不以人的意志为转移的。

  2. 二蛋

    忘羡一曲远,曲终人不散