Blogger news

Home » » Membuat Share Button Melayang di Sisi Blog

Membuat Share Button Melayang di Sisi Blog

Membuat Share Button Melayang/Popup di Sisi BlogSocial media adalah layanan gratis untuk berinteraksi yang bertujuan untuk menghubungkan seluruh manusia di muka bumi ini dalam dunia maya. Kini nampaknya semua pengguna internet sudah mengenal dan
mempunyai akun pribadi mereka pada masing-masing jejaring sosial, entah itu, facebook, twitter, atau yang lainya. Kehadiran Social media tentu membawa dampak positif dan negatif yang kontroversial, namun
kita sebagai blogger dapat memanfaatkan fungsi dari layanan ini sebagai bahan promosi atau marketing, karena dengan layanan social media ini kita dapat menghubungkan pengunjung berpotensial dengan blog kita yang mungkin mereka cari, itu artinya kita sudah membuka peluang lebih besar untuk mendatangkan traffik kunjungan.

Seperti ulasan yang sudah saya paparkan pada artikel sebelumnya (membuat like box facebook dengan timer), Social Media memang terbukti ampuh dan berhasil untuk dijadikan sebagai sumber traffik sampingan diluar search engine, pasalnya begitu banyak pengguna internet diluar sana yang haus akan informasi dunia maya, oleh karena itu kita harus pintar-pintar mencari peluang dan memanfaatkanya semaksimal mungkin sebagai alternatif yang bisa kita gunakan untuk mendulang traffik blog.

Untuk mengoptimalkan sektor social media dalam meningkatkan trafficsite, saya punya widget yang berguna bagi anda untuk menghubungkan blog kita dengan social media, yaitu widget share button melayang/popup di sisi kanan blog, jadi nantinya tombol share ini bersifat melayang dan posisinya fixed (posisi tetap dan mengikuti layar monitor setiap discroll). Bagaimana sobat, anda tertarik untuk memasang widget potensial yang satu ini? Let's do It!


Cara Membuat Share Button Melayang di Sisi Blog

1. Login ke Blogger.

2. Pilih Template.

3. Klik Edit HTML.

4. Cari kode </body> (gunakan CTRL+F).

5. Letakkan kode berikut ini tepat dibawah-nya.

<style type='text/css'> .tuliskancom{display:block;position:fixed;bottom:300px;left:165px;} </style> <script type='text/javascript'> $(document).ready(function(){$(&#39;.tuliskancom&#39;).hover(function(){$(this).css(&#39;cursor&#39;,&#39;auto&#39;);});$(&#39;.tuliskancom span&#39;).click(function(){$(this).parent().fadeOut(800);});});</script> <div class='tuliskancom warning'><span/><center>
<div class='sbutton' id='fb'><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><fb:like layout='box_count' show_faces='false'/></div>
<div class='g-plus' data-action='share' data-annotation='vertical-bubble' data-height='60'/>
<div class='sbutton' id='rt'><a class='twitter-share-button' data-count='vertical' href='http://twitter.com/share'>Tweet</a><script src='http://platform.twitter.com/widgets.js' type='text/javascript'/></div>
</center></div>

Keterangan: 
  • 165px = Jarak widget dari tepi kiri layar monitor.
  • 300px = Jarak widget dari tepi bawah layar monitor.

6. Klik "Save/Simpan" gadget, dan selesai.

Demikian informasi kami,

 Semoga bermanfaat

2 komentar:

  1. Makasih banyak gan untuk tutorialnya, seukses yah :D
    http://inggrispare.com

    BalasHapus
  2. kalau gak ada kode body-nya gimana?

    BalasHapus