# ngx-addchat

> Adding instance message platforms to your website.

Latest version **1.0.1** (published 2018-03-01) · MIT license · 0 weekly downloads

## Install

```sh
npm install ngx-addchat
pnpm add ngx-addchat
yarn add ngx-addchat
bun add ngx-addchat
```

## Health

**Score 30/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.1 |
| Published | 2018-03-01 |
| First published | 2018-02-20 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 10 |
| Unpacked size | 286.3 KB |
| Known vulnerabilities | 0 (+21 in 3 direct dependencies) |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Ken Ho |
| Maintainers | cokenhe |
| Keywords | IM app, instance message, chat bubble, angular, contact us |

## Links

- npm: https://www.npmjs.com/package/ngx-addchat
- Repository: https://github.com/AppQuick/ngx-addchat
- Homepage: https://github.com/AppQuick/ngx-addchat#readme
- Issues: https://github.com/AppQuick/ngx-addchat/issues
- npm.io page: https://npm.io/package/ngx-addchat

## Dependencies (10)

- [rxjs](https://npm.io/package/rxjs.md) ^5.5.2
- [tslib](https://npm.io/package/tslib.md) ^1.7.1
- [core-js](https://npm.io/package/core-js.md) ^2.4.1
- [zone.js](https://npm.io/package/zone.js.md) ^0.8.14
- [@angular/core](https://npm.io/package/@angular/core.md) ^5.0.0
- [@angular/common](https://npm.io/package/@angular/common.md) ^5.0.0
- [@angular/compiler](https://npm.io/package/@angular/compiler.md) ^5.0.0
- [@angular/animations](https://npm.io/package/@angular/animations.md) ^5.0.0
- [@angular/platform-browser](https://npm.io/package/@angular/platform-browser.md) ^5.0.0
- [@angular/platform-browser-dynamic](https://npm.io/package/@angular/platform-browser-dynamic.md) ^5.0.0

## Recent versions

- 1.0.1 (latest) — 2018-03-01
- 1.0.0 — 2018-02-28
- 0.1.11 — 2018-02-26
- 0.1.10 — 2018-02-26
- 0.1.9 — 2018-02-26
- 0.1.8 — 2018-02-26
- 0.1.7 — 2018-02-26
- 0.1.6 — 2018-02-26
- 0.1.5 — 2018-02-26
- 0.1.4 — 2018-02-26
- 0.1.3 — 2018-02-26
- 0.1.2 — 2018-02-26
- 0.1.1 — 2018-02-20
- 0.1.0 — 2018-02-20
- 0.0.1 — 2018-02-20
- … 1 more at https://npm.io/package/ngx-addchat/versions

## README

# ngx-addchat
Adding instance message shortcut to your website.
Now supported platform:
1. Whatsapp
2. Facebook Messenger
![](image/demo.gif)

## Getting Started

### Installation
1. Install using npm:
	```bash
	npm install ngx-addchat --save
	```

2. Import `NgxAddchatModule` to your `app.module.ts`.
	```typescript
	import { NgxAddchatModule } from  'ngx-addchat'; // <-- Add this
	...

	@NgModule({
	imports: [
		NgxAddchatModule // <-- And this
	],
	...
	})
	```

3. Add element to the end of HTML (e.g. `app.component.html`)
	```html
	...
	<!-- at the end of the component -->
	<ngx-addchat></ngx-addchat>
	```

## Configuration

### Whatsapp
```
whatsapp="<country code><phone number>"
```
Insert `whatsapp` into  `<ngx-addchat>`.

**_Example_**
```html
<ngx-addchat whatsapp="85255737471"></ngx-addchat>
```
`852` is the country code of Hong Kong, and `5573 7471` is the phone number we want.

### Facebook
```
fbPageName="<the name of facebook page>"
```
Insert `fbPageName` into the `<ngx-addchat>`

**_Example_**
```html
<ngx-addchat fbPageName="appquick.co"></ngx-addchat>
```

## License

This project is licensed under the MIT License - see the LICENSE file for details

  

## Credit
**Inspired by [whatshelp]**

The original idea is from [whatshelp], which is providing a snippet which is including cross-site scripting (XSS). It may encounter some potential security issues. For more information, please check in [Angular.io/security](https://angular.io/guide/security#xss).

**Tools using in this project**
- [ionicons v2.0.1](http://ionicons.com/)
- [Facebook plugin](https://developers.facebook.com/docs/plugins/page-plugin)

## Roadmap
- Improve [Facebook Messenger plugin](https://developers.facebook.com/docs/messenger-platform/discovery/customer-chat-plugin)

- Adding more popular IM platforms

- Adding and customising the pop-out animations

- Customising the color of bubbles

## Limitation
This library is only tested on [Angular.io v5.0.0](https://angular.io).



[whatshelp]: https://whatshelp.io/widget

---
_Source: https://npm.io/package/ngx-addchat · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
