Friday, March 9, 2012

Floating Facebook LikeBox Untuk Blogger (LikeBox Mengambang)


Membuat Floating facebook likebox untuk blogger | facebook likebox menempel di blog



Nah sebelum kita ketopik pembicaraan mungkin ada artikel-artikel saya yang hampir berkaitan dengan postingan kali ini kali aja sobat ada yang minat.


  1. Membuat popup likebox facebook dengan jquery
  2. Membuat popup facebook likebox dengan jquery tampil diwaktu
  3. Cara membuat buku tamu menempel di samping blog
Oke kita berlanjut ke topik, oh ia satu lagi jika floating facebook likebox untuk wordpres klik dini.

Membuat Floating Facebook LikeBox Untuk Blogger
  • Masuk ke akun Blogger sobat
  • Dari Dasbor klik Rancangan
  • Kemudian Tambag Elemen atau Tambah Gadget
  • Plih HTML/ JavaScript
  • Masukan kode di bawah ini di dalamnya.

<script type="text/javascript">
//<!--
$(document).ready(function() {$(".w2bslikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
//-->
</script>
<style type="text/css">
.w2bslikebox{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjlQjLxNR6F4MnGNukg38Gu7G2pKZwYSlQHt2-xrDFXBP850G02gPpFm9NN8koO8hehTM6rktlfacaxlH49X9L3tD0Wveib_1aTRnKyJ_VtHaGshNOz5Ui9_aQ-UDHoGWjikLVTgzt38hAP/s150/w2b_facebookbadge.pn") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
.w2bslikebox div{border:none;position:relative;display:block;}
.w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.w2bslikebox span a{color: #808080;text-decoration:none;}
.w2bslikebox span a:hover{text-decoration:underline;}
</style><div class="w2bslikebox" style=""><div>
<iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Ffacebook.com%2Ftheants.blog&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp; connections=9&amp;stream=false&amp;header=false&amp;height=270" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 270px; width: 245px;background:#fff;"></iframe></div></div> 
Ganti "theans.blog" dengan username halaman facebook sobat 
  • Simpan widget sobat.
  • Sekarang kita pergi ke Edit HTML
  • Cari kode <head> dan tepat di bawah kode itu simpan kode jquery berikut. (catatan : anda dapat mengabaikan tahap ini jika link jquery sudah di tambahkan dalam template blog sobat)
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>
  • Simpan template sobat dan semunya beres sobat tinggal lihat hasilnya. 
Semoga sobat dapat mengerti apa yang saya jelaskan dan dapat mengikuti dengan mudah tutorial saya jika anda suka anda boleh like saya di bawah ini atau dengan mengikuti artiker saya lewat email.

Theant Budiana

About the Guest Author:
Saya bukanlah orang yang ahli dalam dunia blogger tapi saya mencoba untuk berbagi ilmu dari apa yang saya ketahui dari paman saya, saya sangat suka blogging dan berbagi ilmu, tapi bukan berarti saya master blog salah besar jika sobat anggap saya hebat saya hanya seorang anak kampung yang mencoba untuk tidak kampungan dan tertinggal informasi alias GAPTEK, banyak artikel yang saya tulis di Blog Urang Sunda dan lihat juga blog saya satu lagi di Dunia Maya Saya dan klik disini untuk mengetahui lebih lanjut tentang saya


Kindly Bookmark this Post using your favorite Bookmarking service:
Technorati Digg This Stumble Stumble Facebook Twitter
warning

Anda bingung?
Jangan ragu untuk bertanya kepada saya lewat komentar di bawah, saya akan mencoba menjawabnya sesegera mungkin, bahkan jika sobat ada saran untuk saya silahkan jangan ragu untuk memberi saran kepada saya asalkan komentar no spam. Komentar anda, adalah bekal untuk kemajuan blog saya, saya akan kunjungi balik blog sobat jika sobat meninggalkan jejak sobat disini.

0 comments:

Comments
0 Comments
Facebook Comments Post by Blog Urang Sunda

Post a Comment

Sponsor BUS

Dapatkan juga sponsor untuk Blog anda dengan klik gambar di bawah, untuk mengetahui caranya KLIK DISINI. Kalo mau yang lebih tinggi penghasilannya KLIK DISINI Adsense Indonesia

Buat Blog

Alexa Rank

 

Info My Blog

cobi?
Yahoo bot last visit powered by MyPagerank.NetMsn bot last visit powered by MyPagerank.Net
Google PageRank Checker Powered by  MyPagerank.Net
SEO Stats powered by MyPagerank.Net
web log free

Recent Comment

| BLOG URANG SUNDA © 2009. All Rights Reserved | Template Style by My Blogger Tricks .com | Design by Brian Gardner | Back To Top |