The 3 Best Ways To Add a WhatsApp Chat To Your Website

The Best Ways To Add a WhatsApp Chat To Your Website get.chat WhatsApp Business API
The Best Ways To Add a WhatsApp Chat To Your Website get.chat WhatsApp Business API

With over 2 billion users worldwide, WhatsApp is the most popular messaging app today. One way to leverage the app’s popularity and improve the customer journey is to include a WhatsApp chat on your website.

This article will discuss why adding a WhatsApp chat to your website is important. And we’ll show you how to incorporate WhatsApp into your website in the best way possible.

Benefits of adding a WhatsApp chat to your website

You should add a WhatsApp chat feature to your website for many reasons.

Drive more user-initiated conversations

Whether you are a WhatsApp Business application user or a WhatsApp API user, you can always benefit from more customers initiating conversations with you.

First and foremost, more conversations result in more leads and sales, but for WhatsApp API users, it also means less cost. And that’s because user-initiated conversations through the WhatsApp Business API cost less than business-initiated ones, plus the first 1000 conversations are free. You can read more about conversation pricing in the WhatsApp documentation.

Retarget visitors and promote your product

Once a visitor reaches out to your business via WhatsApp, you can store their number and get back to them later to offer discounts or promote new products. If you are a user of the WhatsApp Business API, you can create a list of these visitors and send them a bulk promotional message. 

Establish a sense of trust and proximity

Unlike email, Live chat, and SMS, WhatsApp is not only used for formal communication and promotions. People primarily use it to communicate with friends and family. By entering this list of contacts, you can establish a closer relationship with your clients and motivate them to trust your business more.

If your business is focused on driving better sales and marketing results, here are some additional interesting insights about WhatsApp

  • People are more likely to buy from a brand if there’s a WhatsApp option available (Spectrum.io Nov. 2022)
  • Some of 360dialog’s clients reported an open rate that is higher than 95%
  • Customers are likely to spend more if they can communicate on WhatsApp (Spectrum.io Nov. 2022)

How to add a WhatsApp Chat to your website

There are three ways how you can add a WhatsApp Chat on your website:

  1. WhatsApp link
  2. QR code 
  3. Floating chat widget

1. WhatsApp Link

There are three methods or otpions to create a WhatsApp link that your business can add on your website

"wa.me" Link

This method is the most straightforward one available. You can generate a WhatsApp link by simply adding your business number after the “/” of this link: https://wa.me/

For example,if the business number is 4915792500511, then the link would be: https://wa.me/4915792500511

"api.whatsapp.com" Link

Another way of creating a WhatsApp link is to add your business phone number “491579250051 for example to the end of this link after “=”: https://api.whatsapp.com/send/?phone=. And our WhatsApp link would be: https://api.whatsapp.com/send/?phone=4915792500511 

(Recommended) "wa.me/message" Link

1 min tutorial - How to create a WhatsApp QR code and Link with the WhatsApp Manager

This video shows the most stable and effective approach to create a WhatsApp link and QR code that can be scanned through the WhatsApp application

This method is proven to be the most effective, especially for WhatsApp Business API users that want to generate a QR code out of the link too. If you have a WhatsApp API that is linked to a Facebook account, you can:

1. Head to the WhatsApp manager in https://business.facebook.com/
best ways to add a WhatsApp chat to a website get.chat WhatsApp Manager e1676468228922 get.chat WhatsApp Business API
2. Click on Message Links and the “Create Message Link”
create message link get.chat WhatsApp Business API
3. Write a prefilled message that your customers can send, like “Hello, I need support”
getchat add whatsapp chat to your website get.chat WhatsApp Business API

This will create a link in this format https://wa.me/message/SPB344ZGQXE3B1 and a QR code that you can download as PNG or SVG

2. QR code

Another way of enabling web visitors to reach out to you on WhatsApp, especially on your desktop, is through a QR code. The advantage of QR codes is that users can quickly scan them and start a conversation with you without having to register your number or enter the link into their phone browser. It is usually best to use a combination of a WhatsApp QR code, link, and number, so the user can pick what works best for them. Here’s how you can create a WhatsApp QR code:

Through the WhatsApp manager (Recommended):

