How To Add Whatsapp Chat Button On the Website

Learn how to add a WhatsApp chat button on your website with just a few simple steps.
February 14, 2023
Product Marketing Manager,

How To Add Whatsapp Chat Button On The Website

WhatsApp is a central hub of conversation and connection for many people in their personal and professional lives. Like a spider web, WhatsApp spans the globe, connecting people from all corners of the world. 

Adding WhatsApp to a website provides quick and convenient global connectivity allowing WhatsApp to emerge as the alternative communication channel for customer support and sales inquiries. More than 50 million businesses are trusting WhatsApp Business for improved sales and engagement. 

Skip the email back and forth and let your customers chat with you directly on your website if you want to add a little fun and convenience to your website. Think about including a WhatsApp chat button!

This blog explains in detail how, with just a few simple steps, you can give your customers the ability to contact your business quickly and easily via WhatsApp.

Why should you add a WhatsApp webchat to your website?

WhatsApp Business and WhatsApp API are important tools for businesses to communicate with customers, provide customer service, and automate certain processes. 

With WhatsApp Business, businesses can create profiles to provide customers with valuable information such as their location, hours of operation, contact information, and more. Businesses can also use WhatsApp Business to send automated messages, notifications, promotions, and updates.

The WhatsApp Business API allows businesses to send messages to customers via WhatsApp, automate customer service, and even send targeted messaging campaigns at scale. Additionally, the API can be integrated with other tools and systems, such as CRM and e-commerce platforms, providing valuable insights into customer behavior and improving overall customer experience.

Some benefits of integrating WhatsApp on the website are

1. Increased Customer Engagement

Integrating WhatsApp chat on your website creates a more direct channel for customers to engage with your company. Adding a WhatsApp chat widget to your website makes it easier for visitors to reach out to you and start a conversation. It makes getting customer service help easier and faster as users can get their queries resolved quickly. 

2. Improved Customer Service

 WhatsApp chat integration allows you to interact with customers in real-time and easily address their questions, complaints, and queries. This leads to improved customer satisfaction and helps to improve your brand reputation.

Most customers are familiar with WhatsApp and its user-friendly interface, so collecting customer feedback is convenient. The feedback can then be analyzed and used to improve the customer experience. Additionally, having a quick customer feedback system will help build trust and keep customers satisfied.

3. Increased Reach

 As of 2022, WhatsApp has already reached over 2.44 billion users worldwide, making it the most popular instant messaging platform.  WhatsApp chat integration allows customers to chat through androids with a much wider reach.

4. Competitive Edge

 Adding a WhatsApp chat to a website can strengthen a business's competitive edge in several ways. It enables customers to easily get in contact and get responses quickly and efficiently, allowing the business to provide timely solutions to customers' problems. It enables a platform for businesses to promote their products or services, helping to increase sales and overall revenue.

5. Establish Online Presence

Adding WhatsApp Chat on a website can establish a greater online presence because it allows visitors to reach out and interact with the website's staff directly. This helps create a strong connection between the website and its visitors, making it easier to answer questions and provide more personalized assistance with product inquiries or customer service. 

Additionally, it increases the website's visibility by providing an easy way for customers to contact. This can lead to more prospects and opportunities for the website, leading to increased traffic and business.

6. Reduced Customer Service Cost

Adding a WhatsApp Chat on your website can greatly reduce customer service costs by allowing customers to message your business through WhatsApp. You can quickly and easily respond to customer inquiries and handle customer service requests promptly. This eliminates the need for call centers and live-chat agents, resulting in lower operational costs.

Additionally, WhatsApp is a quick and user-friendly communication platform, making it easier for customers to connect with the business. 

7. Automated Conversations

The WhatsApp Chat Button enables businesses to handle customer inquiries via automated scheduled messages and live chatbots. Conversations can also be routed directly to the right agent at the right time, thanks to WhatsApp automation.

However, in comparison to the WhatsApp API, the automation functionality of WhatsApp Business could be improved.

