Pasang Widget Share Melayang di Blog

Mungkin widget yang satu ini menjadi bagian terpenting bagi sebagian blogger, karena dengan fungsi share maka blognya bisa menyebar di jejaring sosial dan bisa juga sebagai alat untuk menaikan trafik pengunjung blog anda. Untuk contoh demonya bisa diliat disamping kanan sidebar blog ini.

Langsung saja berikut ini caranya:
1. Login ke akun blog sobat,
2. Lalu buka => Tata Letak => Elemen Halaman => Tambah Gadget => HTML/Javascript
3. Lalu copy kan kode  berikut kedalamnya :

    <style type="text/css">

    *{margin:0;padding:0;}

    * html #z33sHare{

    position: absolute;

    }

    #z33sHare{

    right:0%;width: 70px;background:transparant;border:0px solid #E7E7E7;-moz-border-radius:3px;-webkit-border-radius:3px;

    position:fixed;

    bottom: 40%;

    }

    #z33sHare div{

    padding:6px 6px 6px 5px;

    }

    #stw{

    margin-left:-2px;

    }

    #sfs{

    margin-left:-5px;

    }

    </style>

    <div id="z33sHare">

    <div id="ssl-box">

    <div id="stw">

    <div><a name="Widget" type="Widget" href="http://mankita.blogspot.com/">Share</a><script src="Widget" type="text/javascript">

    </script></div>

    <!-- Place this tag where you want the +1 button to render -->

    <g:plusone size="tall"></g:plusone>

    <!-- Place this render call where appropriate -->

    <script type="text/javascript">

      (function() {

        var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;

        po.src = 'https://apis.google.com/js/plusone.js';

        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);

      })();

    </script>

    <a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

    </div>

    <!-- Tambah code lainnya -->

    <div>
    <script type="text/javascript">
    (function() {
    var s = document.createElement('SCRIPT'), s1 = document.getElementsByTagName('SCRIPT')[0];
    s.type = 'text/javascript';
    s.async = true;
    s.src = 'http://widgets.digg.com/buttons.js';
    s1.parentNode.insertBefore(s, s1);
    })();
    </script>
    <a class="DiggThisButton DiggMedium"></a>
    </div>
    </div>
    <div><a name="fb_share" type="box_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript">
    </script></div>
    <div style="clear:both;"></div></div>

   Taruh Script diatas di Element Bagian Sidebar Jika widget tidak bisa tampil di blog.

Silahkan Rubah :
# Yang berwarna Merah silahkan tambahkan code Widget share lainnya jika sobat punya. Jika tidak gunakan yang sudah tersedia diatas saja. Widget diatas sudah terdapat tombol Facebook share, Twitter, Google+, dan Digg.
# Yang berwarna Hijau itu merupakan posisi widget, sobat bisa gunakan right = posisi kanan dan left = untuk posisi kiri.
# Dan untuk yang berwarna Biru yaitu jarak (dalam %) dari bawah, sobat bisa ganti sesuai dengan ukuran yang sobat mau.
4. Sekarang SAVE. Lalu refresh bolag sobat dan akan terlihat hasilnya. Jika masih bingung silahkan bertanya.

Selamat Mencoba

Source:
http://www.jejakblogger.com/2012/07/pasang-widget-share-melayang-di-blog.html

Share this Article now on :

ARTIKEL YANG BERHUBUNGAN :