How to Add a WhatsApp Button without Plugin to Your Website? Quick In 1 Minute!
Table of Contents
Early on
The contemporary digital environment makes it essential for companies to provide quick communication choices to the consumers that visit their websites. A WhatsApp Button without Plugin is a quick way to improve the general customer experience, boost involvement, and offer real-time help. Companies no longer need to employ live chat tools offered by outside vendors since WhatsApp’s integration for websites allows them to interact with customers straight via WhatsApp.
Within the parameters of this article, we will look at the most basic method to include a WhatsApp Chat Button into your Linux website without using a plugin. This technology guarantees flawless performance, fast loading rates, and improved security by means of its application.
Should you want to include a WhatsApp Button without plugin on your website, you should:
- It will not have any effect on your site index speed optimization
- Immediate communication: With just one click, the immediate communication tool lets guests connect straight on WhatsApp.
- Higher engagement: Since messaging increases engagement rates, people choose it over phoning or emailing.
- Better conversion rates: Faster reactions translate into more sales and higher degrees of customer satisfaction.
- Cost-effective: WhatsApp is totally free to use and requires no further costs unlike live chat services.
- Mobile-friendly: Since most users already have WhatsApp installed on their cellphones guarantees a flawless interaction.
The Complete Guide on Including a WhatsApp Button without plugin into Your WordPress Website
Step 1: Launch the Theme Editor
- Enter into the Admin Dashboard of your WordPress account.
- Start on the Appearance menu and choose Theme File Editor.
- Open the footer.php file you see here.
Step 2: Enter the WhatsApp Chat Code
Just before the </body> element closing your footer.php file, type the following codes:
<!-- WhatsApp Chat Button -->
<style>
.whatsapp-chat {
position: fixed;
bottom: 20px;
right: 20px;
background-color: #25D366;
color: #fff;
width: 60px;
height: 60px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 28px;
box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);
z-index: 1000;
transition: transform 0.3s ease-in-out;
}
.whatsapp-chat:hover {
transform: scale(1.1);
}
@media (max-width: 768px) {
.whatsapp-chat {
width: 50px;
height: 50px;
font-size: 24px;
bottom: 15px;
right: 15px;
}
}
</style>
<a href="https://wa.me/YourPhoneNumber" target="_blank" class="whatsapp-chat">
<img src="https://upload.wikimedia.org/wikipedia/commons/6/6b/WhatsApp.svg" width="40" height="40" alt="WhatsApp">
</a>
Step 3: Personalize Your WhatsApp Button
- Your genuine WhatsApp number—for Saudi Arabia, for example, +966XXXXXXXXX—should replace YourPhoneNumber.
- You might change the position, size, and hover effects of the button inside the CSS area.
Step 4: Save and Test the Changes
- Choose the Update File option found under the PHP Theme Editor.
- Visit your website to test whether the WhatsApp Chat Button shows in the bottom right corner.
- Click the button to guarantee it is sent to WhatsApp in the suitable direction.
How to Ensure Your WhatsApp Chat Button Works on Mobile Devices?
We have inserted a CSS media query in the just provided code to ensure that the WhatsApp button operates faultlessly on mobile devices. This helps to improve the user experience by greatly shrinking the button on smaller screens.
Using a Custom HTML Widget to Add WhatsApp Button
If you would want not to tamper with the theme files, you may add the WhatsApp Button without Plugin by means of a Custom HTML Widget.
- See Widgets in the Appearance menu.
- Put a Custom HTML Widget in the widget location you want to use—that of the bottom or the sidebar, for instance.
- Paste the just mentioned HTML code straight into the widget.
- After a Save button click, refresh your webpage.
Those consumers who prefer not to directly alter the theme files could maybe gain from this approach.
Last Thoughts (WhatsApp Button without plugin)
One great way to improve interaction with your clients and raise their degree of involvement on your WordPress website is including a WhatsApp chat button. WhatsApp’s inclusion for the website enables guests to quickly contact you, therefore facilitating their easy access to you and hence raising customer happiness and conversion count.
Whether it’s with customizing PHP, optimizing your website, or WhatsApp integration, the staff at Apex Tech Agency is here to assist you in any manner you need.
📧 Contact us at: info@apextechagency.com
🌐 Visit our website: apextechagency.com
Want to Boost Your Marketing with Apex WA Marketing Software?
Looking to raise the caliber of your marketing campaigns? Using Apex WA Marketing Software can help you to improve client involvement, simplify WhatsApp messaging, and automate outreach. Find out how our program might help your company flourish right now. See more information by visiting Apex WA Marketing Software!
