Skip to main content

Add Sexy Social Bookmarks to Blogger

You must have heard or seen the famous Sexy Bookmarks. It's an auto-hiding social bookmarking icons set.



If you want to add Sexy Bookmarking icons in your Blogger template, for you, here is a simple tutorial on how to do it.



Sexy Bookmarks for Blogger



1. To add Sexy Bookmarking icons, go to Layout>Edit and backup your template. Tick the ‘Expand Widget Template’.



2.Find </head> and place the bellow codes before it:

<style type='text/css'>

div.sexy-bookmarks { height:54px; background:url('http://i43.tinypic.com/2ueii3t.png') no-repeat left bottom; position:relative; width:540px; }

div.sexy-bookmarks span.sexy-rightside { width:17px; height:54px; background:url('http://i43.tinypic.com/2ueii3t.png') no-repeat right bottom; position:absolute; right:-17px; }

div.sexy-bookmarks ul.socials { margin:0 !important; padding:0 !important; position:absolute; bottom:0; left:10px; }

div.sexy-bookmarks ul.socials li { display:inline-block !important; float:left !important; list-style-type:none !important; margin:0 !important; height:29px !important; width:48px !important; cursor:pointer !important; padding:0 !important; }

div.sexy-bookmarks ul.socials a { display:block !important; width:48px !important; height:29px !important; font-size:0 !important; color:transparent !important; }

.sexy-furl, .sexy-furl:hover, .sexy-digg, .sexy-digg:hover, .sexy-reddit, .sexy-reddit:hover, .sexy-stumble, .sexy-stumble:hover, .sexy-delicious, .sexy-delicious:hover, .sexy-yahoo, .sexy-yahoo:hover, .sexy-blinklist, .sexy-blinklist:hover, .sexy-technorati, .sexy-technorati:hover, .sexy-facebook, .sexy-facebook:hover, .sexy-twitter, .sexy-twitter:hover, .sexy-myspace, .sexy-myspace:hover, .sexy-mixx, .sexy-mixx:hover, .sexy-script-style, .sexy-script-style:hover, .sexy-designfloat, .sexy-designfloat:hover, .sexy-syndicate, .sexy-syndicate:hover, .sexy-email, .sexy-email:hover { background:url('http://i44.tinypic.com/1znbj83.png') no-repeat !important; }

.sexy-furl { background-position:-300px top !important; }

.sexy-furl:hover { background-position:-300px bottom !important; }

.sexy-digg { background-position:-500px top !important; }

.sexy-digg:hover { background-position:-500px bottom !important; }

.sexy-reddit { background-position:-100px top !important; }

.sexy-reddit:hover { background-position:-100px bottom !important; }

.sexy-stumble { background-position:-50px top !important; }

.sexy-stumble:hover { background-position:-50px bottom !important; }

.sexy-delicious { background-position:left top !important; }

.sexy-delicious:hover { background-position:left bottom !important; }

.sexy-yahoo { background-position:-650px top !important; }

.sexy-yahoo:hover { background-position:-650px bottom !important; }

.sexy-blinklist { background-position:-600px top !important; }

.sexy-blinklist:hover { background-position:-600px bottom !important; }

.sexy-technorati { background-position:-700px top !important; }

.sexy-technorati:hover { background-position:-700px bottom !important; }

.sexy-myspace { background-position:-200px top !important; }

.sexy-myspace:hover { background-position:-200px bottom !important; }

.sexy-twitter { background-position:-350px top !important; }

.sexy-twitter:hover { background-position:-350px bottom !important; }

.sexy-facebook { background-position:-450px top !important; }

.sexy-facebook:hover { background-position:-450px bottom !important; }

.sexy-mixx { background-position:-250px top !important; }

.sexy-mixx:hover { background-position:-250px bottom !important; }

.sexy-script-style { background-position:-400px top !important; }

.sexy-script-style:hover { background-position:-400px bottom !important; }

.sexy-designfloat { background-position:-550px top !important; }

.sexy-designfloat:hover { background-position:-550px bottom !important; }

.sexy-syndicate { background-position:-150px top !important; }

.sexy-syndicate:hover { background-position:-150px bottom !important; }

.sexy-email { background-position:-753px top !important; }

.sexy-email:hover { background-position:-753px bottom !important; }

</style>


3.Now Put the below code after <data:post.body/>

