25 August 2021

How to add WhatsApp to your website: Chat button, QR code, and more

Written by

Faye Chong

Digital Marketing Executive


25 August 2021

How to add WhatsApp to your website: Chat button, QR code, and more

Written by: Faye Chong, Digital Marketing Executive


WhatsApp has over 2 billion active users and 100 billion messages exchanged every year. This comes as no surprise when businesses decide to make the shift from traditional modes of communication to chatting with their customers on WhatsApp. 

That’s why with the introduction of WhatsApp Business in 2018, businesses can now use the platform to:

And many more! 

Now, if you’re looking for ways to further leverage the use of WhatsApp, did you know that you can also add the messaging app to your website? 

Plus, there are multiple ways you can add WhatsApp to your website. 

In this article, we deep dive into why you should integrate WhatsApp into your website and how you can go about doing it! 👇

Why should you add WhatsApp to your website?

Add a personal touch

WhatsApp was built to serve as a personal messaging application. It was only later in its years that businesses started using WhatsApp for, well, business purposes.

That said, the majority of us have used (and continue to use) WhatsApp for non-business related conversations with family and friends. 

By inserting your business into such an environment, you automatically create a more intimate setting to converse with your customers. Furthermore, this personal setting might make your customers feel as if they’re chatting with a friend, making them feel more comfortable when interacting with you.

Create better customer relationships

Thanks to its global reach and large user base, WhatsApp is currently the ideal messaging platform for building better customer interactions.

Messaging has transformed how leads and customers perceive businesses. No longer are they sending emails or making phone calls that feel impersonal and business-like. When messaging a business, they now feel that they are talking to a person-like persona when messaging a business.

In fact, 55% of people reported feeling more personally connected to a company when they messaged them. Because text messaging allows for quick responses, this accelerates the development of a relationship between leads and businesses.

Easily stay in touch

We’ve most likely been in this situation before — you contact a business via live chat, wait for a response, and then decide to leave in the end because you can’t be waiting around all day. 

The majority of live chat software integrate with email software so customers receive an email notification once you do reply via live chat. 

However, there is no way to retain a high level of customer satisfaction and maintain a smooth customer support process. You’re giving your customer an additional step of having to check their email for your response when they initially reached out on your website. 

But when your customer gets in touch via WhatsApp, they don’t have to stay on your website to wait for a reply. Furthermore, they can simply continue the conversation in the same WhatsApp chat instead of having to reply through email. 

You can also easily send a post-support message to follow up with them all within the same chat.

How to add WhatsApp to your website

There are certainly many different ways you can integrate WhatsApp on your website. Some may be more complex than others and even require some basic coding knowledge. 

But of course, we always want to take the easier route. 

And we hear you! So let’s take a look at 4 easy ways you can add WhatsApp to your website. 😎

WhatsApp chat button

A WhatsApp chat button is one of the simplest methods to seamlessly integrate WhatsApp onto your website. 

It allows website visitors to directly start a chat with you via WhatsApp by clicking a button. They will be able to start a new chat with you on WhatsApp without having to leave your website. All messages will be reflected on your WhatsApp Business account (or regular WhatsApp if you’re not using a business account).

Your customers do not need to save your contact (and vice versa) to initiate a conversation using this chat widget. 

Think of it as a live chat, but just for WhatsApp.

An example of a WhatsApp chat button. Source: NovoChat

An example of a WhatsApp chat button. Source: NovoChat

👉 Here’s how you can install a WhatsApp chat button: 

1. Find a suitable provider, such as NovoChat’s chat button builder. Choose your preferred messaging platform to integrate (we integrate with WhatsApp, Facebook Messenger, Telegram, and LINE). Insert your phone number to connect the builder to your account.

2. Customize your widget by changing fields like your company logo, button text, and greeting message.

3. Enter your email address to receive a code. Copy and paste the code into your website and you’re done!