If your WhatsApp number is linked to your Facebook account, you can generate the QR code using the third method in the previous section. And you can simply download it as SVG or PNG and display it wherever you want on your website. Here’s an example of a QR code generated through the WhatsApp Manager on business.facebook.com :

SPB344ZGQXE3B1 get.chat WhatsApp Business API

Our clients have reported issues with QR codes generated through other means, especially when users try to scan them within WhatsApp. Therefore, this QR code seems to work best.

Through a third-party tool:

We do not necessarily recommend this method, but technically, any link can be turned into a QR code, so after generating your WhatsApp link: https://wa.me/[InsetYourNumberHere] or https://api.whatsapp.com/send/?phone=[InsetYourNumberHere], you can turn it into a QR code using a QR generator like:

  1. Qr.io
  2. https://qrfy.com/
  3. qr-code-generator.com

Please be aware that these platforms have their own pricing and subscriptions. Therefore, choosing one can be based entirely on your preferences. Also, some of these QR codes might expire in the free model after a specific time period. 

We recommend creating the QR code in the WhatsApp manager or displaying it through the free get.chat Widget creator we will discuss below.

3. get.chat Widget creator

get.chat’s widget creator is the ideal solution if your business is looking for a free and comprehensive solution to add WhatsApp and other messaging apps to a website. The chat widget creator enables you to add the following messaging apps:

  1. WhatsApp
  2. Messenger
  3. Instagram
  4. Viber
  5. Line
  6. Telegram
  7. SMS

Moreover, the widget creator enables you to generate a QR code for WhatsApp for free, and it gets displayed only on desktop when visitors click on the floating chat widget. The widget creator generates the QR code automatically once you add your phone number, but you can optionally add your URL that is generated from your WhatsApp Manager in business.facebook.com

To create and customize the chat widget for your website:

  1. Head to https://get.chat/chat-widget-creator/
  2. Select the messaging apps that you want to add to your website
  3. Fill all the required fields with the relevant information
  4. Enter your email and click on “Get Code”

To add the chat widget to your website:

To display the chat widget that you’ve created on your website, copy the code that you received via email and then paste the </body> tag on every page of your website.

On WordPress:

Adding the WhatsApp chat widget to your website can be done with or without a plugin.

With a plugin: Go to Plugins in the admin area → Install the plugin “Head, Footer and Post Injections” and activate it. Go to Settings → Header and Footer→ Paste your code under the section titled “BEFORE THE </BODY> CLOSING TAG (FOOTER)”

Without a Plugin: Go to Appearance→ Theme file editor → Look for footer.php in the theme files → Paste your code right before the closing </body> tag.

Please note that the chat widget supports multiple content management systems such as Webflow, Wix, Shopify, Joomla and Prestashop.

Also, please be aware that get.chat and getchat.app are not the same product. get.chat’s chat widget creator is completely free, while GetChat.app is managed by another company that requires payment for certain customization features.

How to leverage WhatsApp on your website with get.chat

Now that you know how to add WhatsApp to your website, it’s important to remember that you might deal with a large volume of WhatsApp messages. And, of course, visitors don’t like to wait or to be ignored in most cases, which is why the get.chat team inbox is the perfect complementary product for the WhatsApp chat widget. The most important features are

1. Multiple user and multi-device access:

The get.chat team inbox enables multiple users and devices to access your business’s inbox simultaneously. By giving multiple users access, you can decrease response times and ensure that the right team members answer the right questions.

2. Saved responses and template messages

With the get.chat team inbox, you can standardize communication and enable your team to respond faster to messages by setting up template messages and saved responses.

3. Auto-responses and away messages

The get.chat rule engine enables its users to set up auto-replies to messages with specific keywords or other triggers, such as the user’s first message. Moreover, the rule engine enables users to automate tasks, such as chat tagging and assignment. Using it, you can automatically send a greeting message to users from your website. Here’s how you can do it:

  1. Specify a prefilled message in your chat widget like “Hello” or “Hi”
  2. Set up a rule in the get.chat rule engine so whenever a user sends a message containing “Hi” or “Hello,” they automatically get a response of their choice.

By connecting your chat widget to the get.chat team inbox, you can provide your web visitors  with an incredible user journey and ensure that you can handle a large number of conversations when the traffic to your website or landing page grows.

Interested in getting a team inbox free of cost with the WhatsApp Business API?

get.chat is available at no additional cost for 360dialog users!