Want To Be A Blogger  →  Start A Blog  →  Increase Traffic  →  Make Money Online  →  Recommended Things

Add Social Media Buttons To Your Website Or Blog.

Thursday, Sep 28, 2017

Tags:- Social Media


Social Media is very important source to attract many visitors and gain popularity across many social networking sites so it is better to add social media buttons to your website that keeps the user to instantly share and like your content with ease.In this tutorial we will tell you how to add some Social Networking Sites Share or Like Buttons to your website or in your blog.

Social Media Buttons


facebook Like and Share Button:-

Insert this Script and HTML code anywhere you wanted in your webpage

<div id="fb-root"></div>
<script>(function(d, s, id)
{
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v2.0";
  fjs.parentNode.insertBefore(js, fjs);
}
(document, 'script', 'facebook-jssdk'));
</script>

<div class="fb-like" data-href="URL of Your Webpage" data-layout="button_count" data-action="like" data-show-faces="false" data-share="true"></div>

To know more visit their official page



Twitter Tweet Button:-

Insert this Script and HTML code anywhere you wanted in your webpage

<script>
window.twttr=(function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return;js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);t._e=[];t.ready=function(f){t._e.push(f);};return t;}(document,"script","twitter-wjs"));
</script>

<a class="twitter-share-button"
  href="https://twitter.com/share"
  data-url="URL of your webpage">
</a>

To know more visit their official page



Google Plus Share Button:-

Insert this Script and HTML code anywhere you wanted in your webpage

<script src="https://apis.google.com/js/platform.js" async defer></script>

<div class="g-plus" data-action="share" data-annotation="bubble" data-href="URL of your Webpage"></div>

To know more visit their official page



LinkedIn Share Button:-

Insert this Script and HTML code anywhere you wanted in your webpage

<script src="//platform.linkedin.com/in.js" type="text/javascript"> lang: en_US</script>
<script type="IN/Share" data-url="URL of your Webpage" data-counter="right"></script>

To know more visit their official page



StumbleUpon Share Button:-

Insert this Script and HTML code anywhere you wanted in your webpage

<script type="text/javascript">
  (function() {
    var li = document.createElement('script'); li.type = 'text/javascript'; li.async = true;
    li.src = ('https:' == document.location.protocol ? 'https:' : 'http:') + '//platform.stumbleupon.com/1/widgets.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(li, s);
  })();
</script>

<su:badge layout="1"></su:badge>

To know more visit their official page


Thats all, how to add Social Media Buttons to your website and blog.You can customize this code further as per your requirement. And please feel free to give comments on this tutorial.

Subscribe Our Newsletter And Get Tutorials And Offers Via Email

About Me


Hello, My Name is Mudit Jain. I am a Web Developer, Professional Blogger and Digital Marketer from India. I am the founder of TalkersCode. I started this blog in february 2015 to help web developers & bloggers by providing easy and best tutorials, articles and offers for web developers and bloggers.