Cara Membuat Like Facebook dan Follow Twitter Melayang

       

Cara Membuat Tweet Box Melayang di sebelah kanan Blog merupakan widget yang banyak dipasang. Media Blogger juga akan memberikan informasi mengenai Cara Membuat Tombol Like Facebook dan Follow Twitter di blogspot.

Social networking memang merupakan kegiatan banyak orang di era teknologi saat ini. Bagaimana tidak? Kecanggihan transaksi secara online, menghubungi kerabat dan saudara, mendapatkan penghasilan di internet dapat dilakukan dengan media social.

Untuk itu apabila anda ingin lebih memajukan blog anda dan agar lebih dikenal, bisa juga dengan menambahkan sebuah kotak yang dapat menghubungkan mereka dengan anda. Bagaimana cara memasang widget tersebut, langsung saja ikuti tips dan tutorialnya.

Cara Membuat Twitter Box Melayang di Blog:

• Silahkan buat terlebih dahulu tampilan widget tersebut di http://twittercounter.com/
• Login dengan menggunakan akun Twitter anda.
• Jika sudah Lalu klik My Widget, Lalu Klik Widget Setting and Code, sesuaikan dengan selera dan tampilan blog kita, jika sudah cocok lalu copy kode script widget yang telah disediakan.
• Masuk ke Blogger.
• Pilih Dashboard, lalu klik Layout / Tata Letak.
• Tambahkan Gadget Baru dengan klik Add a Widget / Add a Gadget.
• Sesuaikan dengan posisi letak yang ingin anda pasang.
• Pilih HTML/Javascript.
• Ganti kode warna merah pada script berikut ini dengan kode yang tadi diperoleh dari twittercounter.com

<style type="text/css">
.barrighttwitter{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUN9RNVtH7_yJWiPCCzQ7zdZN18jCsFcN0cN6kus8qiBNUFh_gXR55VtVd18Mtyk9VONptI9T1cKBsFOZOS7lkpXVMX9EGtVBmqRq5QnjJrJ_Q0dJEn3Ev2b4b92CiVeMSzFMHM2Q7DFwR/');background-repeat:no-repeat;width:39px;height:159px;position:fixed;right:0px;top:210px;z-index:1000;}
.barrighttwitterc{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuwDX42U42AN-Rinfs9FD6_TEuLW6Le7Aaj2f-LRzwkx0ME-dgVa8SPLl-nKtL4N4VNf077eb9UQnaG-BLwSKiCPomKuS2vWOf9pNO2zdeQ7nPVyIrKF-N_F-akPONR3IYvLe3Rrg2uQ56/');background-repeat:no-repeat;width:288px;height:345px;position:fixed;right:0px;top:120px; z-index:1100;}
.barcontetwitter{margin:5px 0 0 47px}
</style>
<div class="barrighttwitter" onmouseover="this.className='barrighttwitterc'" onmouseout="this.className='barrighttwitter'">
<div class="barcontetwitter">

PASTEKAN KODE SRIPT TwitterCounter

</div>
</div>

• Setelah anda ganti, copy semua kode yang telah digabungkan dengan twittercounter diatas.
• Masukkan ke dalam kotak HTML/Javascript di Blogger tadi.
• Save Widget.

Maka pada halaman anda, telah terpasang box twitter melayang di blog.

Source : abufarhan

Cara Memasang Tombol Like Facebook dengan Follow Twitter Simple:

• Masuk ke Blogger.com
• Pilih Blog Anda, lalu ke Layout / Tata Letak
• Tambah Widget anda.
• Pilih HTML/Javascript
• Copy kode CSS dan HTML berikut :

<style type="text/css">
#AGCnavbar3{border:4px solid #000;border-radius:5px; width:155px; height:57px; margin-bottom:460px; margin-left:10px; font-family:Comic Sans Ms; color:white;text-align:left; background:#222222url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgg_OO8Gc-rjATP3_h1TFf5r4oi1VmgzTDkMwIjxAofrRWPJZ4V6Um8rgF4uApihPZPCO4ETtU2FaGKdvbekzSwHSRUvQWc_3h-YdOQYDVHgoC4OZyuvfKIeJENxyTGdpgNOTCKdENhB-c/s1600/grid.png"); background:#222222url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgg_OO8Gc-rjATP3_h1TFf5r4oi1VmgzTDkMwIjxAofrRWPJZ4V6Um8rgF4uApihPZPCO4ETtU2FaGKdvbekzSwHSRUvQWc_3h-YdOQYDVHgoC4OZyuvfKIeJENxyTGdpgNOTCKdENhB-c/s1600/grid.png"); background:#222222url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgg_OO8Gc-rjATP3_h1TFf5r4oi1VmgzTDkMwIjxAofrRWPJZ4V6Um8rgF4uApihPZPCO4ETtU2FaGKdvbekzSwHSRUvQWc_3h-YdOQYDVHgoC4OZyuvfKIeJENxyTGdpgNOTCKdENhB-c/s1600/grid.png"); padding:2px; z-index:999; bottom:1px; left:1px; right:1px; position:fixed;-webkit-transition: all 0.9s ease-out;-moz-transition: all 0.9s ease-out;-ms-transition: all 0.9s ease-out;-o-transition: all 0.9s ease-out;transition: all 0.9s ease-out;}
#AGCnavbar3 .left{float:left; text-align:left; font-family:Supermercado; font-size:10px; font-style:normal; font-weight:normal; color:White; padding:2px 10px}
#AGCnavbar3:hover{box-shadow:1px 1px 5px black;font-size:20px; font-style:bold; width:155px; height:57px; margin-bottom:460px; margin-left:10px; margin-right:120px;-webkit-transition: all 0.9s ease-out;-moz-transition: all 0.9s ease-out;-ms-transition: all 0.9s ease-out;-o-transition: all 0.9s ease-out;transition: all 0.9s ease-out;}
</style>
<div id='AGCnavbar3' style='position:fixed;'>
<span class='left'><img src='' title=''/>
<iframe allowTransparency='true' frameborder='0' scrolling='no' src='http://www.facebook.com/plugins/like.php?href=https://www.facebook.com/http://tutorial-tipdantrik.blogspot.com&amp;send=false&amp;layout=button_count&amp;width=85&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=21' style='border:none; overflow:hidden; width:85px; height:21px;'/>
<div style='margin-right:3px;margin-left:2px;'>
<a class='twitter-follow-button' data-lang='id' data-show-count='false' href='https://twitter.com/tutorialblog83'>Follow Me</a><script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=&quot;//platform.twitter.com/widgets.js&quot;;fjs.parentNode.insertBefore(js,fjs);}}(document,&quot;script&quot;,&quot;twitter-wjs&quot;);</script></div>
</span></div>

Keterangan :

• Ganti kode berwarna hijau dengan ID Facebook Anda / URL Fans Page FB kalian.
• Ganti kode berwarna orange dengan kode tombol twitter anda.

Anda dapat mengganti nama twitter di widget tersebut dengan nama twitter anda (di dalam kode warna orange).

Itulah tadi berbagai macam jenis widget tambahan yang dapat anda gunakan agar memudahkan pengunjung mencari atau melakukan contact dengan anda.