Delicious Bookmark Buttons With Counter For Blogger

Delicious Bookmark buttons With Counter For Blogger,you are listening right.Since all the social sites have made the bookmark buttons with counter but delicious has not made till yet.But now we have made it available to our blogger users.And the buttons look very nice too.As we have tried to make the button style to look more beautiful.We have made both the versions of buttons like retweet button.Simple version and compact version.You can use any you like.The button is using both script and css.You not need to know script but if you know css you can style it in any style you want,to adjust to your blog and can use any image for it and any color.Its more flexible to use and works same like retweet counter.

If you dont know about retweet button you can get it here,how add retweet counter button.

*A normal counter button like retweet button

*A Compact version which fits in less space

Installation

Just Login to Blogger Go to (Dashboard → Layout → Edit HTML → Press Ctrl+F)
Now find for ]]> and place the below css before it and hit save template.

.share-delicious{
width:50px;
height:63px;
text-align:center;
}

.delicious{
width:50px;
height: 45px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4PGZSTdUTSE4kopZpCSSGuRwMslcPzInw5FlKW4PXUqW829vYIakVg4ZX_bkkHF2ZbEzentVdxwEKnJP_jHw-fqJJHyPgAmRTdT4eV57iSv03is7pyp02_UU-t3btieRt_hje9Yqwgvs/s1600/del+above.png) no-repeat;
font-weight: bold;
font-size: 16px;
font-family:arial;
color:#adadad;
margin:0 auto;
line-height:36px;
}
.delicious-b{
font-size:10px;
text-transform:none;
color:#FFF;
margin:0 auto;
width:50px;
height:17px;
line-height: 17px;
}
.delicious-b a:link, .delicious-b a:visited{
color:#FFF;
font-weight:normal;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWejXpHXH8068QOJHvKMd8RXsvLqXfVkMmFIwEYWMy7W3Ca9TDUhmeu3iUxhy6_rEeG4xkqlI53m4pqW0KWpFoGTX_DTumFqL9m7aut2LFCT8B9oLjk4KISvBTUvx2iE18C2g9pwGQK_k/s1600/del+new.png) no-repeat;
display: block;
text-decoration:none;
}
.delicious-b a:hover{
color:#11788b;
font-weight:normal;
text-decoration:none;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWejXpHXH8068QOJHvKMd8RXsvLqXfVkMmFIwEYWMy7W3Ca9TDUhmeu3iUxhy6_rEeG4xkqlI53m4pqW0KWpFoGTX_DTumFqL9m7aut2LFCT8B9oLjk4KISvBTUvx2iE18C2g9pwGQK_k/s1600/del+new.png) no-repeat center -17px;
display: block;
}

Now you have to place the code for button to make it work.Just expand widgets templates by check marking it.Now again search for below line.

After Getting this,place the below codes after it to have button after post and before it to have button at begining of post.

0

delicious