react whatsapp widget

React-whatsapp-widget

Whatsapp Chat Widget para o seu site

O que é isso?

Este é um widget de botão WhatsApp flutuante muito simples. Devido ao impacto do Covid-19 em 2020, a maioria das pequenas empresas teve que se mudar para uma presença on-line. Um dos wey para melhorar a comunicação com seus clientes é usar um widget como este.

Ele adiciona um botão flutuante ao seu site que chama a API do WhatsApp Chat.

Ele começará automaticamente um bate -papo do WhatsApp com o número que você configura e o texto que o usuário grava.

Todos os textos são totalmente personalizáveis e você também pode fornecer um ícone/logotipo.

Instalar

npm install --save react-whatsapp-widget

Uso

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

️ Onde o phoneNumber é um número de telefone completo em formato internacional. Omita qualquer zero, suportes ou traços ao adicionar o número de telefone em formato internacional.

Exemplo: 541112222222 onde 54 é o Código Internacional da Argentina.

Personalização

opção	valor	padrão	descrição
PhoneNumber	string	''	Número intenacional do WhatsApp que receberá a mensagem.
Empresa	Component	BiSupport	Seu ícone SVG da sua empresa
nome da empresa	string	'Support'	Nome da sua empresa
ResponderTimETEXT	string	'Typically replies within a day'
mensagem	string	'Hello! ? nnWhat can we do for you?'	Com n você pode criar uma ruptura.
SendButtonText	string	'Send'	Texto dentro do botão Enviar
inputplaceholder	string	'Type a message'	Texto de espaço reservado da entrada da mensagem
abrir	boolean	false	Se True, a caixa de chat estará aberta como padrão

Contribuindo

Após clonar o repositório, você deve executar os seguintes comandos em duas guias de terminais diferentes para iniciar o ambiente de desenvolvimento.

 cd react-whatsapp-widget
npm install
npm start

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

O primeiro comando observa o SRC/ e recompila -o na pasta Dist/ quando você faz alterações.

O segundo comando executa o aplicativo de exemplo que vincula ao seu pacote local.

Os pedidos de puxão são bem -vindos!

Licença

MIT © Ann0nip