📌How to Add Whatsapp Chat Button to WordPress Website?
Adding a WhatsApp chat button to your WordPress website is crucial for quick 24/7 x 365 days customer support and can boost customer engagement by permitting visitors to contact you easily. Here are several methods to do this:
👉Method 1: Using the Hello24ai Plugin
There are several plugins available that can help you add a WhatsApp chat button to your WordPress site. One of the most popular plugins is the “Hello24ai” whatsapp wordpress plugin.
📢How To Do With Steps:
- Install the Plugin:
- Go to your WordPress dashboard.
- Navigate to
Plugins>Add New. - Search for “Hello24ai” or Download the plugin [here]
- Click
Install Nowand thenActivate.
- Configure the Plugin:
- After activation, go to
Hello24aisettings. - Signup and select a plan (full pricing plans & features here)
- Use the connect to whatsapp option, enter your WhatsApp number to register on whatsapp API.
- Later customize the appearance of the button.
- Configure other settings like position, message templates, etc.
- Save the changes.
- After activation, go to
- Add the Button to Your Site:
✅PRO TIP: Hello24ai’s WhatsApp Plugin for WordPress (WooCommerce): The Missing Piece in Your Website
👉Method 2: Manually Adding Code (try this only if you have knowledge about wordpress websites)
If you prefer not to use a plugin (not recommended), you can manually add a WhatsApp chat button by inserting HTML and CSS code
📢How To Do With Steps:
- Add HTML Code:
- Go to your WordPress dashboard.
- Navigate to
Appearance>WidgetsorAppearance>Customize>Widgets. - Add a
Custom HTMLwidget to your desired widget area. - Insert the following code:
<a href="https://wa.me/yourwhatsappnumber" class="whatsapp-button">
<img src="path_to_whatsapp_icon" alt="Chat with us on WhatsApp">
</a>- Replace ‘
yourwhatsappnumber‘ with your actual WhatsApp number (including the country code without any symbols or spaces). - Replace ‘
path_to_whatsapp_icon‘ with the URL of the WhatsApp icon image you want to use.
2. Add a CSS Code:
- On your wordpress website go to ‘
Appearance‘ >Customize>Additional CSS. - Add the following CSS to style & setup click to chat whatsapp wordpress the button:
.whatsapp-button {
position: fixed;
bottom: 20px;
right: 20px;
background-color: #25D366;
border-radius: 50px;
padding: 10px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}
.whatsapp-button img {
width: 50px;
height: 50px;
}
- Ensure to adjust the CSS to match your website’s design.
3. Finally Publish All The Changes & Test check the preview or live website:
- Save and publish your changes.
- The WhatsApp chat button will now appear on your site – ensure to check.
👉Method 3: Using a Page Builder Tool that is available in the wordpress plugins marketplace.
If you are using a page builder like Elementor or WPBakery, you can add a WhatsApp chat button using their widgets or modules.
📢How To Do With Steps for Elementor:
- Edit with Elementor:
- Go to the page you want to edit and click
Edit in Elementor.
- Go to the page you want to edit and click
- Add the Button Widget:
- Pull and drop a
Buttonwidget onto your page. - In the button settings, set the
Linktohttps://wa.me/yourwhatsappnumber. - Customize the button text and style according to your brand tone.
- Pull and drop a
- Save All Changes:
- Save and publish the page.
📢Some Must Check Additional Tips:
- Test Thoroughly: Ensure the WhatsApp chat button works correctly on different devices and browsers.
- Privacy Policy: Inform users about data collection and usage related to WhatsApp chat.
- WhatsApp Business Account: Consider using a WhatsApp Business account for better management and features.
- Chatbots: Explore using chatbots to automate responses and improve customer support efficiency.
📌How to send a WhatsApp message from WordPress?
Directly sending WhatsApp messages from your WordPress website to users is not possible without using third-party services or APIs. WhatsApp has strict guidelines about how its platform can be used, and direct integration with WordPress is not permitted.
👉Integrating with a WhatsApp API via Hello24ai
Purpose: Send automated WhatsApp messages based on user actions (e.g., form submission, order confirmation).
✅How it usually works:
- Requires technical expertise or a developer.
- Involves setting up a WhatsApp Business account, obtaining an API key, and integrating it with your WordPress site.
- Allows for more complex automation and messaging.
📢Recommended option: Book a demo call with an expert team of hello24ai for free setup & onboarding (here)
👉Example use cases:
- Send a WhatsApp notification when a new contact form is submitted.
- Send a WhatsApp message to a customer when their order is shipped.
📌How to create and add a WhatsApp link in WordPress?
The best easiest and most straight forward way to create and add a WhatsApp link in WordPress is via the Meta Business Manager – get a complete how to do step by step process (here).
Now if you find the above steps a bit overwhelming then simply use the below URL to create a whatsapp link:
https://wa.me/yourwhatsappnumber?text=customtext- Replace ‘
yourwhatsappnumber‘ with your full phone number in international format without any spaces or the “+” symbols (e.g., For a WhatsApp Chatbot number +91 80565 85189, the “+” symbol is not required in the whatsapp URL link. - Replace ‘
customtext‘ with the message you want to prefill. Encode spaces with%20.
👉An Example:
https://wa.me/8056585189?text=Hey%20Hello24ai%20Chatbot%20I%20have%20a%20question%20about%20your%20WhatsApp%20Automation%20software
Now you can add this whatsapp link to a post, website page, or even as an anchor text on the Contact Us page of your wordpress website
📌Is there a WhatsApp plugin for WordPress?
Yes, there are several whatsapp plugins for wordpress websites but the best one still used by 500+ businesses globally is the Hello24ai whatsapp plugin for wordpress.
Hello24.ai is a SaaS company & Meta Tech Partner for the official WhatsApp Business API that enables in conversational commerce integration for Shopify & WooCommerce (WordPress). Here’s a breakdown of what that means:
- Conversational commerce: This is a type of e-commerce that focuses on using conversational channels like messaging apps (WhatsApp being a popular example) to interact with customers and facilitate sales.
- Platform: Hello24.ai provides a platform that businesses can use to build and manage their conversational commerce strategy specifically on WhatsApp.
👉Here are some key features of Hello24.ai’s platform:
- WhatsApp Chatbot Creation: Build chatbots that can automate interactions with customers on WhatsApp.
- Customer Segmentation: Group customers based on their interests and purchase history for targeted marketing.
- User Engagement Analytics: Track how customers interact with your chatbot and website to improve your strategy.
- Centralized Contact Database: Manage all your customer interactions in one place.
- Order Management: Process orders received through WhatsApp conversations.
- E-commerce Integration: Connect your Hello24 account with your e-commerce platform (like Shopify) for seamless order management.
- Payment Gateway Integration: Accept payments directly through WhatsApp conversations.
👉In short, Hello24.ai helps B2B2C & D2C businesses leverage the power of WhatsApp to:
- Improve customer service: Respond to inquiries quickly and efficiently.
- Increase sales: Drive sales through conversational marketing and automated checkout processes.
- Boost customer engagement: Build stronger relationships with customers through personalized interactions.
I hope this explanation clarifies what Hello24.ai is and what it offers.
Do you have any other questions about Hello24.ai’s WhatsApp WordPress capabilities or conversational marketing in specific?
