How To Add CSS-LightBox POP-UP Facebook Like Box To Blogger

ဒီေန႔တင္တဲ့ ပုိ႔(စ္)ေလးကေတာ့ CSS-LightBox POP-UP Facebook Like Box Widget ေလးပါ။ အရမ္းေကာင္းပါတယ္။ ဒီ Cond ေလးရဲ႕ လုပ္ေဆာင္ခ်က္ကေတာ့ မိမိ၏ဘေလာ့ေလး၀င္တဲ့ အခါတားျမစ္ခ်က္ေလးလုိ မိမိ၏ Facebook Like Box ေလးထြက္လာ/ေပၚလာမွာပါ။ ႀကဳိက္ၾကမယ္လုိ႔လည္းေမွ်ာ္လင့္ပါတယ္။ ေအာက္မွာ Demo သြားၾကည့္လုိပရေအာင္ လင့္(ခ္) နဲ႔ Cond လည္းေပးထားပါတယ္။

Preview

၁။Sign In Blogger

၂။ Layout

၃။ Add a Gadget

၄။ HTML/JavaScript

၅။ ေအာက္က ေပးထာတဲ့ Cond ေလးကုိထည့္ေပးလုိက္ပါ။

<style type="text/css">



/***********************************************

* CSS POP-UP With Light Box Effect- © Mr Thangming (www.mrthangming.blogspot.com)

* This notice must stay intact for use.

* Visit http://www.mrthangming.blogspot.com/ for full source code.

***********************************************/

* html #exestylepopupdiv {position:absolute;}

#exestylepopupdiv {display:block; top:0px; left:0px; width:100%; height:100%; position:fixed; background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDebaW-dINq2QavHlVjAf5L9_lAV7AuSTVwGEc4mImmaIcklVYRAvXfAkJdYuc-1I2Wel6Iz0z6sRnr-UpQs73K3ZZgI11_IlVGeDWgtTFICWFvLtN-rFvUEoEBcGj8q-t02WXw6pEPw/s128/exeideasopacity0.5.png');margin:0; overflow-y:auto;}

#exestylepopup {background-color: #fff; overflow:none;}

.exestylepopup {width:350px; height:380px; position:fixed; top:45%; left:50%; margin-top:-210px; margin-left:-200px; border: 10px solid 0; padding: 20px;}

.exe-title {background:#fff;color: ;font-size: 16px !important;font-weight:bold;margin:5px 0;border:20px solid 0;padding:10px;line-height:25px; font-family:arial !important;}

</style>

<!--[if lte IE 6]>

<style type="text/css">

/*<![CDATA[*/

html {overflow-x:auto; overflow-y:hidden;}

/*]]>*/

</style>

<![endif]-->

<div id="exestylepopupdiv">

<div id="exestylepopup" class="exestylepopup">

<center><h3 class="exe-title">Receive All Updates Via Facebook. Just Click the Like Button Below...</h3></center>

<center>

<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Ftmblogtechnology&amp;width=300&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23ffffff&amp;stream=false&amp;header=false&amp;height=258" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:258px;" allowtransparency="true"></iframe>

</center>

<br />

<center style=" float:right; margin-right:35px; font-size:8px;" >Powered By <a style=" font-size:10px; color:#FF0000; text-decoration:none;" href="http://mrthangming.blogspot.com/2012/10/how-to-add-css-lightbox-pop-up-facebook.html">MrThangMing</a></center>

<center style=" float:left; margin-left:35px; font-size:9px;cursor:pointer;" ><a style=" font-size:13px; color:#0B0B61; text-decoration:none;" onmouseup="document.getElementById('exestylepopupdiv').style.display='none'">Skip To Continue</a></center>

</div>

</div>

ထည့္ၿပီးရင္ Save ကုိနုိပ္လုိပါ။

မွတ္ခ်က္။   ။ www.facebook.com%2Ftmblogtechnology   ေနရာမွာ tmblogtechnology   ကုိ မိမိ၏ Facebook နဲ႔ လဲေပးလုိက္ပါ။