Thursday 30 April 2015

How to add Social media buttons to blogger blog

Your blog can reach  million people through social media like Face book, twitter, Linkedin etc. Displaying  social media buttons is most common now a days for websites and blogs. Site visitors find these buttons handy to share  interesting useful stuff with their friends.Your blog post can reach a big crowd on click of these magical  buttons. Blog spot doesn't have a widget for social media buttons to be displayed on side bar, header  but there is always a solution at blogger mason. These attractive buttons can fetch lots of organic traffic to your blog and you can see considerable increase in site visitors instantly .  This tutorial explains how to add social media buttons as you can see on the right in simple steps.

You need to add a HTML code to your blog through Html/Java 


 Adding Social Bookmark Buttons to Sidebar or Footer

1. Login to Blogger if not already logged in

2. Navigate to Page Layout

3. Click on Add Gadget in Sidebar or Footer

4. Select HTML/Javascript gadget from the list of available gadgets

5. Copy and paste the code below into Note pad and   
    replace the text www.bloggermason.blogspot.in with your blog address.

6. Replace the title of the blog with title of your choice

7. Click save

<!-- I got this stuff from Bloggermason.blogspot.in -->
<div id="share-buttons">

<!-- Facebook -->
<a href="http://www.facebook.com/sharer.php?u=http://www.Bloggermason.blogspot.in" target="_blank"><img src="http://www.simplesharebuttons.com/images/somacro/facebook.png" alt="Facebook" /></a>

<!-- Twitter -->
<a href="http://twitter.com/share?url=http://www.Bloggermason.blogspot.in&text=Blogging tips &hashtags=Blogging tips" target="_blank"><img src="http://www.simplesharebuttons.com/images/somacro/twitter.png" alt="Twitter" /></a>

<!-- Google+ -->
<a href="https://plus.google.com/share?url=http://www.Bloggermason.blogspot.in" target="_blank"><img src="http://www.simplesharebuttons.com/images/somacro/google.png" alt="Google" /></a>

<!-- Digg -->
<a href="http://www.digg.com/submit?url=http://www.Bloggermason.blogspot.in" target="_blank"><img src="http://www.simplesharebuttons.com/images/somacro/diggit.png" alt="Digg" /></a>

<!-- Reddit -->
<a href="http://reddit.com/submit?url=http://www.Bloggermason.blogspot.in&title=Blogging tips " target="_blank"><img src="http://www.simplesharebuttons.com/images/somacro/reddit.png" alt="Reddit" /></a>

<!-- LinkedIn -->
<a href="http://www.linkedin.com/shareArticle?mini=true&url=http://www.Bloggermason.blogspot.in" target="_blank"><img src="http://www.simplesharebuttons.com/images/somacro/linkedin.png" alt="LinkedIn" /></a>

<!-- Pinterest -->
<a href="javascript:void((function()%7Bvar%20e=document.createElement('script');e.setAttribute('type','text/javascript');e.setAttribute('charset','UTF-8');e.setAttribute('src','http://assets.pinterest.com/js/pinmarklet.js?r='+Math.random()*99999999);document.body.appendChild(e)%7D)());"><img src="http://www.simplesharebuttons.com/images/somacro/pinterest.png" alt="Pinterest" /></a>

<!-- StumbleUpon-->
<a href="http://www.stumbleupon.com/submit?url=http://www.Bloggermason.blogspot.in&title=Blogging tips" target="_blank"><img src="http://www.simplesharebuttons.com/images/somacro/stumbleupon.png" alt="StumbleUpon" /></a>

<!-- Email -->
<a href="mailto:?Subject=Simple Share Buttons&Body=I%20saw%20this%20and%20thought%20of%20you!%20 http://www.Bloggermason.blogspot.in"><img src="http://www.simplesharebuttons.com/images/somacro/email.png" alt="Email" /></a>

</div>



7. Check the buttons on your blog once if they are working properly.


8. Drag the social media widget to header section, footer or side bar as you 
    like.



Last but not the least do not forget to share this post on social media. 

No comments:

Post a Comment