Tombol Share Social Bookmark Tanpa Javascript Untuk Blogger

Trik sederhana untuk mendapatkan trafik pengunjung ke blog adalah dengan memanfaatkan sosial bookmark dan direktori web yang ada. Sekarang, untuk menerapkan trik ini, anda hanya perlu memasang tombol social bookmark tanpa menggunakan javascript pada setiap artikel yang telah anda terbitkan.

Tombol Share Sosial Bookmark Tanpa Javascript

Bagaimana Cara Menambahkan Kedalam Blogger ?

  • Login ke blogger kemudian pilih salah satu blog yang akan Anda pasangi tombol sosial bookmark
  • Pilih, Template » Edit HTML » Centang "Expand Template Widget"
  • Copy kode dibawah ini dan pastekan tepat diatas tag ]]></b:skin>
.fbshare {line-height: 20px; color: #fff !important; background: #3b5998; text-decoration: none !important; border: 1px solid #313c7d; padding: 3px;  font-family: Tahoma, verdana, sans-serif; font-size: 12px; border-radius: 2px;}
.twshare {color: #fff !important; background: #4099FF; text-decoration: none !important; border: 1px solid #3a8be8; padding: 3px;  font-family: Tahoma, verdana, sans-serif; font-size: 12px; line-height: 20px; border-radius: 2px;}
.plshare {color: #fff !important; background: #c0361a; text-decoration: none !important; border: 1px solid #9c2c15; padding: 3px; font-family: Tahoma, verdana, sans-serif; font-size: 12px; line-height: 20px; border-radius: 2px;}
.dgshare {color: #fff !important; background: #5b88af; text-decoration: none !important; border: 1px solid #4a6f8f; padding: 3px; font-family: Tahoma, verdana, sans-serif; font-size: 12px; line-height: 20px; border-radius: 2px;}
.lkshare {color: #fff !important; background: #005a87; text-decoration: none !important; border: 1px solid #003f5e; padding: 3px; font-family: Tahoma, verdana, sans-serif; font-size: 12px; line-height: 20px; border-radius: 2px;}
.tcshare {color: #fff !important; background: #157501; text-decoration: none !important; border: 1px solid #105901; padding: 3px; font-family: Tahoma, verdana, sans-serif; font-size: 12px; line-height: 20px; border-radius: 2px;}
.sharebutton {background: #cccccc;border: 1px solid #999;padding: 5px;}
  • Jangan simpan template dulu, tapi lanjutkan dengan mencari tag <data:post.body/> dan jika sudah ketemu, copy kode dibawah ini tepat di bawah tag <data:post.body/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='sharebutton'>
Share This Article To:
<a class='fbshare' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url' rel='nofollow' target='_blank'>Facebook</a>
<a class='twshare' expr:href='&quot;http://twitter.com/share?url=&quot; + data:post.url' rel='nofollow' target='_blank'>Twitter</a>
<a class='plshare' expr:href='&quot;https://plus.google.com/share?url=&quot; + data:post.url' rel='nofollow' target='_blank'>Google+</a>
<a class='lkshare' expr:href='&quot;http://www.linkedin.com/cws/share?url=&quot; + data:post.url' rel='nofollow' target='_blank'>Linkedin</a>
<a class='tcshare' expr:href='&quot;http://technorati.com/faves?sub=addfavbtn&amp;add=&quot; + data:post.url' rel='nofollow' target='_blank'>Technorati</a>
<a class='dgshare' expr:href='&quot;http://digg.com/submit?url=&quot; + data:post.url' rel='nofollow' target='_blank'>Digg</a>
</div>
</b:if>
Perhatikan !
Jika di dalam template terdapat banyak <data:post.body/>, maka cari kode HTML yang kurang lebih seperti dibawah ini dan pastekan kode di atas tepat di bawahnya.
<b:if cond='data:blog.pageType == &quot;item&quot;'>
    <data:post.body/>
<b:else/>
    <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
        <data:post.body/>
    </b:if>
</b:if>
      <div style='clear: both;'/> <!-- clear for photos floats -->
    </div>
  • Sekarang simpan template dan lihat hasilnya.
Terima kasih dan semoga bermanfaat...!!!

Unknown
Unknown

3 comments:
Write comment
  1. hee,,,tanpa js tp menggunakan css,,,,ok kawan,nice share

    ReplyDelete
  2. masih kurang mengerti...
    maklum saya newbie.. :)

    ReplyDelete
  3. AnonymousJuly 05, 2013

    Thanks ya Kang info yang bermanfaat :)

    ReplyDelete