Unlock the Potential: Discover the Specific Ways a WhatsApp Widget Can Be Used

The WhatsApp widget is a powerful tool that allows businesses to connect with their customers directly through WhatsApp, right from their website or mobile app. There are many specific ways that a WhatsApp widget can be used to unlock its full potential.

Discover more about the specific ways in which Whatsapp can be used for your business.

1. Enhanced Marketing Campaign

The WhatsApp chat widget enables businesses to reach their customers wherever they are and allows you to connect with them via messaging. With the WhatsApp widget, you can unleash the power of personalized marketing and target it directly into the screens of individuals. WhatsApp messages have a 99% open rate, allowing businesses to capture customer attention quickly and improving the efficiency of marketing campaigns.

Example- SNOCKS builds a powerful engagement channel on the WhatsApp Business Platform to deliver more interactive, personalized marketing communication combining it with close customer support.

2. Increase Revenues

Via WhatsApp Chat Widget, you can also attract new customers using entry points and ads to let people know you’re available to chat. With click ads, you can expand your reach by sending potential customers on Facebook and Instagram straight into a WhatsApp chat with your business, leading to increased sales and revenue.

With the WhatsApp chat widget, you can provide your existing customers with a better customer support experience, making them more satisfied and more likely to make repeat purchases and tell their friends about their positive experiences.

Example- By creating personalized marketing campaigns using artificial intelligence on WhatsApp, 6thStreet achieved a 20x ROI compared to SMS over 30 days, doubled its click-through rate, and improved customer satisfaction.

3. Better Customer Support

WhatsApp Chat widget can efficiently provide better customer support with

  • Automated messages that respond to messages received outside your business hours help customers set expectations and know when you'll be back.
  • Quick replies create shortcuts for messages you frequently send to respond to common questions in just a few taps.
  • Custom Labels that organize and filter important customer conversations so you can quickly find and respond to messages that need your attention.
  • Automatically send a custom welcome message to new customers when they start a conversation with your business.

Example- When Merco Supermercado adopted automated messaging through WhatsApp to offer faster customer service and support digital marketing, the company improved employee productivity while increasing read rates on campaigns and building brand loyalty.

4. Improved Sales

By incorporating a WhatsApp widget into your business website, you can establish a virtual storefront, providing customers with detailed information about your products and services, simplifying the browsing process, and enabling them to place orders directly through WhatsApp. It is a one-stop shop for customers, making it easy for them to access all the information they need and complete transactions seamlessly. 

A WhatsApp widget on your website can unlock the potential for improved sales by

  • Providing a mobile-friendly storefront that showcases your products and services in an organized manner and simplifies your customers' shopping experience.
  • Sharing your entire catalog or specific items with new and existing customers on WhatsApp can streamline the order management process and make it easy for customers to select items from your catalog and submit them in a single message.
  • Using the widget to announce promotions, special offers, and new inventory to multiple customers simultaneously drives more sales and conversions.

Example- The company provides faster customer service while reducing costs when Grab creates an automated conversation experience through Messenger API. Inspired by its success in customer care, Grab develops sales and marketing campaigns supported by Messenger.

Ways to Add WhatsApp on the Website:

With all the advantages and convenience Whatsapp integration brings to the table, here are several ways to add WhatsApp to your website: 

  • Using a WhatsApp chat widget: This is a pre-designed chat box that can be easily added to a website using a simple code snippet.
  • Creating a WhatsApp Business account: This allows businesses to communicate with customers directly through the WhatsApp platform, with features such as automated messages, quick replies, and away messages.
  • Using a WhatsApp chatbot: This is a program that uses artificial intelligence to automate responses to customer queries and provide instant support.
  • Adding a WhatsApp click-to-chat link: This is a link that can be added to a website that, when clicked, opens a chat window with a pre-set message, allowing customers to contact the business easily.
  • Integrating with WhatsApp Business API: This allows businesses to send & receive messages at scale, customize their sender ID and track the message's delivery status.

WhatsApp Chat Button

