Summary

This article explains how to add a WhatsApp chat button to your website using WATI’s WhatsApp Chat Button Widget. Whether you’re using a custom website or platforms like Shopify or WooCommerce, this guide provides clear, step-by-step instructions to help you set up the widget, customize it, and embed it into your site. By the end, you’ll have a fully functional chat button that allows visitors to message you directly on WhatsApp, enhancing communication and engagement.

Instructions

Adding a WhatsApp chat button to your website is a great way to connect with your visitors and provide instant support. This guide will walk you through the process step by step.

Note: If you’re a WATI customer using Shopify or WooCommerce, you can add the WhatsApp chat button directly from the integration page.

Go to WATI > Integrations > Shopify or WooCommerce > WhatsApp Chat to set it up.

For custom websites, you can add a WhatsApp Chat Button Widget that links to your personal WhatsApp number. The widget is fully customizable to match your branding and can be added to all pages of your website.

Step-by-Step Guide to Adding the WhatsApp Chat Button

Follow these steps to add the WhatsApp chat button to your website:

1. Visit the WhatsApp Chat Button Page

Go to WATI’s WhatsApp Chat Button page and click Generate Now.

2. Customize Your Chat Widget

Enter Your WhatsApp Number: Click on Phone Number and enter your WhatsApp account number.
Edit the Default Message: Click on Default User Message to customize the message visitors will see when they open the chat.

3. Generate the Widget Code

Once you’ve customized the widget, click Generate Widget Code. A code snippet will be generated for you.

4. Add the Code to Your Website

Copy the generated code snippet.
Paste the code just above the </body> tag on every webpage where you want the chat button to appear.

Tips for Success

Test the Widget: After adding the code, visit your website to ensure the chat button appears and functions correctly.
Customize Further: You can adjust the widget’s appearance and behavior to align with your branding.

That’s it! You’ve successfully added a WhatsApp chat button to your website. If you have any questions, feel free to reach out to the WATI support team.

Frequently Asked Questions (FAQs)

General Questions

1. What is the WhatsApp Chat Button Widget?

→ The WhatsApp Chat Button Widget is a tool that lets you add a clickable WhatsApp chat button to your website. Visitors can use it to message you directly on WhatsApp, making it easier for them to connect with you.

2. Who can use this feature?

→ This feature is designed for users with custom websites. If you’re using Shopify or WooCommerce, you can add the chat button directly through Wati’s integration page.

3. Is the widget customizable?

→ Yes, you can customize the widget to match your branding. You can edit the default message and adjust the appearance to suit your website’s design.

Setup and Configuration

4. How do I generate the widget code?

→ Visit Wati’s WhatsApp Chat Button page, enter your WhatsApp number, customize the default message, and click Generate Widget Code.

5. Where do I paste the widget code on my website?

→ Paste the generated code snippet just above the </body> tag on every webpage where you want the chat button to appear.

6. Can I add the chat button to multiple pages?

→ Yes, you can add the chat button to all pages of your website by pasting the code snippet on each page.

Compatibility and Integration

7. Does this work with platforms like Shopify or WooCommerce?

→ If you’re using Shopify or WooCommerce, you don’t need to use this widget. Instead, go to Wati > Integrations > Shopify or WooCommerce > WhatsApp Chat to set up the chat button directly.