Selasa, 17 April 2012

Cara Membuat Tombol Share Fb, Buzz, Digg, Twitter Di Blogspot

Bagaimana cara membuat tombol share seperti ini :

Membuat Tombol Share
Anda tertarik untuk mencobanya? baiklah kali ini saya akan bagikan salah satu rahasia saya hehe, berhubung ada yang bertanya kepada saya tentang ini,
 seperti yang kita tau tombol share ini merupakan elemen yang sangat penting, sebab dapat mendatangkan pengunjung yang banyak dari luar. ga percaya? coba tengok aja blog terselubung. :D
Share atu berbagi saat ini merupakan hal yang penting karena itulah anda wajib memasang tombol share di blog atau web saudara ::)

Langkah 1
1.  Langsung saja silakan copy kodenya terlebih dahulu:
Kodenya Gan
<b:if cond='data:blog.pageType == &quot;item&quot;'> <div style='border-top:1px solid #ccc;border-bottom:1px solid #ccc; padding:8px 0px;margin:4px 0px 30px 0px;width:100%;float:left;height:20px;'> <div style='float:left;padding-left:0px;font:normal 12px Georgia;font-style:Italic;'> Share this history on : </div> <div style='float:left;padding-left:10px;'> <a name='fb_share' type='button_count'/> <script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'> </script></div> <div style='float:left;padding-left:10px;'> <a class='google-buzz-button' data-button-style='small-count' href='http://www.google.com/buzz/post' title='Post to Google Buzz'/> <script src='http://www.google.com/buzz/api/button.js' type='text/javascript'/> </div> <div style='float:left;padding-left:10px;'> <a class='DiggThisButton DiggCompact'/> <script type='text/javascript'> (function() { var s = document.createElement(&#39;SCRIPT&#39;), s1 = document.getElementsByTagName(&#39;SCRIPT&#39;)[0]; s.type = &#39;text/javascript&#39;; s.async = true; s.src = &#39;http://widgets.digg.com/buttons.js&#39;; s1.parentNode.insertBefore(s, s1); })(); </script> </div> <div style='float:left;padding-left:10px;'> <a class='twitter-share-button' data-count='horizontal' data-via='User Name' href='http://twitter.com/share'>Tweet</a><script src='http://platform.twitter.com/widgets.js' type='text/javascript'/> </div> </div> </b:if>
*perhatikan pada kode diatas, ada tulisan user name twitter, ganti dengan milik Anda
Langkah 2

  • Login ke Blogger » Rancangan » Edit HTML » Centang Expend Widget 
  • Cari Kode   <div class='post-body entry-content'>
Tips mencari cepat: tekan ctrl+f dan masukan kode
di atas, atau jika tidak ketemu musukan saja post-body kemudian cari
kode yang mirip dengan yang saya sebutkan tadi di atas!
  • Jika sudah ketemu pastekan code yang telah Anda
    copy tadi tepat di atasnya <div
    class='post-body entry-content'>
  • Simpan Template dan Lihat hasilnya ! ^_^
Wah Trik kali ini lebih mudah dari yang sebelumnya bukan??

Tidak ada komentar:

Posting Komentar

HOT NEWS

Welcome In Kode Blogger

Contoh Sliding Login Dengan JQuery

Disamping ini adalah contoh Sliding Login menggunakan JQuery. Login Form Disamping hanya Contoh dan tidak dapat digunakan layaknya Login Form FB, Karena Blog ini terbuka untuk umum tanpa perlu mendaftar menjadi Member

Tutorial Blog

Untuk membuatnya Silahkan : Klik Disini

Member Login

Lost your password?

Not a member yet? Sign Up!