https://github.com/b3nnyl/react-zendesk
A component simplifies Zendesk widget usage in your React application
https://github.com/b3nnyl/react-zendesk
embedded react widget zendesk
Last synced: about 1 year ago
JSON representation
A component simplifies Zendesk widget usage in your React application
- Host: GitHub
- URL: https://github.com/b3nnyl/react-zendesk
- Owner: B3nnyL
- License: mit
- Created: 2019-07-12T03:07:19.000Z (almost 7 years ago)
- Default Branch: master
- Last Pushed: 2023-12-21T12:49:25.000Z (over 2 years ago)
- Last Synced: 2025-03-24T09:47:40.069Z (about 1 year ago)
- Topics: embedded, react, widget, zendesk
- Language: JavaScript
- Homepage: https://www.npmjs.com/package/react-zendesk
- Size: 435 KB
- Stars: 44
- Watchers: 1
- Forks: 18
- Open Issues: 22
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# react-zendesk
> A component simplifies Zendesk widget usage in your React application
## Introduction
This component applies to Zendesk Web Widget including contact form, live chat, talk, answer bot and help center. For more information on widget and API, please check [Zendesk official documentation](https://developer.zendesk.com/embeddables/docs/widget/introduction)
## Installation
```sh
npm i react-zendesk --save
```
## Component Usage
```js
import React from "react";
import ReactDOM from "react-dom";
import Zendesk from "react-zendesk";
const ZENDESK_KEY = "your zendesk embed key";
// Take contact form as an example
// Let's customise our contact form appearance, launcher and add prefill content
const setting = {
color: {
theme: "#000"
},
launcher: {
chatLabel: {
"en-US": "Need Help"
}
},
contactForm: {
fields: [
{ id: "description", prefill: { "*": "My pre-filled description" } }
]
}
};
const App = () => {
return console.log('is loaded')} />;
};
ReactDOM.render(, document.getElementById("#app"));
```
## Zendesk API usage
```js
import { ZendeskAPI } from "react-zendesk";
...
// Set Zendesk widgets in German
ZendeskAPI("webWidget", "setLocale", "de");
...
```
## Resources
[Zendesk Widget Documentation](https://developer.zendesk.com/embeddables/docs/widget)
## License
MIT