Tuesday, 22 January 2013
Add Social Networking Buttons in Blog Sidebar
Do you like this story?
In my previous post, I discussed how to add a floating social media button in a blog. In this post, I will discuss how to add a static social media share buttons on your sidebar directly from the blogger or using codes.
To Add Social Networking Buttons Directly From Blogger
- Go go the Dashboard
- Layout
- Blog Post - Click on Edit
- On Configure Blog Posts
- Scroll down the page
- Click on small box next to Show Share Button
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgc35DsSAaTzwCeRFwF2T0skr9bGWtuADJWZK40FbaCZQW5mFEvCyutnpuDslT9-FLzb1eNrcxiaaqdIPj1lfODKmrM07URKK-VumdqCdVz9anKRauZbD5yuPlA6w23pVYC-bplUBAcOCf6/s320/Social-Networking-Buttons.jpg)
- Click on Save.
You are done. Social network buttons will be displayed below each post.
Adding Social Networking Buttons Using Codes on Sidebar
- Go to Layout
- Add a gadget
- Select HTML/Java Script
- On Configure Script pop up window
- Copy and paste the following code
<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style addthis_32x32_style">
<a class="addthis_button_preferred_1"></a>
<a class="addthis_button_preferred_2"></a>
<a class="addthis_button_preferred_3"></a>
<a class="addthis_button_preferred_4"></a>
<a class="addthis_button_compact"></a>
</div>
<script type="text/javascript" src="
http://s7.addthis.com/js/250/addthis_widget.js#pubid=ra-4fdb16d133fdf909"></script>
<!-- AddThis Button END
-->
The social networking button from the above code will look like this;
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhP9sXIkDXH_XYE3_nrtvlEMTqETkzHuoIo1zZHWDl262EDD7zUZqvMJ1CNggAWzUO4z7BAZxNVhnBwQBJz7oAIyg1XwettHHvnox2BxhmvgusbTCKvRoF3qJOdHZU9-HU78WJFgL7DrG53/s1600/social-media-buttons.jpg)
If you want to show the total number of people who have shared/liked your posts. Use the following code;
<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style ">
<a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>
<a class="addthis_button_tweet"></a>
<a class="addthis_button_pinterest_pinit"></a>
<a class="addthis_counter addthis_pill_style"></a>
</div>
<script type="text/javascript">var addthis_config = {"data_track_addressbar":true};</script>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=ra-504b3a8a674bf05b"></script>
<!-- AddThis Button END -->
<div class="addthis_toolbox addthis_default_style ">
<a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>
<a class="addthis_button_tweet"></a>
<a class="addthis_button_pinterest_pinit"></a>
<a class="addthis_counter addthis_pill_style"></a>
</div>
<script type="text/javascript">var addthis_config = {"data_track_addressbar":true};</script>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=ra-504b3a8a674bf05b"></script>
<!-- AddThis Button END -->
The social networking from the above code will look like this;
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcN7kSkwt71tL6tONdTLvq-fjmNjyp2wIZLa7MPLvcUwze6K26rix2_EN3M5l27nvDM02wfca1iLmjHberaCOt2MwzsduFhFDPHPGWLU-2TVV7iq176g_TUs8qOjIwDqcBHBYz93YVFJ35/s1600/Social-media-button.jpg)
"Dont forget to subscribe,join my site for new Games and softwares Updates,and to leave comments!"
![author](http://3.bp.blogspot.com/_ubwIhqPcR6M/TIb2GsaA-uI/AAAAAAAAA-s/vtz7ruWg4jU/s1600/frank.jpg)
This post was written by: Author Name
Author description goes here. Author description goes here. Follow him on Twitter
Subscribe to:
Post Comments (Atom)
0 Responses to “Add Social Networking Buttons in Blog Sidebar ”
Post a Comment