Installation Steps
- Clone this repository
Report incorrect code
Copy
Ask AI
git clone https://github.com/cometchat-pro/web-chat-widget-custom
- Navigate to the CometChatWorkspace directory and replace the URL with your website URL in the CONSTS.js file
Report incorrect code
Copy
Ask AI
cd CometChatWorkspace
Report incorrect code
Copy
Ask AI
// EG: If URL is set as https://your_domain.com/widget
// cometchatwidget.js will be available at https://your_domain.com/widget/cometchatwidget.js
module.exports = {
URL: "https://your_domain.com/widget",
}
- Install the dependencies
Report incorrect code
Copy
Ask AI
npm install
- Build the project using the below command
Report incorrect code
Copy
Ask AI
npm run build:custom
- Copy all the files from the build directory to your website source code
Usage
Update the widget’s CDN link in the installation code.It will be based on the URL mentioned in the CONSTS.js file.- Embedded Layout
- Docked Layout
Report incorrect code
Copy
Ask AI
<html>
<head>
<script defer src="https://your_domain.com/widget/cometchatwidget.js"></script>
</head>
<body>
<div id="cometchat"></div>
<script>
window.addEventListener('DOMContentLoaded', (event) => {
CometChatWidget.init({
"appID": "APP_ID",
"appRegion": "APP_REGION",
"authKey": "AUTH_KEY"
}).then(response => {
console.log("Initialization completed successfully");
//You can now call login function.
CometChatWidget.login({
"uid": "UID"
}).then(response => {
CometChatWidget.launch({
"widgetID": "WIDGET_ID",
"target": "#cometchat",
"roundedCorners": "true",
"height": "600px",
"width": "800px",
"defaultID": 'cometchat-uid-1', //default UID (user) or GUID (group) to show,
"defaultType": 'user' //user or group
});
}, error => {
console.log("User login failed with error:", error);
//Check the reason for error and take appropriate action.
});
}, error => {
console.log("Initialization failed with error:", error);
//Check the reason for error and take appropriate action.
});
});
</script>
</body>
</html>
Report incorrect code
Copy
Ask AI
<html>
<head>
<script defer src="https://your_domain.com/widget/cometchatwidget.js"></script>
</head>
<body>
<script>
window.addEventListener('DOMContentLoaded', (event) => {
CometChatWidget.init({
"appID": "APP_ID",
"appRegion": "APP_REGION",
"authKey": "AUTH_KEY"
}).then(response => {
console.log("Initialization completed successfully");
//You can now call login function.
CometChatWidget.login({
"uid": "UID"
}).then(response => {
CometChatWidget.launch({
"widgetID": "WIDGET_ID",
"docked": "true",
"alignment": "left", //left or right
"roundedCorners": "true",
"height": "450px",
"width": "400px",
"defaultID": 'cometchat-uid-1', //default UID (user) or GUID (group) to show,
"defaultType": 'user' //user or group
});
}, error => {
console.log("User login failed with error:", error);
//Check the reason for error and take appropriate action.
});
}, error => {
console.log("Initialization failed with error:", error);
//Check the reason for error and take appropriate action.
});
});
</script>
</body>
</html>