How to add Social Networking Buttons Below Every Post

By adding social networking icons to your blog you will definitely boost your blog's traffic, if done properly. So be careful while placing them. They should be attractive, correctly placed, aligned and also they should be visible separately from the post. Although buttons like AddThis and AddToAny are quite useful, but now they look quite outdated.

So have a look on these buttons: Download buttons from here
Or from here [Free Icons Download]
Or From here [Glossy Buttons]

To show these icons below all your posts and to dynamically synchronize the post's address with each of these buttons, follow these steps:

Go to "Layout" section, then click on "Edit HTML" link.
Then click on "Expand Widget Templates". Now find (CTRL+F) this code:
<data:post.body/>

Then immediately after that code, add these lines:

<!--SOCIAL-BOOKMARKING-ICONS-STARTS-->
<b:if cond='data:blog.pageType == "item"'>
<!--DIGG-->
<a expr:href='&quot; http://digg.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'><img alt='Digg It!' src=' ' /></a>
<!--Stumble-->
<a expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank'><img alt='Stumble' src=' '/></a>
<!--Delicious-->
<a expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank'><img alt='Delicious' src=' '/></a>
<!--Technorati-->
<a expr:href='&quot;http://technorati.com/faves?add=&quot; + data:post.url' rel='external nofollow' target='_blank'><img alt='Technorati' src=' '/></a>
<!--Twitter-->
<a expr:href='&quot;http://twitter.com/home/?status=Chk Out-&quot; + data:post.title + &quot; &quot; + data:post.url' target='_blank'><img alt='Tweet It!' src=' ' width='122'/></a>
<!--Facebook-->
<a expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title' rel='external nofollow' target='_blank'><img alt='Facebook' src=' '/></a></b:if>
<!--SOCIAL-BOOKMARKING-ICONS-STOPS-4-Help-http://bloggerstop.net-->

In the highlighted code (in red color), paste the DIRECT LINKS to the various social networking icons.
The black bolded code hides these icons in your Home-Page and only shows them below your posts.

ProBlogger - Inspiring Others Realize Their Dreams!

Share this

Related Posts

Previous
Next Post »

202 comments

Write comments «Oldest   ‹Older   201 – 202 of 202   Newer›   Newest»
adriana ordoñez
September 08, 2012 12:34 AM delete

Thanks for the information. I was looking for. I'm suprised I never found this site from dropping. I found you on Google. :) Keep up the good work.Thank you for this amazing blog!

Reply
avatar
Anonymous
March 22, 2013 6:15 AM delete

Your listing are progressing with days dungeon it up guys.
social media marketing agency

Reply
avatar
«Oldest   ‹Older   201 – 202 of 202   Newer›   Newest»

Comments are moderated on this blog

Allowed HTML tags: <b>, <i> and <a>

Comment Like This! and Optimize your blog EmoticonEmoticon