react whatsapp widget

react-whatsapp-widget

Widget de chat whatsapp pour votre site Web

Qu'est-ce que c'est?

Il s'agit d'un widget de bouton WhatsApp flottant très simple. En raison de l'impact de Covid-19 en 2020, la plupart des petites entreprises ont dû passer à une présence en ligne. L'un des WEY pour améliorer la communication avec vos clients est d'utiliser un widget comme celui-ci.

Il ajoute un bouton flottant à votre site qui appelle l'API de chat WhatsApp.

Il commencera automatiquement un chat WhatsApp avec le numéro que vous configurez et le texte que l'utilisateur écrit.

Tous les textes sont entièrement personnalisables et vous pouvez également fournir une icône / logo.

Installer

npm install --save react-whatsapp-widget

Usage

 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" />
    ) ;
} ;

️ Où le phoneNumber est un numéro de téléphone complet au format international. Omettez tous les zéros, supports ou tirets lors de l'ajout du numéro de téléphone au format international.

Exemple: 541112222222 où 54 est le code interacional de l'Argentine.

Personnalisation

option	valeur	défaut	description
phonélinoir	string	''	Numéro d'intenation WhatsApp qui recevra le message.
Compagnie	Component	BiSupport	Icône SVG de votre entreprise
Nom de l'entreprise	string	'Support'	Nom de votre entreprise
RépondreTimeText	string	'Typically replies within a day'
message	string	'Hello! ? nnWhat can we do for you?'	Avec n vous pouvez créer une rupture.
sendbuttontext	string	'Send'	SMS à l'intérieur du bouton Envoyer
entrée	string	'Type a message'	Texte de l'entrée de l'entrée du message
ouvrir	boolean	false	Si vrai, la Chatbox sera ouverte par défaut

Contributif

Après le clonage du référentiel, vous devez exécuter les commandes suivantes dans deux onglets de terminaux différents pour démarrer l'environnement de développement.

 cd react-whatsapp-widget
npm install
npm start

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

La première commande regarde le src / et le recompile dans le dossier DIST / lorsque vous apportez des modifications.

La deuxième commande exécute l'exemple d'application qui relie à votre package local.

Les demandes de traction sont les bienvenues!

Licence

MIT © Ann0nip