-->

Responsive WHATSAPP Share Botton for blogger website post

The best way to promote your website for free is to do social sharing, after Facebook WhatsApp is a great platform for social sharing. If you also want to put WhatsApp share botton  in your blogger website then follow the steps mentioned in this article.


responsive whatsapp share botton for blogger


1   )  Go to your blogger's dashboard .

2   )  Then click on Edit atml

3   )  now press ctrl+F  ,HERE A SMALL search box will open on right corner .

4  )  here you have to search ]]></b:skin>   

5  )  above ]]></b:skin>  paste code biven below .


.tist{background:#35BA47;
color:#fff;
padding:2px 6px;
border-radius:3px;}
a.tist:hover{color:#fff !important;}




(a)  After doing so much work,add one javascript code above  </head> tag .For this  type </head> in search box and copy and paste the code below on it.

<script>

$(document).ready(function() {

$(document).on("click", '.tist', function() {

if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) {

var text = $(this).attr("data-text");

var url = $(this).attr("data-href");

var message = encodeURIComponent(text) + " - " + encodeURIComponent(url);

var whatsapp_url = "whatsapp://send?text=" + message;

window.location.href = whatsapp_url;}

else {alert("If you want to share on WhatsApp, Then please use Mobile Device");}});

});

</script>

After applying the JavaScript code, the last step that is given is to place the code given below where you want to show the Whatsapp button. Two places are good and responsive to apply Whatsapp button, one is in the last of the post and the other with default share bottons. You can put the WhatsApp button anywhere you like, for that you have to apply the code given below as mention.


1 )  copy this code

          <a class='tist' expr:data-href='data:post.url' expr:data-text='data:post.title' href='#' > <i class="fa fa-whatsapp"/>  WhatsApp share</a>


2 )    paste after this code <data:post.body/>  This code can be in your website 2 or 3 times, you have to put theafter  third code <data:post.body/>.And then save the template. BS has added a responsive Whatsapp share button to your blogger website.

If you find any difficulty in applying Whatsapp button, you can take help by commenting. Or by clicking on this link, you can also learn to install Whatsapp share button by watching this video.












EmoticonEmoticon