Simple-whatsapp-widget NPM

Simple WhatsApp Widget

Simple WhatsApp Widget is a lightweight and easy-to-use React component that allows you to add a WhatsApp chat widget to your web application. Live Preview

Installation

You can install the package using npm:

npm install simple-whatsapp-widget

or using yarn:

yarn add simple-whatsapp-widget

Usage

import React from "react";
import WhatsAppWidget from 'simple-whatsapp-widget';
import 'simple-whatsapp-widget/dist/styles.css'  

export default function Home() {
  return <main>
   <WhatsAppWidget/>
  </main>;
}

Simply import the WhatsAppWidget component and place it in your React component where you want the WhatsApp chat widget to appear.

Customization

The WhatsAppWidget component accepts several optional props to customize its appearance and behavior. Here are the available props:

phoneNumber: Specify the phone number to which the WhatsApp messages should be sent. autoOpen: Set it to true to automatically open the WhatsApp chat widget when the component is mounted. message: Provide a pre-defined message that will be included in the initial WhatsApp message. className: Add custom CSS classes to the WhatsApp chat widget container.

Example usage with props:

<WhatsAppWidget
  phoneNumber="your_whatsapp_number"
  autoOpen={true}
  message="Hello, I have a question about your product."
  className="my-custom-widget"
/>

Feel free to modify and style the widget according to your application's needs.