Cara simple buat facebook melayang di blog

cara membuat halaman like facebook di blogSebaiknya bagi setiap pemilik blog mempunyai widget  jejaring sosial yang satu ini, tujuannya untuk memudahkan dalam berbagi dan promosi. Hal ini memiliki banyak keunggulan, disntaranya interaksi dinamis antara pengguna-pengunjung lewat Fans Page Facebook dan juga meningkatkan ‘gengsi’ blog sobat. Pokoknya makin TOP aja deh…


Banyak cara untuk membuat floating facebook (facebook melayang), tapi tutorial di jamin ini lebih unik dan lebih baik dari yang lain. Dengan sedikit tampilannya yang menarik dan dinamis menjadikannya lebih berbeda dari yang lainnya. Jika sobat yang ingin punya banyak ‘likers’ sudah saatnya mencoba tutorial ini. Dengan begitu pengunjung ‘dirayu’ dengan tampilan unik Facebook melayang.

Karena facebook melayang ini merupakan alternatif jitu ketika banyaknya widget yang bejejeran di sidebar. Tanpa menambah dan memperpanjang vertikal sidebar. Memasang kotak like Facebook melayang solusi tepat mengatasi penuhnya tempat widget dan memudahkan pengunjung me‘like’ blog sobat.

Oh iya, tutorial ini saya dapatkan dari Irfandi Rahman di blognya http://www.tugasku4u.com dengan beberapa perubahan dari admin.

Berikut cara memasang like Facebook melayang pada blog



1. Masuk ke akun blog Anda

2. Pilih Tata Letak  => Tambahkan Gadget => Pilih HTML/javascript.
3. Copy Kode di bawah ini dan pastekan di HTML/javascript tadi. kemudian simpan/save !


<style type='text/css'>
#kotak-facebook {
position:fixed !important;
position:absolute;
bottom:-1000px;
left:50%;
margin:0px 0px 130px -182px;
width:auto;
height:auto;
padding:16px;
-webkit-box-shadow: 0px 0px 7px #222;
-moz-box-shadow: 0px 0px 7px #222;
box-shadow: 0px 0px 7px #222; background-color:#FFFFFF; font:normal 1em Cambria,Georgia,Serif;
color:#111;
-webkit-border-top-left-radius: 20px;
-webkit-border-bottom-right-radius: 20px;
-moz-border-radius-topleft: 20px;
-moz-border-radius-bottomright: 20px;
border-top-left-radius: 20px;
border-bottom-right-radius: 20px;}
    #kotak-facebook a.close {
position:absolute;
top:-10px;
right:-10px;
background:#333;
font:bold 16px Arial,Sans-Serif;
text-decoration:none;
line-height:22px;
width:22px;
text-align:center;
color:#fff;
border:2px solid #fff;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
cursor:pointer;
}
</style>
<script src='http://tugasku4u.googlecode.com/files/tombol-close-menu.js'/></script>
<div id='kotak-facebook'>
<font size="3"><b>Bantu Like Dong Sobat... ^_^</b></font size>
<br/>
<div class="fb-like-box" data-href="http://www.facebook.com/seodanbisnisonline" data-width="292" data-height="250" data-show-faces="true" data-stream="false" data-header="false"></div><a class='close' href='#'>&times;</a>
<div style="float:left; margin:15px;"><g:plusone annotation=
"none"></g:plusone>
 </div>
</div>

 
#FFFFFF = ganti dengan warna background yang Anda sukai
Bantu Like Dong Sobat... ^_^ = ganti dengan kata-kata yang Anda sukai
http://www.facebook.com/seodanbisnisonline = ganti dengan URL Fanspage sobat.


4. Simpan, kemudian pilih Template => Edit Template
5. Cari kode <body>, silahkan tekan ctrl+F pada keyboard untuk mempermudah mencari dan silakan tulis kode di atas.
6. Setelah dapat, copy dan letakkan kode di bawah ini tepat di bawah kode <body>. 

<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/id_ID/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>


 


Demikian tutorial cara membuat  Facebook  melayang pada blog, semoga bermanfaat. Happy blogging

0 Response to "Cara simple buat facebook melayang di blog"

Posting Komentar

Jika ada komentar SPAM atau tidak bermutu akan langsung saya hapus tanpa ampun! Saya menghormati komentar anda. Orang bijak adalah yang selalu membudidayakan komentar yang baik... Terima Kasih