NovoChat chat button builder code sent to your email.

NovoChat chat button builder code sent to your email.

Multichannel chat widget

A multichannel chat widget is similar to a chat button. The only difference is that it provides more than one communication channel

Here’s an example. If you’re actively using WhatsApp and Messenger for business communication, installing a WhatsApp chat button on your website only allows you and your customers to communicate via WhatsApp. If customers choose to reach out through Messenger, you’ll need to have a Messenger tab open in your browser to communicate there. 

But, with a multichannel chat widget, you aren’t limited to just one platform — you can connect all the messaging platforms you and your customers use!

NovoChat website widget

This gives your customers the option to choose their preferred platform to communicate with you, be it WhatsApp, Messenger, Telegram, or LINE.

👉 Here’s how you can install a multichannel chat widget: 

1. Configure your widget design details such as your company logo, widget color and orientation.

2. Select the communication channels you use so they show up on the website widget.

3. Copy and paste the installation code into your website and you’re done!

QR code

For those who don’t want to go through other providers and want to work directly with WhatsApp, this method is for you. 

By including a QR code that links directly to your WhatsApp account, your customers can easily initiate conversations with you just by scanning the code. 

Furthermore, you can insert this QR code anywhere on your website — within paragraphs of text, in your navigation bar or footer, and more.

An example of a WhatsApp Business account’s QR code

An example of a WhatsApp Business account’s QR code

👉 Here’s how you can install a WhatsApp QR code: 

1. For WhatsApp Business accounts, click on the 3 buttons on the top right corner, head under ‘Business Tools’ and click on ‘Short Link’.

2. Tap on ‘Share Link’ and copy your unique business code.

4. Paste your link into a QR code generator such as QR Code Generator to generate a QR code. If you simply copy and paste it directly from WhatsApp, it will show up as an image of the QR code and not a code itself. 

5. Copy this code and include it anywhere on your website!

WhatsApp click to chat

Again, if you prefer to work directly with WhatsApp, you’ll be delighted to know that WhatsApp has its very own click to chat feature!

WhatsApp's click to chat feature is similar to a chat button where customers click to directly chat with you. But instead of clicking a button, they click on a URL. Your customers need not know your phone number and vice versa to initiate a conversation with you via the click to chat feature.

By clicking the link, a chat with the person automatically opens. This feature works on both your phone as well as WhatsApp Web. 

However, do take note that this click to chat link is suitable for businesses who only intend to include this on one webpage. That’s because sharing this link on multiple pages (and multiple times on a single page) can make your page look cluttered. 😩

👉 Here’s how you can create a WhatsApp click to chat link: 

1. Use https://wa.me/<number> where the <number> is the phone number you would like to use. This can be your WhatsApp Business number or personal WhatsApp number. Omit any zeroes, brackets, or dashes when adding the phone number in international format.

For example, the phone number you’re using is +65 9123 4567. Your click to chat link will be https://wa.me/6591234567.

2. Copy this link and paste it anywhere on your website!

So how should you integrate WhatsApp?

We’ve shown you many different ways you can integrate WhatsApp into your website. But which method should you use? 

It really depends on what your current and future business communication strategy is. 

If you’re only active on one platform and don’t plan to incorporate other channels into your communication strategy, use a chat button builder. It’s simple to install, completely free (for most providers), and gives your customers access to your main platform for communication. 

It’s also much more eye-catching to have a chat button on the bottom of your page than multiple QR codes or click to chat links. 

On the other hand, if you’re active on multiple channels or plan to use other apps to communicate in the future, consider using a multichannel chat widget. You can connect all your main messaging channels in one place and give your web visitors the option to choose their preferred one. 

Whichever method you intend to choose, you can’t deny that WhatsApp messaging is transforming the way customers and businesses communicate. 

What are you waiting for? Stop losing precious opportunities and start communicating with your customers via WhatsApp with NovoChat's 7-day free trial! 👇