个人中心
文章发布
退出
作者热门文章
- android - 多次调用 OnPrimaryClipChangedListener
- android - 无法更新 RecyclerView 中的 TextView 字段
- android.database.CursorIndexOutOfBoundsException : Index 0 requested, 光标大小为 0
- android - 使用 AppCompat 时，我们是否需要明确指定其 UI 组件(Spinner、EditText)颜色
24
4
您好，我已经使用网络聊天嵌入了 QnA Bot。我需要更改聊天窗口标题的 CSS。
我将机器人作为网络聊天嵌入到 ASP.net MVC 应用程序中。
我正在使用 iframe 方法将机器人嵌入到 webchhat 窗口中。使用 iframe 方法如何更改 css。
还有从“聊天”到“点击提问”的默认文本
我下载了 botchat.css 和 botchat.js。我在 _Layout.cshtml 中包含了 css 和 js 文件。我在 botchat.css 中将元素“.wc-header”的背景颜色更改为红色。但是仍然没有反射(reflect)出变化。
我想知道为什么 botchat.css 显示 botchat.css 是从 https://webchat.botframework.com/css/webchat-stable/botchat.css
有人可以帮助我如何使网络聊天窗口获取我已经修改并包含在 _Layout.cshtml 中的 botchat.css。
提前致谢
最佳答案
您好，这是我为更改 QnABot 的 Css 和聊天标题所做的。
首先我将 iframe 放在 _Layout.cshtml 文件中。 iframe 的 src 是一个名为 MyFAQChat.html 的 HTML 文件
要生成 MyFAQChat.html 的内容，您可以执行以下操作。
首先像这样在 _Layout.cshtml 中只放置 iframe
<div id='botDiv' style='height: 30px; position: fixed; bottom: 0;right: 0; z-index: 1000; background-color: #fff'><div id='botTitleBar' style='height: 30px; width: 300px; position:fixed; cursor: pointer;'></div><iframe width='300px' height='300px' src='https://webchat.botframework.com/embed/YOURBOTHANDLE?s= secretforWebchat'></iframe>
然后使用 F12 您可以看到 iframe 的内容。它看起来像这样
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>MyBot</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<style>
html, body {
height: 100%;
margin: 0;
padding: 0;
overflow: hidden;
}
</style>
<link href="../../Content/botchat.css" rel="stylesheet" />
<link href="/css/webchat-stable/botchat-fullwindow.css" rel="stylesheet" />
</head>
<body>
<div id="BotChatElement"></div>
<script src="Scripts/jquery-1.12.3.js"></script>
<script src="Scripts/Custom/botchat.js"></script>
<script>
var model = {
"userId": "someuserid",
"userName": "You",
"botId": "botIDhere",
"botName": "botNamehere",
"secret": "webchatsecretidhere",
"directLineUrl": "https://webchat.botframework.com/v3/directline",
"webSocketEnabled": "false"
};
</script>
<script>
BotChat.App({
directLine: {
secret: model.secret,
token: model.token,
domain: model.directLineUrl,
webSocket: false
},
user: { id: model.userId, name: model.userName },
bot: { id: model.botId, name: model.botName },
resize: 'window',
locale: 'en'
}, document.getElementById("BotChatElement"));
</script>
<script>
$(document).ready(function () {
var id = document.getElementsByClassName("wc-header");
id[0].innerHTML="Click for Help";
});
</script>
</body>
</html>
您可以复制 iframe 的内容并将其另存为 HTML 文件。然后在 _Layout.cshtml 中的 iframe 中引用此 html 文件。
html 文件包含更改聊天窗口标题的代码。我正在将其更改为单击以获取有关 document.ready 函数的帮助。
要更改机器人窗口的 CSS..我首先从 cdn 下载 botchat.css 和 botchat.js，然后更改 css 并将链接添加到 MyFAQChat.html 中的 css。
这是我在没有使用 webchat repo 的情况下使用的方法。
我在document.ready函数中的layout.cshtml中添加了iframe
$(document).ready(function () {
var div = document.createElement("div");
document.getElementsByTagName('body')[0].appendChild(div);
div.outerHTML = "<div id='botDiv' style='height: 38px; position: fixed; bottom: 0; z-index: 1000; background-color: #fff'><div id='botTitleBar' style='height: 38px; width: 400px; position:fixed; cursor: pointer;'></div><iframe width='400px' height='600px' src='https://webchat.botframework.com/embed/DSWebBotForFAQs?s=0SRsueCeamk.cwA.JIM.ShMx5BDubHOaIOY3fxrdB_do7iBd1os'></iframe></div>";
document.querySelector('body').addEventListener('click', function (e) {
e.target.matches = e.target.matches || e.target.msMatchesSelector;
if (e.target.matches('#botTitleBar')) {
var botDiv = document.querySelector('#botDiv');
botDiv.style.height = botDiv.style.height == '600px' ? '38px' : '600px';
};
});
});
关于css - 更改嵌入为网络聊天的 QnA Bot 的 Css，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/50510099/
24
4
0
我正在开发一个小型 Web 应用程序，其中有一个 object 元素(包含一个 embed)，用于显示小型文档。 文档可以是 PDF 或纯文本文件 (.txt)，我以 base64 字符串的形式从 W
我有一种小型语言，它基本上是 OCaml 的扩展(实际上它是 OCaml 子集的扩展，但这并不重要)。为了简化事情，我有一个“转义”表达式，可以将 OCaml 文字传输到我的语言中(因此您可以将任意
据我所知，我知道 embed tag用于嵌入来自 youtube 等网站的视频，object tag用于 Flash 视频和 video tags下HTML5 .但我很好奇这些标签的深入细节以及作为开
我假设您可以将 WebKit 嵌入到另一个桌面应用程序中并向其发送一个字符串，例如: Hello world! 它将显示在窗口内。 我的问题是，如果我将其压缩表示(JPEG 转储)加载到内存中，我该如
有没有一种可能的方式，我可以从youtube检索我的最新视频的列表(带有缩略图)，使用cron作业将嵌入的代码存储在数据库中，这样我就可以在单独的页面上显示视频，而不是将用户引向youtube观看视频
最近我发现我的网站上嵌入的 YouTube 视频存在问题 - 全屏按钮不再起作用。确实有过一次。该按钮是可见的，但单击时没有任何反应。 我正在使用 Youtube Javascript API 将视频
在 Keras 内置函数中嵌入使用哪种算法？Word2vec？手套？其他？ https://keras.io/layers/embeddings/ 最佳答案 简短的回答是都不是。本质上，GloVe 的
在 LSTM 上用于建模 IMDB 序列数据 ( https://github.com/fchollet/keras/blob/master/examples/imdb_lstm.py ) 的 ker
在机器学习中，通常用 one-hot-encoding 表示分类(特别是:名义)特征。 .我正在尝试学习如何使用 tensorflow 的嵌入层来表示分类问题中的分类特征。我有 tensorflow
我有一个使用 Storyboard的应用程序，我想在我的主视图中有一个 View ，并让它在场景中的不同 View 之间切换。 所以目前我有“容器对象”，我可以在其中嵌入另一个 viewControl
在我的项目中我遇到了这样的情况。 function fonsubmit() { alert('Out side PHP'); //Here the php code starts
我正在尝试添加一个JFileChooser，它选择父目录并允许用户输入文件名称。我知道 showSaveDialog 和 showOpenDialog 方法，但我不想创建新窗口。 这是我到目前为止所拥
我注意到我的网站创建了这样的链接:www.domain.com/post-name/embed/ 恐怕这可能会影响 SEO。是否可以禁用此功能？ 最佳答案 显然这是默认的 WordPress 行为。此
我试图从 C 代码调用 python 函数，我遵循了 here 中的示例 我也有正确的包含文件目录、库目录和链接 python32.lib(我使用 python 32)但是错误是 python/C A
我正在使用基于云的 EDR 平台来监控客户端受损网络上发生的进程。我最近经常看到的是使用选项“-Embedding”调用的 msiexec.exe C:\Windows\System32\MsiExe
我有一个列表，其中包含数百万个需要嵌入的句子。我正在使用 Flair以此目的。这个问题似乎应该是并行的。但是，当我尝试优化时，我的性能要么没有提高，要么只是停滞不前。 我将我的句子定义为一个简单的字符
我想在我的应用程序中添加嵌入的 YouTube 视频:我该怎么做？我有这个 import 'package:youtube_player/youtube_player.dart'; import 'p
我有 json 看起来像: myjson = {"queries":{"F.SP": 27}} 所以与 queryResults = JObject.Parse(jsonString) 我可以 fir
我在 html 文档中嵌入 highcharts 饼图时遇到问题。具体来说，我无法在不更改图表大小的情况下调整图表容器的大小。有谁知道您是否可以在不缩小图表的情况下减少默认填充？或者，您可以在不增加容
我不太确定这在 MediaWiki 中是否可行。 我有几个类别，每个类别包含几页。如果您打开一个类别页面，您将看到该类别的内容，通常由以下三个部分组成: 用户定义的文本(可以使用编辑链接进行编辑)。
我是一名优秀的程序员,十分优秀！