How to add all social Bookmarking icons at the end of the blog

Hi friends ,i would like to explain the procedure of adding social bookmarking icons at the end of the posts in blog.here we are adding only 4 four important socail icons remaining will be added in the list

Just follow the steps

step1)click on the Design tab

Step2)click on the edit html tab

step3)first take the backup of your code before adding the button ,for back up click on the download full template button

step4) click on the Expan widgets check box

step5)click ctrl+f and enter <div class='post-footer'>

step6)just enter this code  after this line

<div class='social-links'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='fl'>If you like this article, please sharing it!</div>

<div class='fr'>
<a expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Bookmark at Delicious'><img alt='Icon' src='http://lh3.ggpht.com/_4_wf1DKMvX4/TMWtaDNdeLI/AAAAAAAABnQ/lXE_PBJ0jvs/ico-soc1.gif'/></a> 


<a expr:href='&quot;http://www.mixx.com/submit?page_url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Bookmark at Mixx'><img alt='Icon' src='http://lh3.ggpht.com/_4_wf1DKMvX4/TMWtajQHeKI/AAAAAAAABnY/mTcuJkKrXR4/ico-soc2.gif'/></a> 

<a expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Bookmark at StumbleUpon'><img alt='' src='http://lh6.ggpht.com/_4_wf1DKMvX4/TMWta08BilI/AAAAAAAABnc/KA2JKyrfQTA/ico-soc3.gif'/></a> 

<a expr:href='&quot;http://digg.com/submit?phase=2&amp;url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' target='_blank' title='Bookmark at Digg'><img alt='Icon' src='http://lh3.ggpht.com/_4_wf1DKMvX4/TMWtbAh1VeI/AAAAAAAABng/EuDEkRfHYnk/ico-soc4.gif'/></a> 
<a expr:href='&quot;http://dotnetshoutout.com/Submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' expr:id='data:widget.instanceId + &quot;_kickit&quot;' rel='nofollow' rev='vote-for'><img border='0' height='16' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhj-hymGYN7DUAxK8z25p6vjsUHY9eAvXDlrs8xoBI6eLzmGFYi3Lcn_ydvUGVzgM_CQIXDzxxfNYxzk1d5nN1Dg5_kS_Y1KT9uA3iAAbKWq2NtJu4BExqQuu4iOoN4VRkoyxFxxhgOOw/s320/dotnetshoutout.png' width='16'/></a>
<!-- AddToAny BEGIN -->
<a class='a2a_dd' href='http://www.addtoany.com/share_save'><img alt='Share/Bookmark' border='0' height='16' src='http://static.addtoany.com/buttons/share_save_171_16.png' width='171'/></a>
<p class='a2a_linkname_escape' style='display:none'><data:post.title/></p><script type='text/javascript'>var a2a_config = a2a_config || {};a2a_config.linkname_escape=1;a2a_config.linkurl=&quot;<data:post.url/>&quot;;</script><script src='http://static.addtoany.com/menu/page.js' type='text/javascript'/>
<!-- AddToAny END -->
</div>

step7)click on the ctrl+f and search for </head> and copy the following code before this line

/*- Social Links -*/
.social-links {
    background: url(http://lh5.ggpht.com/_4_wf1DKMvX4/TMWjWMQf2jI/AAAAAAAABmo/PGIYUdITVwU/box-bgr2.gif) #f1f1f1 repeat-x top;
    height: 42px;
    padding: 0 18px;
}
.social-links .fl {
    line-height: 42px;
}
.social-links .fl span {
    background: url(http://lh5.ggpht.com/_4_wf1DKMvX4/TMWm5e4uSUI/AAAAAAAABm4/HH-GXMtZcVA/comment_count_bg.gif) no-repeat center left;
    font-weight: bold;
    font-size: 14px;
    text-align: center;
    padding: 4px 0 8px 0;
    width: 33px;
    margin-right: 6px;
    display: inline-block;
    line-height: 32px;
}
.social-links .fr {
    padding: 9px 0 0;
}
.social-links .fr span {
    line-height: 21px;
}
.social-links img {
    margin: 0 0 0 2px;
}

step7)finally click on save template

That's it...this button will appear at the end of post in blogger

About the Author

Asha is an Engineering student at JNTU university from India.She loves to blog about SEO, Blogging Tricks, Software and anything related to Technology.

Reach Her :

Google+

Facebook

Twitter

Pinterest