rz
@residently/react-zendesk
npm i @residently/react-zendesk
rz

@residently/react-zendesk

A component simplifies Zendesk widget usage in your React application

by Shuying

0.1.11 (see all)License:MITTypeScript:Not Found
npm i @residently/react-zendesk
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

Installation

npm i react-zendesk --save

Component Usage

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 <Zendesk defer zendeskKey={ZENDESK_KEY} {...setting} onLoaded={() => console.log('is loaded')} />;
};

ReactDOM.render(<App />, document.getElementById("#app"));

Zendesk API usage

import { ZendeskAPI } from "react-zendesk";
...
// Set Zendesk widgets in German
ZendeskAPI("webWidget", "setLocale", "de");
...

Resources

Zendesk Widget Documentation

License

MIT

Downloads/wk

97

GitHub Stars

33

LAST COMMIT

10mos ago

MAINTAINERS

2

CONTRIBUTORS

8

OPEN ISSUES

7

OPEN PRs

7
VersionTagPublished
0.1.11
latest
10mos ago
No alternatives found
No tutorials found
Add a tutorial