Grow Your eCommerce Store With WhatsApp Conversational Marketing. Explore Now →

How To Add WhatsApp Chat To Shopify Website

Kazi Nazia

Content Editor

The first impression is the last impression-the same goes for your Shopify website. If you want your website visitors to make a purchase, you need to make sure that they have everything they need there. Including a hassle-free way to communicate with you. 

You can always have your contact number, email, or other means of contact. But you know what will be the best option? 

WhatsApp. Here’s why - 

Almost 2 billion people worldwide use WhatsApp. And out of Internet users aged 16-64, WhatsApp reigns supreme, beating out Instagram and Facebook to the top spot of the most popular social network. So more often than not your customers would be more comfortable with using WhatsApp.

If you want to make your Shopify website more convenient for users with WhatsApp, then keep on reading. 

How To Install WhatsApp Chat to Shopify Website

Step 1: Install the app in Shopify

First thing first, you need to find a suitable app to integrate WhatsApp chat with your Shopify website. For that, log in to your Shopify dashboard and go to Apps from the left-side menu bar. Then click on the ‘customize your store’ button on the top right corner. You will then be directed to the shopify app store. 

From there on, click on the search bar and search for ‘WhatsApp chat’. You will be introduced to a number of Shopify apps that work with WhatsApp chat. But for this tutorial, we will stick to the ‘WhatsApp chat+Abandoned cart’ app. It’s a free app that has a hassle-free process to install WhatsApp chat along with other features. Click on the app and click add app. Go through the permission screen and click on install app. Once it’s installed you will be automatically redirected to the app's dashboard. 

Now you just need to configure the app’s settings as per your liking. 

Step 2: Modify the app’s settings 

Now that you are at the app’s dashboard, you will now start configuring its settings. You can scroll down to see multiple options to customize your chat widget.

  1. Update WhatsApp account number

The first thing you need to do is update your WhatsApp account number. For that, you need to click on the first option which is ‘Mobile No. & design+ profile picture’. Here you need to add your WhatsApp account number that your website visitors will reach out to. So when they click on the WhatsApp chat widget and send a message it will be directed to that specific number. 

If you have multiple agents looking over your WhatsApp channel then you can also modify the settings so that they can access the WhatsApp chat widget at specific times of the day. For that just scroll down and set the timing. If all of your agents are offline at the same time then the chat widget will go off mode and won’t show up on your website.  

You can also change your WhatsApp chat icon’s avatar and WhatsApp chat name in the ‘Mobile No. & design+ Profile Picture’ option. Once you’ve brought these changes click on ‘save’. 

  1. Modify font and text

The next option is ‘Colors, Fonts Configuration’ which will allow you to change the background color of your WhatsApp chat widget. You can stick to the classic green shade or you can pick any color from an array of options to match your website’s color palette. You can see the real times changes in the widget on the bottom right corner of the screen. 

You can also change the font from all the available fonts in that section. This font is for the text that is displayed with the chat widget. Like - chat with us. Right below that you can change the font size and the font style (bold, italic, and bolder). 

On the text configuration option, you can edit the pre-fill text, offline text, and welcome message that your customers will see when they see the chat widget, click on it, and continue the conversation. You can also add the tracking order parameters for your customers right below that. Which allows them to see where their packages are at the moment. 

  1. Modify the position of the chat widget, call to action button, and email

In the ‘Button Display & Position’ option, you can change where your chat widget is seen on your screen. 

In the enable call to action button you get to enable or disable the call to action feature for the chat widget. If you decide to enable it, you can bring further changes to the feature. You can change the animation, time duration, and the text that will be displayed with the call to action button. 

Finally, if you want to collect the email of your customers enable the ‘Email Popup in Chat’ option. This will allow you to notify your customers about offers and discounts through emails when needed. Edit the header text, button text, placeholder text, etc as needed. 

Once you’ve done all of the above changes click on save. And now you’re good to go. You have now successfully added the WhatsApp chat widget to your Shopify store. 

End Note

Making your store's website more user-friendly should be your top priority. It's fantastic to have email and contact information. However, many of your clients will not bother to email each member of your staff individually for a single question. And that's a possible sale lost.

As a result, having a WhatsApp chat widget on your website is always useful. You should be set to go now that you know how to install it on your WordPress website!

More from the Merchant's Guide