Cara Membuat Facebook Like Box Melayang di Blog
Sabtu, 26 Januari 2013
1
komentar
kali ini infoaksimu akan men-share bagaimana cara kita menambahkan Facebook Like Box Melayang di Blog seperti
Biasanya kita memasang FB Like Box ini di sidebar atau bottom bar.
Tentunya
hal ini bertujuan supaya blog atau web kita lebih dikenal, dan akhirnya
traffic
akan meningkat. Akan tetapi apabila kita scroll mouse ke atas atau
bawah, FB Like Box pastinya ini tidak terlihat. Atau mungkin kita
kebingungan untuk
menempatkannya, karena kehabisan space.
Yup, ini dia cara pembuatan Facebook Like Box Melayang di Blog.
Yup, ini dia cara pembuatan Facebook Like Box Melayang di Blog.
Menambahkan Jquery
Plugin
1. Login ke Blogger
2. Klik Dasbor>Rancangan>Edit HTML
3. Cari kode
2. Klik Dasbor>Rancangan>Edit HTML
3. Cari kode
</head>
4. Tambahkan kode ini diatas </head>
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"
type="text/javascript">
</script>
Abaikan langkah ini apabila template anda sudah terinstall Jquery Plugin.
Menambahkan Kode HTML
pada Widget
1. Klik Dasbor>Rancangan>Tambah Gadget>HTML/JavaScript
2. Copy kode dibawah ini
2. Copy kode dibawah ini
<script type="text/javascript">
//<!--
$(document).ready(function()
{$(".floatinglikebox").hover(function()
{$(this).stop().animate({right: "0"}, "medium");}, function()
{$(this).stop().animate({right: "-250"}, "medium");},
500);});
//-->
</script>
<style type="text/css">
.floatinglikebox{background:
url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSZtnjeHr4-bBtL2gDvkMRrzdTsH5q5SKNqdpaESM2vdOIGU5mibXWIym2daoQqMxxsEy58QUcPGwSAqOnH8pV_Tb4Dcan8ApChKEqILx7HECKvieMhQYvtw3zz7ge5bbDQPwBxDUUjuQ/s1600/floatingfb.png")
no-repeat scroll left center transparent !important;display: block;float:
right;height: 270px;padding: 0 5px 0 40px;width: 245px;z-index:
99999;position:fixed;right:-250px;top:20%;}
.floatinglikebox div{border:none;position:relative;display:block;}
.floatinglikebox span{bottom: 10px;font: 10px
tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align:
right;z-index: 99999;}
.floatinglikebox span a{color: #808080;text-decoration:none;}
.floatinglikebox span a:hover{text-decoration:underline;}
</style><div class="floatinglikebox"
style=""><div><iframe
src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FBlogMasHanif&width=251&height=270&colorscheme=light&show_faces=true&border_color=%23cccccc&stream=false&header=false&appId=159468740772399"
scrolling="no"
frameborder="0" style="border:none;
overflow:hidden; width:251px; height:270px; background:#fff;"
allowtransparency="true"></iframe><span><a
href="http://infoaksimu.blogspot.com/27/2013/cara-membuat-facebook-like-box-melayang.html"
target="_blank">+Get This!</a></span></div></div>
3. Ganti http%3A%2F%2Fwww.facebook.com%2FBlogMasHanif dengan Facebook Fan Page Anda.
4. Lalu Simpan
Catatan:
Sebelum menyimpan URL Facebook anda, ganti kode-kode pada URL.
: dengan %3A
/ dengan %2F
Misalkan URL Facebook anda :
http://www.facebook.com/pages/fbanda/123456
menjadi
http%3A%2F%2Fwww.facebook.com%2Fpages%2Ffbanda%2F123456
Sekian kurang lebihnya mohon maaf, jika anda berkenan tolong follow blog ini....selamat mencoba :)
Categories:
1 komentar:
mantap
Posting Komentar