Cara Membuat Floating Facebook Like Box Di Blog/Blogspot

postingan Cara Membuat Widget Melayang Facebook Like Box Di Blog atau Cara Pasang Kotak Facebook Like Melayang Di Blogspot. Tips Trik Blog bosimam kali ini Bagaimana Buat Facebok Like Box Di Blog ini sangat ringan untuk di gunakan diBlog. Widget ini selain menghemat tempat pada sidebar juga dimaksudkan supaya tidak menghambat kecepatan loading awal blog pada saat dibuka.

Oke berikut Cara Membuat Floating Facebook Like Box Di Blog/Blogspot :

Cara Membuat Widget Melayang Facebook Like Box

1.     Sebelumnya anda harus sudah mendaftar dan mendapatkan kode Facebook Like Box untuk nanti dipasang pada widget.

2.       Login ke dashboard blogger anda.

3.       Pilih Rancangan > Elemen Laman > Add Gadget (HTML/Javascript).

4.       Copy script widget dibawah ini dan paste pada gadget.

<style type="text/css">

.barrightfacebook{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisxnbq6ZtL2cm6hcroHqgxKs3vMDEQsPcqPkwOzo7STkYJYPn-rXE0sdAr4VHFypfAtYlj76ofPRWQN0de2BOcwZFOv7OOoMSSSgZyzqDm30dCPFmIfbrbQwtjW3h9qIzAFDx4XrdS-UAp/');background-repeat:no-repeat;width:39px;height:159px;position:fixed;right:0px;top:370px; z-index:1000;}

.barrightfacebookc{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrc6POMue8EhOVmRBbEQnRmfHQlkHyvmyhyphenhyphendbQWB2FBRpe1yYJWrOOF2vu_lha8C0XJk78qutFY5wjjVTm-Peu46pR4nRhe5Z1LS1faV-z5D3TTLR2lVoTMDU7238cu7Dt01UjjcND2Pr-/');background-repeat:no-repeat;width:288px;height:345px;position:fixed;right:0px;top:185px; z-index:1100;}

.barcontefacebook{margin:5px 0 0 47px}

</style>

<div class="barrightfacebook" onmouseover="this.className='barrightfacebookc'" onmouseout="this.className='barrightfacebook'">

<div class="barcontefacebook">

<!-- Begin Facebook -->

CONTENT FACEBOOK HERE

<!-- End Facebook -->

</div>

</div>

5.      Ganti tulisan CONTENT FACEBOOK HERE dengan kode Facebook Like Box anda.

6.      Jika pada template anda belum terdapat javascript dari Facebook, maka copy saja javascript dibawah ini dan letakkan tepat diatas kode </head>  pada template supaya widget Facebook Like Box ini bisa berfungsi.

<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 = &quot;//connect.facebook.net/en_US/all.js#xfbml=1&quot;;

  fjs.parentNode.insertBefore(js, fjs);

}(document, &#39;script&#39;, &#39;facebook-jssdk&#39;));</script>

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>

7.     Sesuaikan tinggi dan lebar widget supaya sama dengan ukuran Facebook Like Box yang anda buat sebelumnya melalui Facebook.

8.      Save / Simpan.