Memasang Sexy Bookmarks ~ Belajar Blog

Ternyata bukan hanya wanita yang bisa sexy, Bookmarks juga bisa dibuat sexy dan menggairahkan. Entah karena apa disebut Sexy Bookmarks, mungkin karena animasinya naik turun, jika kita arahkan pointer mouse ke Icon Bookmarks maka dengan segera icon tersebut naik keatas, jika mouse dipindahkan maka icon yang lain turun dan yang dituju akan naik. Naik turun inilah yang mungkin namanya menjadi Sexy Bookmark. Sebelum memasang pada blog anda, silahkan lihat hasilnya dulu pada blog Hens Revolution Dark Life.

Jika penasaran dengan si sexy ini, silahkan ikuti petunjuk dibawah ini!

Langkah 1
Login ke Blogger
Langkah 2
Masuk ke "Tata Letak - Edit HTML"
Langkah 3
Checklist "Expand Template Widget"
Langkah 4
Cari kode dibawah ini:

]]></b:skin>

Langkah 5
Masukan (copy paste) kode dibawah ini tepat diatas kode pada langkah 4:

div.sexy-bookmarks{height:54px;background:url(http://i43.tinypic.com/2ueii3t.png) no-repeat left top;position:relative;width:570px}
div.sexy-bookmarks span.sexy-rightside{width:17px;height:54px;background:url(http://i43.tinypic.com/2ueii3t.png) no-repeat right top;position:absolute;right:-17px}
div.sexy-bookmarks ul.socials{position:absolute;bottom:0;left:10px;margin:0!important;padding:0!important}
div.sexy-bookmarks ul.socials li{display:inline-block!important;float:left!important;list-style-type:none!important;height:29px!important;width:48px!important;cursor:pointer!important;margin:0!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://i32.tinypic.com/21ndq48.jpg) 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}

Langkah 6
Cari kode dibawah ini:

<data:post.body/>

Langkah 7
Masukan (copy paste) kode dibawah ini tepat dibawah kode pada langkah 6:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<br/>
<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'/></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'/></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'/></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'/></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'/></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'/></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'/></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'/></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'/></li>
<li class='sexy-syndicate'><a href='http://feeds2.feedburner.com/YOUR-FEEDBURNER-ID' title='Subscribe to RSS'/></li>
<li class='sexy-email'><a expr:href='&quot; mailto:?subject=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'/></li>
</ul>
<span class='sexy-rightside'/></div>
</b:if>

Langkah 8
Simpan template dan preview blog anda

Keterangan :

Jika anda tidak memerlukan bookmark sebanyak itu silahkan hapus kode-kode pada langkah 5 dan langkah 7 untuk menyesuaikan dengan keperluan anda.
Lebih baik simpan gambar dibawah ini dan upload pada webhosting anda, serta ubah arah URL http://i43.tinypic.com/2ueii3t.png dan http://i32.tinypic.com/21ndq48.jpg yang terdapat pada kode CSS (lihat dan cari pada langkah 5)

Selamat mencoba semoga berhasil... Tinggalkan komentar jika mengalami kegagalan. Happy Blogging :)

Belajar Blog

Thursday, August 6, 2009

Memasang Sexy Bookmarks

SITE SEARCH

Popular Posts

Category

Blog Archive