react whatsapp widget

React-Whatsapp-Widget

WhatsApp聊天小部件用於您的網站

這是什麼？

這是一個非常簡單的浮動WhatsApp按鈕小部件。由於1920年Covid-19的影響，大多數小型企業都必須轉向在線形象。改善與您的客戶溝通的Wey之一是使用這樣的小部件。

它在您的網站中添加了一個類似浮動的按鈕，該按鈕調用WhatsApp Chat API。

它將自動開始對您配置的號碼和用戶編寫的文本進行WhatsApp聊天。

所有文本都是完全可自定義的，您也可以提供圖標/徽標。

安裝

npm install --save react-whatsapp-widget

用法

 import React from 'react' ;
// This is the way to import an SVG file and then pass it as a props
import { ReactComponent as CompanyIcon } from './assets/crown.svg' ;

import { WhatsAppWidget } from 'react-whatsapp-widget' ;
import 'react-whatsapp-widget/dist/index.css' ;

const App = ( ) => {
    return (
        < WhatsAppWidget CompanyIcon = { CompanyIcon } phoneNumber = "XXXXXXXXXX" />
    ) ;
} ;

配x以國際格式為全電話phoneNumber的地方。以國際格式添加電話號碼時，請省略任何零，支架或破折號。

示例： 541112222222其中54是阿根廷國際代碼。

定制

選項	價值	預設	描述
Phonenumber	string	''	WhatsApp Intenational號碼將接收消息。
企業	Component	BiSupport	貴公司SVG圖標
公司名稱	string	'Support'	您的公司名稱
ReplyTimeText	string	'Typically replies within a day'
訊息	string	'Hello! ? nnWhat can we do for you?'	使用n您可以創建一個分類。
sendbuttontext	string	'Send'	發送按鈕中的文字
輸入場所持有人	string	'Type a message'	消息輸入的佔位符文本
打開	boolean	false	如果為true，則chatbox將打開為默認

貢獻

克隆存儲庫後，您必須在兩個不同的終端選項卡中運行以下命令才能啟動開發環境。

 cd react-whatsapp-widget
npm install
npm start

 cd react-whatsapp-widget/example
npm install
npm start

第一個命令觀看SRC/，並在您進行更改時將其重新編譯到DIST/文件夾中。

第二個命令運行鏈接到本地軟件包的示例應用程序。

歡迎拉動請求！

執照

麻省理工學院©Ann0nip