Floating Facebook Like Box Widget

Floating Facebook Like Box Widget

ဒါက​တော့မိမိကိုယ်ပိုင် Facebook Page ရှိတဲ့သူ​တွေဆိုရင်​တော့ပိုအဆင်​​ပြေတာ​ပေါ့​နော်။ဘာဖြစ်လို့လဲဆို​တော့ Blog Site မှာမိမိရဲ့ Facebook Page Like Box ကိုထည့်သွင်းထားတဲ့ site ရှိသလိုမထည့်သွင်းထားတဲ့ site လဲရှိပါတယ်။Facebook Like Box ထည့်သွင်းထားတဲ့  site ရှိရင်အဲဒီထည့်သွင်းထားတဲ့ Facebook Like Box အတွက်သီးသန့်ကြီးနေရာ​ပေးထားရမှာပါ။အခုဒီ Floating Facebook  Like Box ဟာ​နေရာသီးသန့်ကြီး​ပေးစရာမလိုပဲ​ဘေး​ဘောင်​လေးမှာကပ်လျက်​နေ​ပေးမှာပါ။ဘယ်ညာနှစ်ဘက်စလုံးမှာမိမိကြိုက်နှစ်သက်တဲ့ဘယ်အခြမ်းမှာမဆိုထည့်သွင်းအသုံးပြုနိုင်ပါတယ်။မိမိရဲ့ Facebook Page ID (or) Facebook Page Name ထည့်သွင်းလိုက်တာနဲ့အသုံးပြုလို့ရသွားမှာဖြစ်ပါတယ်။အောက်မှာဘယ်ညာနှစ်ဘက်စလုံးရဲ့ code (2) ခုချပြထားပါတယ်။ မိမိနှစ်သက်တဲ့ဘက်အခြမ်းက code တွေကူးထည့်ပေးပါ

NO(1)။မိမိ Blog Site ကို account အရင်ဝင်ပါ

NO(2)။ dashboard ထဲက Layout ကိုနှိပ်

NO(3)။ Add  a  Gadget ကိုနှိပ်

NO(4)။ HTML / JavaScript ကိုနှိပ်

NO(5)။ပေါ်လာတဲ့အကွက်ထဲမှာအောက်ကပေးထားတဲ့ပုံစံ (2)ခုကမှမိမိထားချင်တဲ့ဘက်အခြမ်းကိုရွှေးချယ်ကူးယူထည့်သွင်းပေးပါ

No(6)ဂဏန်း (15) လုံးနေရာတွင်

---------->    108140433933376   <----------

မိမိ Fcebook Page ID (or) Facebook Page Name ပြောင်းပေးပါ။

No(7)။ save ကိုနှိပ်ပြီးပါပြီ။

Right ( ညာဘက်)

<style type="text/css"> #fb{ position:fixed; top:50px; z-index:+1000; } * html #fb{position:relative;} .fbtab{ height:160px; width:40px; float:left; cursor:pointer; background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiuVncMsj-kuu5edJ1Fb7dL9sR1teoPHcNbwLGdDDmm4wMwadz-GYyqRp25iK5967yqWgig9Ysp_-SZlCHWm3BblveqbvITf4T-9iOC8xiv6jwsvZSyConB486A5BtVCZYeTDoWFWiAnKms/s1600/fb-right.png") no-repeat; } .fbcontent{ float:left; border:4px solid #3b5998; background:#F5F5F5; padding:10px; } </style> <script type="text/javascript"> function showHideFB(){ var fb = document.getElementById("fb"); var w = fb.offsetWidth; fb.opened ? moveFB(0, 30-w) : moveFB(20-w, 0); fb.opened = !fb.opened; } function moveFB(x0, xf){ var fb = document.getElementById("fb"); var dx = Math.abs(x0-xf) > 10 ? 5 : 1; var dir = xf>x0 ? 1 : -1; var x = x0 + dx * dir; fb.style.right = x.toString() + "px"; if(x0!=xf){setTimeout("moveFB("+x+", "+xf+")", 10);} } </script> <div id="fb"> <div class="fbtab" onclick="showHideFB()"> </div> <div class="fbcontent"> <iframe src="https://www.facebook.com/plugins/page.php?href=https%3A%2F%2Fwww.facebook.com%2F108140433933376%2F&tabs=timeline&width=250&height=300&small_header=false&adapt_container_width=true&hide_cover=false&show_facepile=true&appId" width="250" height="300" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowtransparency="true" allow="encrypted-media"></iframe> <div style="text-align:right"> <a href="javascript:showHideFB()"> </a> </div> </div> </div> <script type="text/javascript"> var fb = document.getElementById("fb"); fb.style.right = (30-fb.offsetWidth).toString() + "px"; </script>

Left ( ဘယ်ဘက် )

<style type="text/css"> #fb{ position:fixed; top:50px; z-index:+1000; } * html #fb{position:relative;} .fbtab{ height:160px; width:40px; float:right; cursor:pointer; background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsuj9Ye9Q8xfuCEWRlt3Tf_0aLpWQho4S-g11Ex-XzoDpzFwUiXAWYGG38LRvnO07_v9OBl1L4l8AUznOiuj-WmbR-L6QGvhxharMVuKpvzO3tRygRBnPCBKCO11g-vaf0Fc2wA8HAmmN6/s1600/fb-left.png") no-repeat; } .fbcontent{ float:right; border:4px solid #3b5998; background:#F5F5F5; padding:10px; } </style> <script type="text/javascript"> function showHideFB(){ var fb = document.getElementById("fb"); var w = fb.offsetWidth; fb.opened ? moveFB(0, 30-w) : moveFB(20-w, 0); fb.opened = !fb.opened; } function moveFB(x0, xf){ var fb = document.getElementById("fb"); var dx = Math.abs(x0-xf) > 10 ? 5 : 1; var dir = xf>x0 ? 1 : -1; var x = x0 + dx * dir; fb.style.left = x.toString() + "px"; if(x0!=xf){setTimeout("moveFB("+x+", "+xf+")", 10);} } </script> <div id="fb"> <div class="fbtab" onclick="showHideFB()"> </div> <div class="fbcontent"> <iframe src="https://www.facebook.com/plugins/page.php?href=https%3A%2F%2Fwww.facebook.com%2F108140433933376%2F&tabs=timeline&width=250&height=300&small_header=false&adapt_container_width=true&hide_cover=false&show_facepile=true&appId" width="250" height="300" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowtransparency="true" allow="encrypted-media"></iframe> <div style="text-align:left"> <a href="javascript:showHideFB()"> </a> </div> </div> </div> <script type="text/javascript"> var fb = document.getElementById("fb"); fb.style.left = (30-fb.offsetWidth).toString() + "px"; </script>

0

0

Loading...