• Natlie Imbruglia

    Doesn`t she look very cool?

  • Thousands of Years

    Earth has lived thousands of years...

  • Fruits

    Fruits are vital for health and their nutrients...

  • The Lonely Road

    The Lonely Road reminds Me with You...

  • Twister

    Here are some twisting graphics for you...

Friday, November 27, 2009

Memasang Social Bookmark ( sharing is sexy! ) di bawah post.


Social Bookmark  dibina untuk pengguna internet untuk menyimpan, menyusun, mencari dan mengawal bookmark di internet dengan bantuan metadata. Ramai pembangun web social bookmark menggunakan alamat feed untuk mengklafikasikan bookmark, termasuk yang telah disusun dengan tag.

Untuk memasang Social Bookmark (sharing is sexy!) seperti yang boleh anda lihat di sini,sila ikut beberapa langkah yang ditunjukkan dibawah.

p/s:
1. Social bookmark ini hanya sesuai untuk template yang lebar bahagian postingnya 400px ke atas sahaja.
2.Save dahulu script template sebagai backup.


Langkah 1

Log in blog => Dashboard => Layout => Edit HTML. Seterusnya tick pada kotak Expand Widget Templates.


Langkah 2

Dengan menggunakan keyboard, tekan Ctrl+F. Seterusnya, taipkan atau salin kod ]]></b:skin> pada ruang Find dan tekan Enter.


Langkah 3

Salin kod berwarna biru di bawah dan paste di bawah atau selepas kod ]]></b:skin>

<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>

Langkah 4

Salin atau taipkan kod <data:post.body/> pada ruang Find dan tekan Enter.


Langkah 5

Salin kod berwarna merah di bawah dan paste di bawah atau selepas kod <data:post.body/> . Edit teks YOUR-FEEDBURNER-ID yang di bold kepada ID Feedburner anda.

<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>

Akhir sekali, klik preview dan jika tiada mesej Error yang terpapar, klik saja Save.
Posted by at
Labels:

12 comments:

  1. fiDNovember 27, 2009 at 7:16 AM

    tq bro. m camne nak wat yg orang view plak? heee

    ReplyDelete
  2. Nescafe aisNovember 27, 2009 at 7:34 AM

    @fiD

    Yang orang view? Yang mana tu.

    ReplyDelete
  3. RedzaLizaNovember 27, 2009 at 8:43 AM

    MAK AIIIIIIII.... pjgnya tutorial ni. uhukkk.... cik jah kena baca slow2 ni.
    nak wat kena r pakai blog lain ni.
    cik jah testing2 dulu. x dpt. hehehehe.... cikgu nes.... siapkan jawapan byk2 erk. manalah dpt pic tu. ahaksss

    p/s:
    1. Social bookmark ini hanya sesuai untuk template yang lebar bahagian postingnya 400px ke atas sahaja.

    cikgu nes... klu kita nak pastikan lebar template kite nak tekan ctrl+f (hehehe...nak taip pe)

    ReplyDelete
  4. Nescafe aisNovember 27, 2009 at 9:13 AM

    @RedzaLiza

    Biasanya kod #main-wrapper {

    ReplyDelete
  5. Along25November 27, 2009 at 5:51 PM

    ID FEEDBURNER tu ape?

    ReplyDelete
  6. Nescafe aisNovember 27, 2009 at 11:10 PM

    @Along25

    Feedburner tu lebih kurang macam RSS Feed blogspot.

    ReplyDelete
  7. FyzalNovember 29, 2009 at 12:16 AM

    bagus ni. tapi aku tak sure.. blog aku bleh letak ke kat posting area tu.

    ReplyDelete
  8. Nescafe aisNovember 29, 2009 at 12:36 AM

    @Fyzal

    ~Muat gua rasa. Lebar postnya besar jugak tu.Gua dah check. width main-wrapper nya 582px

    ReplyDelete
  9. mIsTa aLeHDecember 22, 2009 at 9:36 PM

    bro cmne nk wat ID FEEDBURNER??

    ReplyDelete
  10. Nescafe aisDecember 22, 2009 at 9:54 PM

    @mIsTa aLeH

    Daftar sini www.feedburner.com

    ReplyDelete
  11. DaHLiaFebruary 5, 2010 at 5:16 AM

    erk...xberjaya pun bro?? huhuh

    ke kena register FEED BURNER dulu?

    ReplyDelete
  12. Fathurrahman b. AliasFebruary 28, 2010 at 10:08 PM

    knp saye buat x jadi ape ape pun

    ReplyDelete

Subscribe to: Post Comments (Atom)