<div class='sexy-bookmarks'><ul class='socials'><li class='sexy-delicious'><a expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Add to Delicious' rel='nofollow'/></li>

<li class='sexy-digg'><a expr:href='&quot; http://digg.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Digg This Post' rel='nofollow'/></li>

<li class='sexy-technorati'><a expr:href='&quot; http://technorati.com/faves?add=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Add to Technorati' rel='nofollow'/></li>

<li class='sexy-reddit'><a expr:href='&quot; http://www.reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Add to Reddit' rel='nofollow'/></li>

<li class='sexy-stumble'><a expr:href='&quot; http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Stumble This Post' rel='nofollow'/></li>

<li class='sexy-designfloat'><a expr:href='&quot;http://www.designfloat.com/submit.php?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Share on DesignFloat' rel='nofollow'/></li>

<li class='sexy-facebook'><a expr:href='&quot; http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Share on Facebook' rel='nofollow'/></li>

<li class='sexy-twitter'><a expr:href='&quot; http://twitthis.com/twit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Share on Twitter' rel='nofollow'/></li>

<li class='sexy-furl'><a expr:href='&quot; http://www.furl.net/storeIt.jsp?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Share on Furl' rel='nofollow'/></li>

<li class='sexy-syndicate'><a href='http://feeds.feedburner.com/Om-SimpleBloggerTutorials' title='Subscribe to RSS' rel='nofollow'/></li>

<li class='sexy-email'><a expr:href='&quot; mailto:?subject=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Share on Email' rel='nofollow'/></li>

</ul><span class='sexy-rightside'/></div>

Change the bold blinking feed address to yours.



5. Save your template and view your blog. That's it. You are ready to use the Sexy Bookmarking icons for your blog.

Comments

Sohail said…
You need to check your blog! We cannot even select the code let alone copy it... how are we going to use the code? this is ridiculous..
August 21, 2010 at 11:40 PM
Post a Comment

Popular posts from this blog

SEO Optimizing A Website For Improved Value

SEO or search engine optimization is something that every web owner and creator should be aware of. Even if a website owner hires an expert to carry out the online marketing, understanding the very basics and how it really can improve a websites performance and popularity is important. Simply put, optimizing a website is important and is built around keywords that are valuable to a website and to the products or services it is trying to provide. By focusing on main keywords or key phrases for a business, and expanding on them over time, can improve the amount of visitors a website receives, in turn increasing profits or simply improving its popularity if it is an information website. SEO is valuable, and means a way of making a site appear at a higher ranking in search engines such as Google, Yahoo, AOL etc. Using this important type of online marketing can reap great benefits. It takes time to learn and time to complete, and is a constant job to keep a website performing well above co...
Post a Comment
Read more

Email On Deck: A disposable email address that works

Today, Team Inforpioneer brings an interesting Email service for our reader which will definitely help our readers to improve their internet security and will benefit in some other ways.  Here is a short description of this service.  EmailOnDeck.com is the premier site for all things relating to temporary, disposable and throwaway email addresses. We want to help you avoid SPAM, protect your online privacy, and stop you from having to give away your personal email address to every company and person on the internet who insists on you giving it to them. We work hard and will continue to work hard to give you a disposable email address that works with any site or app. We hope to help give you back the control of deciding who you want to give your personal info to. Temporary emails are perfect for any transaction where you want to improve your online privacy. Use them when you buy or sell Bitcoins or trade cryptocurrency, at exchanges, or locally. They can be used for QA tes...
1 comment
Read more

Cheap & Easy To Use VPN Services in China for 2019

Because of copyright issues, many domestic video sites prohibit foreign direct access to foreign IPs. Overseas users want to see these videos from abroad and need to obtain domestic IP with VPNs to bypass these copyright restrictions. Wall mom brings the best solutions for your VPN Services which are not only the best in the area but also have cheap and affordable prices. In this article,  Wall mom  brings some cheap and easy to use over the wall VPN recommendations for their users with the reviews which will surely help those who want a access to the sites which has the copyright restrictions.  They wrote in this articles that Only recommend foreign VPN, do not recommend domestic VPN Dare to operate in the domestic VPN service, the policy risk is particularly large, almost all shut down or run, it is difficult to issue a refund. Before GreenVPN was shut down, a large number of users flocked for a refund, and the refund was still good. Many domestic VPNs...
5 comments
Read more