啊哈！最近有人问博客“关于”我的那个聊天窗口是怎么搞的。今天我就来教大家！小白也能学会

首先，我的博客主题是sakurairo的，所以有些东西也适配sakura主题的，如果是其他博客主题，可以直接复制下面代码，然后复制到新建about.html里面。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>关于我？</title>
		<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/gh/Karensky/cdn@1.0.6/Sakura/style.css" />
	</head>
	<body>
		<div id="content" class="site-content">
			<div class="entry-content">
				<div class="moe-mashiro" style="text-align:center; font-size: 50px; margin-bottom: 20px;">[叶小兽]</div>
				<div class="popcontainer" id="fogforest" style="min-height:300px; padding:2px 6px 4px 6px; background-color: rgba(242, 242, 242,0.5); border-radius: 10px; 2px solid">
					<center>
					<h4>与&nbsp;叶小兽&nbsp;对话中...</h4>
					</center>
					<bot-ui>
						<center>
						<div style=" background-image: url(https://cdn.jsdelivr.net/gh/Karensky/cdn@1.0.6/botui/loading.svg);background-repeat: no-repeat;background-size: 10em;background-position: center;height: 10em;"></div>
						<p>Loading</p>
						</center>
					</bot-ui>
				</div>
			</div>
		</div>
	</body>
	<script type='text/javascript' src='https://xxx这里写你的域名/botui.js'></script>
</html>

然后我们获取下面文件，需要关注一下公众号哈哈哈，帮我积攒一下人气啦~~~

关注微信公众号『小兽万事屋』回复 256 获取文件

将botui.js文件上传至网站根目录

之后我们访问然后访问https://你的域名/about.html

然后我们就可以看见效果了！那我们怎么吧这个界面放到自己想要显示的地方呢？那我们复制下面用iframe语法嵌入到自己想要显示聊天对话框的页面

<iframe src="https://你的域名/about.html" height="500" frameborder="no" border="0" width="100%"> </iframe>

那我们怎么修改聊天当中的文字呢？

我们打开网站根目录下的 botui.js文件 ，滑到最下面，我们就可以看见回复的编辑页啦~在这里改成你自己的设定就可以了哦！

如果有什么问题可以随时在下面评论哦，小兽看见了会第一时间回复你的，如果喜欢小兽的话可以投喂一下哦~~