A WhatsApp chat button is considered one of the best ways of adding WhatsApp to a website because it provides an easy and convenient way for customers to contact the business. 

The chat button is usually placed in a prominent location on the website, such as the header or footer, making it easily accessible to visitors. When clicked, the button opens a chat window with a pre-set message, allowing customers to quickly and easily initiate a conversation with the business. This can lead to improved customer engagement, faster response times, and better customer satisfaction.

How To Add WhatsApp Button On Website?

About Click-to-Chat Button

Click-to-chat features enable you to start a chat with anyone without having their phone number saved in your phone's address book by using a URL hyperlink to the short text or your phone number. One can easily click and open the chat directly via the WhatsApp Chat Button.

There are two types of WhatsApp Buttons to integrate into the website.

  • Local WhatsApp Button

The WhatsApp chat button, also known as the local WhatsApp button, is an image of the WhatsApp logo that is added to specific pages of a website, such as a homepage, landing page, contact page, or help section, to improve operational efficiency.

  • Floating WhatsApp Button

A floating WhatsApp chat button is a type of WhatsApp chat button that is designed as a small widget that will stay visible on the screen as the user scrolls through the website. This is achieved by positioning the button in a fixed location on the screen, usually in the bottom right corner, using a script or plugin

Steps to Add WhatsApp Chat Button On the Website

  • Step 1: Create Your Own Link

Use & edit the link to add your phone number in front of the link in order to make it work for your click-to-chat formation. Make sure to include a full phone number in the international format, with no zeroes, brackets, or dashes.

  • Step 2: Create your own link with a custom message

If you want to dedicate WhatsApp services for a specific purpose, you can add a pre-filled (custom) message while creating your own link to further label and organize the chats.

For example

(Use %20 for space)

About Chat button

  • Use the latest version of the button. You can download the button designs here.
  • Make sure the button is visible and easy to read.
  • You can use the WhatsApp button in many places, such as Landing Pages, Contact Pages, Help Pages, mobile apps, etc. 

How to add WhatsApp to your Shopify store?

You can use the WhatsApp Chat app from the Shopify App Store to add a WhatsApp button to your Shopify store. Here are the steps: 

  1. Go to the Shopify App Store and search for the WhatsApp Chat app.
  2. Install the app on your Shopify store.
  3. Once the app is installed, you can customize the button's appearance, including the color, text, and placement on your store's pages.
  4. You can also configure the app settings to include a pre-populated message, set specific business hours, and personalize the message when you are offline.
  5. After customizing the button, you can save your settings, and the WhatsApp button will appear on your store's pages.
  6. You can also test the button to ensure it is working properly and make necessary adjustments.

That's it! Your customers can now easily reach out to you through WhatsApp directly from your Shopify store.

Make sure you have a WhatsApp account with a valid phone number to receive messages from the website.

How To Add WhatsApp chat ButtonTo Your Website via

The Multichannel Chat Widget feature makes it a breeze to keep track of customer conversations from various channels in one central location. It also makes it simple to direct conversations to the appropriate agents while keeping an eye on important metrics and assessing overall performance. makes it easy for businesses to expand their reach by creating eye-catching, personalized broadcasts with minimal effort. This allows them to connect and reconnect with old and new customers to promote their latest products or services.

Additionally, with a Donut account, adding WhatsApp to your website is a cinch. It provides you easy access to the WhatsApp API account so you can connect and start communicating with your customers.

For creating a account, You must have the below-listed documents:

  • An active phone number that will be used when first registering for a Donut account
  • E-Commerce Account (Shopee/Shopify) or Social Media account (Facebook/Instagram)
  • Laptop Device to access Donut Desktop
  • The process to add a click chat link

You can connect your Donut account with WhatsApp by-

  • Step 1: Open “Integration” on the Setting menu and click WhatsApp
Step 1: Open “Integration” on the Setting menu and click WhatsApp
  • Step 2: Make sure you meet all the prerequisite requirements to connect with the WhatsApp Business API. 
