在现代网站中，聊天窗口已经成为各大企业网站中必不可少的组件。而 PureChat 又是聊天窗口组件中的一个不错的选择。在 Gatsby 网站开发中，使用 @mangoart/gatsby-plugin-purechat 插件可以轻松集成 PureChat 窗口。在本文中，我们将会详细解释如何使用 @mangoart/gatsby-plugin-purechat 插件来将 PureChat 窗口集成到您的 Gatsby 网站中。
支持的环境
- Gatsby ^2.0.0
- React ^16.0.0
安装
安装 @mangoart/gatsby-plugin-purechat 首先需要先安装 Gatsby 和 React，如果您还没有安装过，请先参考 Gatsby 和 React 的官方文档进行安装。安装完成后，在您的 Gatsby 项目根目录下，使用以下命令安装 @mangoart/gatsby-plugin-purechat:
--- - --------------------------------
使用
- 在您的 Gatsby 项目根目录下的
gatsby-config.js中配置：
-------------- - -
-------- -
-
-------- -----------------------------------
-------- -
------- -----
---------- -----------------
-
-
-
-其中，
enable值为true表示启用 PureChat 窗口，在生产环境中默认启用，在开发环境中不启用。websiteId值为您在 PureChat 中的网站 ID，如果不填写，则无法正常启用 PureChat 窗口。
- 将 PureChat 窗口的相关代码嵌入到您的模板文件中：
------ ----- ---- -------
------ - ---------- - ---- --------
----- -------- - -- -- -
-------
----------------------
------------------------------------------
--
-
------ ------- --------示例代码
-- ----------------
-------------- - -
-------- -
-
-------- -----------------------------------
-------- -
------- -----
---------- ---------
-
-
-
-
-- ----------------------
------ ----- ---- -------
------ - ---------- - ---- --------
----- -------- - -- -- -
-------
----------------------
------------------------------------------
--
-
------ ------- --------
-- --------------
------ ----- ---- -------
------ -------- ---- ------------------------
----- --------- - -- -- -
-----
--------- -----------
---------- -- -- ------ ---------
--------- --
------
-
------ ------- ---------总结
本文详细介绍了如何使用 @mangoart/gatsby-plugin-purechat 插件将 PureChat 窗口集成到 Gatsby 网站当中。通过本文的讲解，您可以轻松的将 PureChat 窗口加入到您的网站当中，提升与您的客户的交互体验。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/600672523660cf7123b36329