How to Add WhatsApp Floating Button in Blogger
This is important when you have to sell something and don't want to add payment system but you customers/visitors click on round whatsapp floating button and directly contact to you for buying the products.
You can also use it for many other works as you needed. for example if you put this button then visitors directly contact to you through whatsapp and talk about queries/suggestions etc.
Let's do this,
First of all Open Blogger Dashboard >>> Theme >>> Click On Three Dots >>> Edit HTML
Now click inside Edit HTML section and press CTRL + F and find ]]></b:skin>
After that copy below codes and paste above the ]]></b:skin>
.float{
position:fixed;
width:60px;
height:60px;
bottom:40px;
right:40px;
background-color:#25d366;
color:#FFF;
border-radius:50px;
text-align:center;
font-size:30px;
box-shadow: 2px 2px 3px #999;
z-index:100;
}
.my-float{
margin-top:16px;
}
Now again press CTRL + F and find </head>
After that copy below codes and paste above the </head>
After that copy below codes and paste above the </head>
<a href="https://api.whatsapp.com/send?phone=91XXXXXXXXXX" class="float">
<i class="fa fa-whatsapp my-float"></i>
</a>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" />
Here in above code you have do some changes in whatsApp link,
phone=your phone number with country code and without any signs
Thank You
Post a Comment
If You Have Any Problems Regarding To This Information Then Feel Free To Ask Here.