How to add WhatsApp or Facebook Chat Button in Blogger

In this post, I will guide you on adding a chat button in Blogger. So, follow me until the end. Learn more about how to add a chat button to your BlogSpot blog.

Why do you need to add a WhatsApp chat button to your Blogger blog?

You may know why a live chat button is essential for your blog, but unfortunately, if you have yet to hear of it, don’t worry! I am here to help you. These days, WhatsApp is one of the most accessible and popular messaging apps worldwide. Its popularity is almost universal in all countries except China. According to research, WhatsApp will become more popular in the future, and here are the reasons why it provides the easiest way to communicate in different ways. Such as text messages, video calls, voice calls, recorded audio clips, etc.

In the blog, the WhatsApp chat button can help in several ways

• Readers can easily contact you and quickly solve their problems instead of using the Contact Us page.
• It creates a path to stay in touch with your customers.
• It also helps in collecting information such as phone numbers and locations. This means it helps in retargeting your customers.
• It brings traffic and subscribers.
• It helps generate more sales on your blog.

In the technological age, people love an easy way to communicate with others. So, having a WhatsApp chat button, Messenger chat button, or any other social media chat button on your blog is a haven to connect with your customers and help them. This is the best blogger addon.

How to add a Chat button in Blogger

Here we tell you an easy way to add a chat button in Blogger. Just follow these steps to add a WhatsApp chat button in Blogger.

• Now, log in to your Blogger control panel.
• Click on Layout > Click Add Widget.
• Scroll down and select HTML/JavaScript.
• Please paste your code into the content box and save it untitled.

Here are Some Unique Chat Codes

Here you can see some scripts for the chat button in Blogger. Replace all highlight text, Facebook ID, WhatsApp number, etc.

Facebook and WhatsApp Chat Code for Blogger

This is the Facebook and WhatsApp chat button in Blogger.

<!-- GetButton.io widget -->
<script type="text/javascript">
    (function () {
        var options = {
            facebook: "00000000000000", // Facebook page ID
            whatsapp: "03470000000", // WhatsApp number
            call_to_action: "كيف يمكنني مساعدتك", // Call to action
            button_color: "#FF6550", // Color of button
            position: "right", // Position may be 'right' or 'left'
            order: "facebook,whatsapp", // Order of buttons
        };
        var proto = document.location.protocol, host = "getbutton.io", url = proto + "//static." + host;
        var s = document.createElement('script'); s.type = 'text/javascript'; s.async = true; s.src = url + '/widget-send-button/js/init.js';
        s.onload = function () { WhWidgetSendButton.init(host, proto, options); };
        var x = document.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s, x);
    })();
</script>
<style>
.dfBDQI {visibility: hidden;}
</style>
<!-- /GetButton.io widget -->

WhatsApp and Call Button for Blogger

In this script, you can add the call and WhatsApp chat buttons to Blogger.

<!-- GetButton.io widget -->
<script type="text/javascript">
    (function () {
        var options = {
            whatsapp: "03470000000", // WhatsApp number
            call: "034700000", // Call phone number
            call_to_action: "كيف يمكنني مساعدتك", // Call to action
            button_color: "#FF6550", // Color of button
            position: "right", // Position may be 'right' or 'left'
            order: "whatsapp,call", // Order of buttons
        };
        var proto = document.location.protocol, host = "getbutton.io", url = proto + "//static." + host;
        var s = document.createElement('script'); s.type = 'text/javascript'; s.async = true; s.src = url + '/widget-send-button/js/init.js';
        s.onload = function () { WhWidgetSendButton.init(host, proto, options); };
        var x = document.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s, x);
    })();
</script>
<style>
.dfBDQI {visibility: hidden;}
</style>
<!-- /GetButton.io widget -->

Only WhatsApp Chat Button Code for Blogger

If you want to add only the WhatsApp Chat button in Blogger, then use this script.

<!-- GetButton.io widget -->
<script type="text/javascript">
    (function () {
        var options = {
            whatsapp: "03470000000", // WhatsApp number
            call_to_action: "كيف يمكنني مساعدتك", // Call to action
            position: "right", // Position may be 'right' or 'left'
        };
        var proto = document.location.protocol, host = "getbutton.io", url = proto + "//static." + host;
        var s = document.createElement('script'); s.type = 'text/javascript'; s.async = true; s.src = url + '/widget-send-button/js/init.js';
        s.onload = function () { WhWidgetSendButton.init(host, proto, options); };
        var x = document.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s, x);
    })();
</script>
<style>
.dfBDQI {visibility: hidden;}
</style>
<!-- /GetButton.io widget -->

Only Facebook Chat Button for Blogger

In this script, you can add only the Facebook Chat button in Blogger.

<!-- GetButton.io widget -->
<script type="text/javascript">
    (function () {
        var options = {
            facebook: "000000000000000", // Facebook page ID
            call_to_action: "كيف يمكنني مساعدتك", // Call to action
            position: "right", // Position may be 'right' or 'left'
        };
        var proto = document.location.protocol, host = "getbutton.io", url = proto + "//static." + host;
        var s = document.createElement('script'); s.type = 'text/javascript'; s.async = true; s.src = url + '/widget-send-button/js/init.js';
        s.onload = function () { WhWidgetSendButton.init(host, proto, options); };
        var x = document.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s, x);
    })();
</script>
<style>
.dfBDQI {visibility: hidden;}
</style>
<!-- /GetButton.io widget -->