August 13, 2011

Save And Share Blogger Posts Social Bookmarking Widget


Save And Share Blogger Posts Social Bookmarking Widget

1.Log in to your dashboard--> Desing- -> Edit HTML

2.Click on "Expand Widget Templates"

3.Scroll down to where you see ]]></b:skin> tag.

4.Copy below code and paste immediately before it ]]></b:skin>







#bookmarks-footer {
padding: 0px 10px 0px 0px;
text-align: center;
overflow: hidden;
}
#bookmarks-footer a {
text-decoration:underline;
font-size:80%;
}
#bookmarks-footer a:hover {
text-decoration:none;
}
#bookmarks-footer span {
font-size: 27px;
line-height: 48px;
font-weight: bold;
padding-right: 5px;
}
#bookmarks-footer .stumble { background: url(http://i45.tinypic.com/20ua5j4.jpg) center top no-repeat;padding-top: 50px; display: block; width: 48px; float: left;margin-right:10px; }
#bookmarks-footer .digg{ background: url(http://i48.tinypic.com/30ldvmd.jpg) center top no-repeat;padding-top: 50px; display: block; width: 48px; float: left;margin-right:10px; }
#bookmarks-footer .tweet { background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfFwxeJM62B1sOQDmFY1aO7oxYX1pAQnRZlE2u0S9rLadoK7QUxcBhEwZoIPVq7fYxIGlac_labIKipz9hDl0UNwN4Y2iiLa_wWW7LvBsT0awkZv-xpJ7K6BMUOD4ahEw22cKKk8D77u4/) center top no-repeat;padding-top: 50px; display: block; width: 48px; float: left;margin-right:10px; }
#bookmarks-footer .save { background: url(http://i48.tinypic.com/jl3v3q.jpg) center top no-repeat;padding-top: 50px; display: block; width: 48px; float: left;margin-right:10px; }
#bookmarks-footer .reddit { background: url(http://i45.tinypic.com/xgmwdf.jpg) center top no-repeat;padding-top: 50px; display: block; width: 48px; float: left;margin-right:10px; }
#bookmarks-footer .more { background: url(http://i49.tinypic.com/2mxeds8.jpg) center top no-repeat;padding-top: 50px; display: block; width: 48px; float: left; }

5.Now find this code: <data:post.body/> and replace it with the bellow code

<data:post.body/>

<div id='bookmarks-footer'>
<h3>Save and Share!</h3>
<a class='save' expr:href='&quot;http://del.icio.us/post?url=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Share this on del.icio.us'>Save iT</a>
<a class='digg' expr:href='&quot;http://digg.com/submit?phase=2&amp;url=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Digg this!'>Digg this</a>
<a class='stumble' expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Stumble upon something good? Share it on StumbleUpon'>Stumble It</a>
<a class='reddit' expr:href='&quot;http://reddit.com/submit?url=&quot;+ data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='nofollow' title='Share this on Reddit'>Reddit It</a>
<a class='tweet' expr:href='&quot;http://twitter.com/home?status=Reading: &quot; + data:blog.title + &quot; - &quot; + data:post.url + &quot; (@BBW)&quot;' rel='nofollow' title='Tweet This!'>Twitter</a>
<a class='more' href='http://www.addtoany.com/share_save'>More</a>
</div>


6. Click on "Save Template" You are Done.

Cheers.!

No comments:

Post a Comment