Step 2: Make sure that you meet all the prerequisite requirements to connect with the WhatsApp Business API.
  • Step 3: You will be directed to Facebook to connect your Facebook Business Manager account.
Step 3: You will be directed to Facebook to connect your Facebook Business Manager account.
  • Step 4: After completing all the requirements on Facebook Business Manager, copy the number you will use, select WhatsApp or SMS and click " Verify Code".
Step 4: After completing all the requirements on Facebook Business Manager, copy the number you will use, select WhatsApp or SMS and click " Verify Code".
  • Step 5: After receiving the notification code, input it and click “Verify”.
Step 5: After receiving the notification code, input it and click “Verify”.
  • Step 6: Now your WhatsApp is connected with Facebook Business Manager! Complete your WhatsApp Business Profile and click “Save”
Step 6: Now your WhatsApp is connected with Facebook Business Manager! Complete your WhatsApp Business Profile and click “Save”
  •  Step 7: You have successfully connected your Donut with WhatsApp!
 Step 7: You have successfully connected your Donut with WhatsApp!

Now you can start interacting with your WhatsApp customers effectively with Chat Widget.

After you've created a Donut Account, you can add a WhatsApp chat widget to your website in two ways:

  1. By pasting the widget script into your website’s HTML source code.
  2. By using Google Tag Manager.

How to automate the WhatsApp chat on your website?

  • Quick Replies

Quick replies functionality in Whatsapp Business allows businesses to quickly respond to customer inquiries by providing them with preset messages.  It allows businesses to respond quickly to customer inquiries with pre-written responses, saving time and effort. It also allows businesses to set up quick replies to certain inquiries, such as frequently asked questions or commonly requested information. 

Quick replies are also beneficial in streamlining customer service and support processes, allowing businesses to respond quickly to customer inquiries and provide them with the necessary information.

  • Session Messaging

WhatsApp Business session messaging is a powerful tool for businesses to manage their customer conversations better. Session messaging is a feature that allows businesses to send messages to customers-initiated conversations in a specific order and enables businesses to keep track of customer conversations. By using session messaging, businesses can ensure that customers receive all the information they need in their conversations with the business.

A messaging session begins when a user sends a message to your company and lasts 24 hours in the most recently received message.

  • Live Chatbots

The live chatbot functionality of Whatsapp business is a great way to engage with customers quickly and conveniently. It allows businesses to provide immediate answers to customer inquiries, as well as provide 24/7 support. It also helps capture lead data, make automated product recommendations, and streamline customer service processes.

WhatsApp’s automated live chat feature works by using pre-set keywords, phrases, or questions that prompt the automated chatbot to respond with an appropriate answer. Whatsapp business chatbot enables customers to interact with businesses in real-time, 24 hours a day, 7 days a week, through the popular messaging platform.

  • Auto-replies

Auto-replies on WhatsApp Business allow businesses to send automated responses to common customer queries, making communication simpler and faster. By setting up auto-replies, businesses can reduce the time spent on manually responding to customers' messages and provide a better customer experience.

  • Targeted Messaging

WhatsApp Business includes targeted messaging functionality, which enables businesses to communicate more effectively with customers.

Targeted messaging is an advanced feature of WhatsApp Business that allows businesses to send custom messages to customers in specific categories or segments. This feature allows businesses to tailor messages to different audiences, ensuring the right message is delivered to the right audience. For example, businesses can use targeted messaging to send special offers.


In conclusion, adding a WhatsApp button for a website is important to providing excellent customer service and engagement. A WhatsApp chat button emerges as an alternative to traditional contact methods, such as email or phone, making it more convenient for customers. 

Adding a WhatsApp chat button to your website is as simple as putting a cherry on top of a sundae. It's a small but sweet addition that can make a big impact on customer engagement.

Adding a WhatsApp chat button to a website can have many advantages as it provides a more personal and direct way for customers to connect with the business.

Grow your customer base and promote your latest products and services with’s customizable broadcast feature

Book A Demo

Table of content

Direct conversations for durable customer relationships

Enhance customer loyalty with