Jumat, 24 Mei 2013

Cara membuat like Facebook FP melayang di Blog

  • Masuk akun blogger
  • Pilih pilih blog yang mau di edit, lalu pilih tata letak
  • click tambahkan gadget, terserah dimana saja, hasilnya tetap melayang
  • Copy paste code ini



    <!-- Script kotak like Facebook abcd-buluagung -->
    <style type="text/css">
    #topbar{
    position:absolute;
    padding-left:260px;
    background-color: transparancy;
    width: 300px;
    visibility: hidden;
    z-index: 100;
    }
    </style>
    <script type="text/javascript">
    var persistclose=0 //set to 0 or 1. 1 means once the bar is manually closed, it will remain closed for browser session
    var startX = 30 //set x offset of bar in pixels
    var startY = 5 //set y offset of bar in pixels
    var verticalpos="fromtop" //enter "fromtop" or "frombottom"
    function iecompattest(){
    return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
    }
    function get_cookie(Name) {
    var search = Name + "="
    var returnvalue = "";
    if (document.cookie.length > 0) {
    offset = document.cookie.indexOf(search)
    if (offset != -1) {
    offset += search.length
    end = document.cookie.indexOf(";", offset);
    if (end == -1) end = document.cookie.length;
    returnvalue=unescape(document.cookie.substring(offset, end))
    }
    }
    return returnvalue;
    }
    function closebar(){
    if (persistclose)
    document.cookie="remainclosed=1"
    document.getElementById("topbar").style.visibility="hidden"
    }
    function staticbar(){
    barheight=document.getElementById("topbar").offsetHeight
    var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
    var d = document;
    function ml(id){
    var el=d.getElementById(id);
    if (!persistclose || persistclose && get_cookie("remainclosed")=="")
    el.style.visibility="visible"
    if(d.layers)el.style=el;
    el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};
    el.x = startX;
    if (verticalpos=="fromtop")
    el.y = startY;
    else{
    el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
    el.y -= startY;
    }
    return el;
    }
    window.stayTopLeft=function(){
    if (verticalpos=="fromtop"){
    var pY = ns ? pageYOffset : iecompattest().scrollTop;
    ftlObj.y += (pY + startY - ftlObj.y)/8;
    }
    else{
    var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
    ftlObj.y += (pY - startY - ftlObj.y)/8;
    }
    ftlObj.sP(ftlObj.x, ftlObj.y);
    setTimeout("stayTopLeft()", 10);
    }
    ftlObj = ml("topbar");
    stayTopLeft();
    }
    if (window.addEventListener)
    window.addEventListener("load", staticbar, false)
    else if (window.attachEvent)
    window.attachEvent("onload", staticbar)
    else if (document.getElementById)
    window.onload=staticbar
    </script>
    <br />
    <div class="clear">
    </div>
    <div id="topbar">
    <table border="1" bgcolor="FFFFFF">
    <tr>
    <td>
    <div style="text-align: right;">
    <a href="" onclick="closebar(); return false"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikrt7MQaPU_KtedbEdrWChcTepukanChzMlvMSKm6tOb49rPcl67NAQ5ur9LS1PwrK5C8zr4pUxDrJgH4ZNQ2dXwtsLqAS1rlFnNdA-3jY6qKNqSbuoaNEpNzf54B_GnRKXxNDhsdl0RBg/s1600/close3.png" /></a></div>
    <center>
    <div style="background: #fff;">
    ---Ganti dengan code IFRAME Facebook---
    </div>
    </center></td>
    </tr>
    </table>
    </div>
    <!-- End Like Fan Page Melayang abcd-buluagung -->
Untuk Yang berwarna merah ganti dengan code IFRAME anda, untuk mendapatkan Code IFRAME dibawah ini:
  1. Masuk ke akun Facebook
  2. pergi ke link ini http://developers.facebook.com/docs/reference/plugins/like-box/
    atau clikk disini, sama saja
  3. Atur Tampilan
    ket:
    • kalau masih belum punya FP click disini
    • width: lebar plugin dalam piksel.
    • height: tinggi dari plugin dalam piksel
    • width dan height, biasanya di biarkan Default
    • show faces: menentukan apakah atau tidak untuk menampilkan foto profil di plugin. tapi biarkan default saja
    • stream: menentukan apakah akan menampilkan aliran pesan-pesan terbaru dari dinding Page
    • show border: menentukan apakah atau tidak untuk menampilkan perbatasan sekitar plugin
    • Show header: tampilkan header atau tidak.

4.  setelah selesai mengatur tampilan, click get code untuk mendapatkan code HTML widget
5.  click IFRAME untuk mendapatkan code widget, copy seluruh code IFRAME

dan pastekan pada tutorial di atas
Selesai Semoga bermanfaat

0 komentar:

Entri Populer