6257rv7 发表于 2024-8-22 15:08:59

研发人员怎么样安装和运用Chatra


    <div style="color: black; text-align: left; margin-bottom: 10px;">
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">研发</span>人员<span style="color: black;">能够</span><span style="color: black;">运用</span>插件或某些API调用来查看可用于为您的应用程序<span style="color: black;">供给</span>聊天功能的平台。</p>
      <div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/pgc-image/15373217080227f4872accd~noop.image?_iz=58558&amp;from=article.pc_detail&amp;lk3s=953192f4&amp;x-expires=1724865796&amp;x-signature=nw4uIgnd1eOBMuovus0pKyKIUkI%3D" style="width: 50%; margin-bottom: 20px;"></div>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">仍然<span style="color: black;">供给</span><span style="color: black;">tel</span>支持?你有<span style="color: black;">无</span>想过你网站的实时聊天效果?虽然大<span style="color: black;">都数</span>人避免<span style="color: black;">tel</span><span style="color: black;">交流</span>并且<span style="color: black;">无</span>时间阅读电子邮件,但实时聊天<span style="color: black;">能够</span>是<span style="color: black;">供给</span>有效支持和与<span style="color: black;">拜访</span>者<span style="color: black;">创立</span>关系的完美<span style="color: black;">选取</span>。您<span style="color: black;">能够</span>忘记所有“你能用语音拼写你的电子邮件吗?”并快速回复刻录请求。实时聊天<span style="color: black;">能够</span>节省你的时间,<span style="color: black;">供给</span>更广泛的<span style="color: black;">拜访</span>者<span style="color: black;">照片</span>,<span style="color: black;">加强</span>客户的忠诚度,<span style="color: black;">乃至</span>减少压力<span style="color: black;">导致</span>的压力<span style="color: black;">经过</span><span style="color: black;">tel</span>。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><strong style="color: blue;">什么是Chatra?</strong></p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">Chatra是一个用户友好的网站信使工具,<span style="color: black;">能够</span><span style="color: black;">帮忙</span>您<span style="color: black;">即时</span><span style="color: black;">帮助</span>网站<span style="color: black;">拜访</span>者并与<span style="color: black;">她们</span><span style="color: black;">创立</span>可<span style="color: black;">连续</span>的关系。Chatra为您<span style="color: black;">供给</span>了一个有效对抗购物车放弃的机会,避免了电子邮件支持<span style="color: black;">平常</span>的代价<span style="color: black;">昂贵</span>的延迟,并且在竞争激烈的<span style="color: black;">商场</span>环境中非常重要。即使您不在办公室,<span style="color: black;">她们</span>的移动应用程序<span style="color: black;">亦</span><span style="color: black;">能够</span><span style="color: black;">帮忙</span>您<span style="color: black;">拜访</span>。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><strong style="color: blue;"><span style="color: black;">怎样</span>将其添加到您的网站</strong></p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">要将Chatra添加到您的网站,您应该在<span style="color: black;">她们</span>的右上角网站上注册,<span style="color: black;">经过</span>发送到您的电子邮件<span style="color: black;">位置</span>的链接验证您的Chatra帐户,并在Chatra仪表板中设置您的<span style="color: black;">秘码</span>。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><strong style="color: blue;">手动添加代码</strong></p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">您<span style="color: black;">能够</span>从仪表板中的“ 设置和自定义”选项卡复制窗口小部件代码 ,并将其粘贴到网站的代码中,最好在结束&lt;/head&gt;标记之前。</p>
      <div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/pgc-image/1537321708029ad71a31148~noop.image?_iz=58558&amp;from=article.pc_detail&amp;lk3s=953192f4&amp;x-expires=1724865796&amp;x-signature=TFv9t3uRYS%2BraL6zHFBAmR8FPIw%3D" style="width: 50%; margin-bottom: 20px;"></div>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">Chatra与大<span style="color: black;">都数</span>CMS平台集成,如Shopify,Wordpress,Joomla,Drupal,Wix等。您<span style="color: black;">能够</span>在<span style="color: black;">这儿</span>查看最流行系统的所有指南。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><strong style="color: blue;">WordPress的插件</strong></p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">Chatra<span style="color: black;">持有</span>自己的WordPress插件,<span style="color: black;">因此呢</span>您<span style="color: black;">能够</span><span style="color: black;">容易</span>地将其添加到您的网站。<span style="color: black;">倘若</span>您的网站是基于WordPress的,请<span style="color: black;">根据</span>以下<span style="color: black;">过程</span>操作:</p><span style="color: black;">首要</span>,登录您的WordPress管理面板,<span style="color: black;">而后</span>转到插件→添加新的。在“搜索插件”字段中输入“chatra”。安装并激活插件。转到设置→Chatra聊天。在另一个浏览器选项卡中登录app.chatra.io,<span style="color: black;">而后</span>从Chatra仪表板中的setup and customize部分复制窗口小部件代码。返回WordPress<span style="color: black;">掌控</span>台,粘贴代码,<span style="color: black;">而后</span>按<span style="color: black;">保留</span>更改。完成!Chatra应该出<span style="color: black;">此刻</span>您的网站上。<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">在完成<span style="color: black;">以上</span>所有<span style="color: black;">过程</span>后,您可能<span style="color: black;">没法</span>看到窗口小部件。<span style="color: black;">倘若</span>是<span style="color: black;">这般</span>,请<span style="color: black;">检测</span>您<span style="color: black;">是不是</span>安装了任何缓存插件。清除网站缓存后,应<span style="color: black;">表示</span>小组件。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><strong style="color: blue;">Shopify App</strong></p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">您可能<span style="color: black;">晓得</span>,Shopify是<span style="color: black;">全世界</span>在线商店非常受欢迎的CMS。Chatra<span style="color: black;">供给</span>了与该平台的即用型集成,<span style="color: black;">因此呢</span>您只需单击一下<span style="color: black;">就可</span>将Chatra添加到您的在线商店。您<span style="color: black;">能够</span><span style="color: black;">拜访</span>Shopify上的Chatra应用页面,<span style="color: black;">而后</span>按绿色的“获取”按钮。瞧!Chatra在您的网站上。您<span style="color: black;">能够</span><span style="color: black;">运用</span>相同的Chatra帐户连接其他Shopify商店。要执行此操作,只需登录商店的管理仪表板并重复<span style="color: black;">第1</span>步。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><strong style="color: blue;">其他平台</strong></p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">Chatra与大<span style="color: black;">都数</span>流行的CMS平台集成在<span style="color: black;">一块</span>,如Bigcommerce,CS-Cart,Drupal,Ecwid,Joomla,Magento,Opencart,Tilda和Wix。<span style="color: black;">倘若</span>您在Chatra网站上找不到适用于您平台的指南,请<span style="color: black;">检测</span>您<span style="color: black;">是不是</span><span style="color: black;">能够</span><span style="color: black;">选取</span>将自定义HTML代码添加到您的网站,<span style="color: black;">或</span>联系Chatra支持以获取正确的指南。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><strong style="color: blue;"><span style="color: black;">运用</span>API</strong></p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">安装完成后,<span style="color: black;">能够</span>从app.chatra.io上的仪表板更改大部分设置(如窗口小部件文本,按钮颜色和位置等),更改将应用于您网站上的窗口小部件即时的。但Chatra还为<span style="color: black;">研发</span>人员<span style="color: black;">供给</span>了一个API,即使在免费计划中<span style="color: black;">亦</span><span style="color: black;">能够</span><span style="color: black;">运用</span>基本功能。让<span style="color: black;">咱们</span>仔细<span style="color: black;">瞧瞧</span>它们的<span style="color: black;">有些</span>功能。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><strong style="color: blue;">改变颜色</strong></p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">Chatra仪表板<span style="color: black;">准许</span>您仅更改聊天按钮的颜色,并且您只能从其调色板中<span style="color: black;">选取</span>一种颜色。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">运用</span>下面的API代码,您不仅<span style="color: black;">能够</span>为聊天按钮设置自己的颜色,还<span style="color: black;">能够</span>为<span style="color: black;">信息</span>气泡设置自己的颜色。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">window.ChatraSetup = {</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">colors: {</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">buttonText: #f5f5f5, // chat button text/icon color</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">buttonBg: #5ece1a, // chat button bac<span style="color: black;">公斤</span>round color</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">clientBubbleBg: #e7ffd1, // visitor’s message bubble color</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">agentBubbleBg: #deffff // agent’s message bubble color</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">}</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">}</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">在主窗口小部件代码之前添加此代码(<span style="color: black;">倘若</span>您<span style="color: black;">运用</span>Shopify,则添加到theme.liquid文件中),它将覆盖Chatra仪表板中的设置。<span style="color: black;">倘若</span>您有多个<span style="color: black;">拥有</span><span style="color: black;">区别</span>调色板的网站,这<span style="color: black;">亦</span>很方便。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><strong style="color: blue;">改变<span style="color: black;">体积</span></strong></p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">倘若</span>您认为聊天按钮或窗口<span style="color: black;">针对</span>您的网站<span style="color: black;">来讲</span>太大或太小,请<span style="color: black;">运用</span>以下代码更改其<span style="color: black;">体积</span>:</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">window.ChatraSetup = {</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">chatWidth: 400,</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">chatHeight: 550,</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">buttonSize: 75</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">}</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">此代码<span style="color: black;">亦</span><span style="color: black;">位置于</span>主窗口小部件代码之前。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><strong style="color: blue;">设置语言</strong></p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">Chatra<span style="color: black;">日前</span>有7种语言版本:英语,德语,法语,西班牙语,俄语,葡萄牙语和荷兰语。<span style="color: black;">倘若</span>在设置中<span style="color: black;">选取</span>了多种语言,Chatra会检测<span style="color: black;">拜访</span>者的浏览器语言并向其<span style="color: black;">表示</span>相应的版本。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">然则</span>,<span style="color: black;">运用</span>API<span style="color: black;">能够</span>让您设置语言,<span style="color: black;">因此呢</span>将忽略浏览器语言。它<span style="color: black;">准许</span>您在网站的英文版本上<span style="color: black;">运用</span>英文版本的英文聊天窗口,德语版本等等。要设置语言,请<span style="color: black;">运用</span>以下代码:</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">window.ChatraSetup = {</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">language: fr</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">};</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">fr 在上面的代码中<span style="color: black;">表率</span>法语。其他可能的语言变量:en,de,es,nl,pt和ru。Chatra还<span style="color: black;">准许</span>您将窗口小部件文本转换为当前不支持的其他语言(例如,从英语转换为日语)。查看<span style="color: black;">她们</span>的文档以<span style="color: black;">这里</span>处翻译小部件。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">请<span style="color: black;">重视</span>,window.ChatraSetup只能在页面上<span style="color: black;">运用</span>一次,<span style="color: black;">因此呢</span><span style="color: black;">倘若</span><span style="color: black;">运用</span><span style="color: black;">区别</span>的API选项,请<span style="color: black;">保证</span>将所有选项组合到单个对象中。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><strong style="color: blue;">将Chatra连接到您的自定义按钮</strong></p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">倘若</span>要<span style="color: black;">经过</span>单击自定义按钮打开聊天窗口,请<span style="color: black;">运用</span>以下代码:</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">&lt;!-- Custom button anywhere on the page --&gt;</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">&lt;button onclick="Chatra(openChat, true)"&gt;Open chat window&lt;/button&gt;</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">基本上,它是<span style="color: black;">能够</span><span style="color: black;">安置</span>在页面上任何位置的随时可用的代码。<span style="color: black;">倘若</span>您已有设计按钮,请将"Chatra(openChat, true)" 设置添加到该按钮。<span style="color: black;">这般</span>,您<span style="color: black;">能够</span>在页面上添加一个聊天按钮,该按钮<span style="color: black;">能够</span>放在页眉,页脚,购物车页面或任何可能有用的位置。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">倘若</span>你<strong style="color: blue;">只是</strong>想用自己的按钮,<span style="color: black;">隐匿</span>默认的一个,<span style="color: black;">运用</span>此CSS代码:</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">#chatra:not(.chatra--expanded) {</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">visibility: hidden !important;</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">opacity: 0 !important;</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">pointer-events: none;</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">}</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">将其添加到CSS文件中或将其包装到</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">标记中并在<span style="color: black;">重点</span>窗口小部件代码之前添加它。</p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><strong style="color: blue;">高级选项</strong></p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">上面列出的所有示例以及其文档中JavaScript API部分中列出的其他选项均可在免费计划中找到。高级API选项仅适用于付费套餐和试用期,并且需要您<span style="color: black;">自动</span>编码。您<span style="color: black;">能够</span>:</p>将自定义信息传递到Chatra仪表板。<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/pgc-image/15373217080370da0048e25~noop.image?_iz=58558&amp;from=article.pc_detail&amp;lk3s=953192f4&amp;x-expires=1724865796&amp;x-signature=2oeb5bIsSarviysvohH%2BCiW9dP8%3D" style="width: 50%; margin-bottom: 20px;"></div>将对话历史记录绑定到用户的帐户。默认<span style="color: black;">状况</span>下,Chatra会将对话历史记录连接到浏览器Cookie,<span style="color: black;">然则</span>,<span style="color: black;">运用</span>此选项,您的<span style="color: black;">拜访</span>者将在用于<span style="color: black;">拜访</span>您网站的所有设备上<span style="color: black;">持有</span>相同的对话历史记录。<span style="color: black;">运用</span>webhooks从Chatra获取数据。这可用于与第三方工具(例如,CRM)集成,并<span style="color: black;">准许</span>您从Chatra获取对话历史记录和访客信息。<span style="color: black;">运用</span>REST API将数据发送到Chatra。例如,您<span style="color: black;">能够</span>向注册客户发送自动订单状态更新。将REST API与webhooks相结合,您<span style="color: black;">能够</span>在第三方应用程序中获取<span style="color: black;">信息</span>并回复它们,<span style="color: black;">同期</span>在Chatra中实时更新对话历史记录。<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><strong style="color: blue;">结论</strong></p>
      <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">Chatra是一种功能强大且高度可配置的方式,<span style="color: black;">能够</span>与客户<span style="color: black;">创立</span>联系,并为客户<span style="color: black;">供给</span>反馈并寻求<span style="color: black;">帮忙</span>。设置起来很简单,<span style="color: black;">倘若</span>你对某些东西不满意,正如你所看到的,你<span style="color: black;">能够</span>用几行代码改变它。</p>
    </div>




星☆雨 发表于 2024-9-8 15:39:10

外贸B2B平台有哪些?

听听海 发表于 2024-9-10 14:04:43

你的言辞如同繁星闪烁,点亮了我心中的夜空。

qzmjef 发表于 2024-10-4 03:19:41

“板凳”(第三个回帖的人)‌

qzmjef 发表于 2024-10-8 23:44:24

seo常来的论坛,希望我的网站快点收录。

4lqedz 发表于 前天 16:36

你的见解独到,让我受益匪浅,非常感谢。
页: [1]
查看完整版本: 研发人员怎么样安装和运用Chatra