• Sat. Dec 14th, 2024

Enhance User Engagement: Add WhatsApp Chat Call-to-Action on WordPress Website (No Plugin)

ByAK Digital Soft

Jul 4, 2023

To add a WhatsApp chat call-to-action on your WordPress website without using any plugins, you can follow these steps:

Step 1: Log in to your WordPress dashboard.

Step 2: Navigate to “Appearance” and click on “Theme Editor.”

Step 3: In the Theme Editor, locate and click on the “functions.php” file from the list of theme files on the right-hand side.

Step 4: Add the following code snippet at the end of the functions.php file:

function add_whatsapp_chat_button() {
echo ‘Chat on WhatsApp‘;
}

add_action(‘wp_footer’, ‘add_whatsapp_chat_button’);

Replace “YOUR_PHONE_NUMBER” in the code with your actual phone number, including the country code but excluding any leading zeros. For example, if your phone number is +1 (555) 123-4567, you would enter “15551234567” in the code.

Step 5: Save the changes by clicking on the “Update File” button.

Step 6: Now, open your WordPress theme’s style.css file. You can find it by clicking on “Appearance” and then “Theme Editor.”

Step 7: Add the following CSS code snippet at the end of the style.css file to style the WhatsApp chat button:

.whatsapp-button {
display: inline-block;
background-color: #25D366;
color: #fff;
padding: 10px 15px;
border-radius: 5px;
text-decoration: none;
font-weight: bold;
}

Step 8: Save the changes to the style.css file by clicking on the “Update File” button.

Step 9: Visit your WordPress website to see the WhatsApp chat button displayed on the front end.

When visitors click on the button, it will open a new tab or window to the WhatsApp web or mobile app, allowing them to initiate a chat with you using the provided phone number.

Note: Make sure to test the button and ensure it works as expected. If you encounter any issues or need further customization, consider seeking assistance from a web developer.

Watch Video: