Add WhatsApp Chat Button In Blogger Blog

If you want to connect instantly with your blog visitors, adding a WhatsApp chat button is one of the easiest and most effective solutions. In this guide, you’ll learn how to add a fully working WhatsApp chat button to your Blogger blog step by step.

Add WhatsApp Chat Button In Blogger Blog : 

Add WhatsApp Chat Button In Blogger Blog
Follow the steps below :

1. Log In Blogger >> 2. Dashboard >> 3. +add a Gadget >> 4. HTML/JavaScript 

Copy the below code and paste it in HTML/JavaScript content.

<!-- WhatsApp Chat Button START -->

<a href="https://api.whatsapp.com/send?phone=91XXXXXXXXXX&text=Hello%2C%20I%20visited%20your%20blog%20and%20need%20help" class="whatsapp-float" target="_blank" title="Chat on WhatsApp">

  <img src="https://cdn-icons-png.flaticon.com/512/733/733585.png" alt="WhatsApp" style="width: 32px; height: 32px; margin-right: 8px;" />

  Chat with us

</a>

<style>

.whatsapp-float {

  position: fixed;

  bottom: 20px;

  right: 20px;

  background-color: #25D366;

  color: white;

  font-size: 16px;

  padding: 10px 15px;

  border-radius: 50px;

  text-decoration: none;

  box-shadow: 0 4px 12px rgba(0,0,0,0.2);

  z-index: 9999;

  display: flex;

  align-items: center;

  font-weight: bold;

  font-family: Arial, sans-serif;

}

.whatsapp-float:hover {

  background-color: #1ebe5d;

}

</style>

<!-- WhatsApp Chat Button END -->

• Note 1 : Put your mobile number where it is 91xxxxxxxxxxxxxxx. 

• Note 2 :You can also write something else in chat with us.

• Now Save the HTML/JavaScript and also save the layout settings. 

Now refresh your blog and see that the WhatsApp chat button will have been added.