Cara bikin Sharing this ~ ©siapa kira∙com

Membuat Sharing Button Di Blogger. Salah satu meningkatkan SEO adalah membuat artikel itu menjadi populer. Nah Bagaimana agar artikel bisa menjadi populer ? salah satu cara yang bisa di lakukan agar artikel menjadi populer adalah dengan mengirim artikel ke situs-situs Bookmark, seperti Digg, Technorati, Facebook, Twitthis, del.icio.us, dan lain-lain.

Tapi sekarang saya ingin memberikan tips atau sharing tips tentang Membuat Sharing Button Di Blogger. Disini telah menjadi satu paket bookmark, sehingga button-button tersebut sudah termasuk situs-situs yang sudah saya sebutkan diatas.

Buat sobat pengguna Blogger.com berikut ini adalah step-step membuat sharing button yang harus sobat lakukan :
1. Login di akun blogger sobat.
2. Edit HTML - Centang Expand Template.
3. Copy Paste kode dibawah tepat sebelum tag </Head>

<style type ='text/css'>
div.beauty-bookmarks
    {
    height: 54px; left bottom;
    position: relative;
    width: 540px;
}

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

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

div.beauty-bookmarks            ul.socials li {
    display: inline-block !important;
    float: left !important; .
    beauty-furl ,.beauty-furl: hover, . beauty-digg, . beauty-digg : hover,
        . beauty-reddit, . beauty-reddit : hover, . beauty-stumble, .
        beauty-stumble : hover, . beauty-delicious, . beauty-delicious : hover,
        . beauty-yahoo, . beauty-yahoo : hover, . beauty-blinklist, .
        beauty-blinklist : hover, . beauty-technorati, . beauty-technorati :
        hover, . beauty-facebook, . beauty-facebook : hover, . beauty-twitter,
        . beauty-twitter : hover, . beauty-myspace, . beauty-myspace : hover,
        . beauty-mixx, . beauty-mixx : hover, . beauty-script-style, .
        beauty-script-style : hover, . beauty-designfloat, .
        beauty-designfloat : hover, . beauty-syndicate, . beauty-syndicate :
        hover, . beauty-email, . beauty-email : hover list-style-type :   none
        !important;
    margin: 0 !important;
    height: 29px !important;
    width: 48px !important;
    cursor: pointer !important;
    padding: 0 !important;
}

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

{
background:url('http://i44.tinypic.com/1znbj83.png') no-repeat !important;
}
.beauty-furl {
    background-position: -300px top !important;
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

.beauty-email:hover {
    background-position: -753px bottom !important;
}
</style>

4. Langkah selanjutnya, cari kode <post.body/> . Jika ada 2 kode, fokuskan pada kode yang ke-2.
5. Copy paste kode dibawah ini tepat dibawah tag <post.body/> .

<b:if cond='data:blog.pageType == "item"'>
    <div class='beauty-bookmarks'>
    <ul class='socials'>
        <li class='beauty-delicious'><a
            expr:href='"http://del.icio.us/post?url=" + data:post.url + "&title=" + data:post.title'
            target='_blank' /></li>
        <li class='beauty-digg'><a
            expr:href='" http://digg.com/submit?url=" + data:post.url + "&title=" + data:post.title'
            target='_blank' /></li>
        <li class='beauty-technorati'><a
            expr:href='" http://technorati.com/faves?add=" + data:post.url + "&title=" + data:post.title'
            target='_blank' /></li>
        <li class='beauty-reddit'><a
            expr:href='" http://www.reddit.com/submit?url=" + data:post.url + "&title=" + data:post.title'
            target='_blank' /></li>
        <li class='beauty-stumble'><a
            expr:href='" http://www.stumbleupon.com/submit?url=" + data:post.url + "&title=" + data:post.title'
            target='_blank' /></li>
        <li class='beauty-designfloat'><a
            expr:href='"http://www.designfloat.com/submit.php?url=" + data:post.url + "&title=" + data:post.title'
            target='_blank' /></li>
        <li class='beauty-facebook'><a
            expr:href='" http://www.facebook.com/sharer.php?u=" + data:post.url + "&title=" + data:post.title'
            target='_blank' /></li>
        <li class='beauty-twitter'><a
            expr:href='" http://twitthis.com/twit?url=" + data:post.url + "&title=" + data:post.title'
            target='_blank' /></li>
        <li class='beauty-furl'><a
            expr:href='" http://www.furl.net/storeIt.jsp?u=" + data:post.url + "&title=" + data:post.title'
            target='_blank' /></li>
        <li class='beauty-syndicate'><a href='YOURFEEDURLHERE'
            title='Subscribe to RSS' /></li>
        <li class='beauty-email'><a
            expr:href='" mailto:?subject=" + data:post.url + "&title=" + data:post.title'
            target='_blank' /></li>
    </ul>
    <span class='beauty-rightside' /></div>
</b:if>

Catatan : Jangan lupa sobat ganti tulisan berwarna merah diatas dengan URL Feeds blog sobat.
6. Simpan Template sobat. Selesai.

klik ini lbh lengkap

Posted in:

Senin, 01 November 2010