اضافة صندوق اعجاب الفيسبوك الأحترافي بنافذة منبثقة

اليوم سأشرح لكم طريقة سهلة لأضافة صندوق اعجاب الفيسبوك بنافذة منبثفة مع علامة الأغلاق ، وذلك باضافة أداة جافا سكربت الى مدونات بلوجر  facebook pop up like box وبشكل احترافي بسيط وجميل بحيث تظهر مرة واحدة فقط عند دخول الزائر الى مدونتك.

اقرأ أيضا : اداة انشاء الزر أعجبني واضافته الى المدونة باشكال مختلفة

يعتبر صندوق اعجاب الفيسبوك المنبثق من أفضل الطرق للترويج لصفحة الفيسبوك الخاصة بك والحصول على مزيد من المعجبين الذين يدخلون مدونتك ، وهذه الأضافة لن تسبب أي ازعاج للزائر لأنها سوف تظهر مرة واحدة فقط عند دخول الزائرالى مدونتك و لا تظهر له مرة اخرى من نفس الجهاز.

طريقة اضافة صندوق اعجاب الفيسبوك بنافذة منبثقة

الطريقة سهلة جدا فقط انسخ الكود أدناه ثم توجه الى لوحة تحكم بلوجر ثم تخطيط ثم اضافة أداة جديدة في أي مكان واستبدل هذا الرابط :  www.facebook.com/kalabaniblog   ستجده في نهاية الكود ، برابط صفحتك ثم حفظ  ، واستمتع بإضافة جميلة وبسيطة :

<style scoped='' type='text/css'> 
#fb-fanbox {display:none;background:rgba(0,0,0,0.9);width:100%;height:100%;position:fixed;top:0;left:0;z-index:99999;-webkit-transform:translateZ(0);}
#fb-boxclose {width:100%;height:100%;-webkit-transform:translateZ(0);}
#fb-boxview {background:#fff;border:8px solid #03a9f4;width:340px;height:230px;position:absolute;top:33%;left:37%;border-radius:3px;}
#fb-closebox {float:right;cursor:pointer;position:absolute;right:-1px;top:-2px;z-index:2;}
#fb-closebox:before {content:"CLOSE";padding:5px 8px;background:#03a9f4;color:#fff;font-weight:normal;font-size:10px;font-family:inherit;}
#fb-boxlink,#fb-boxlink a.visited,#fb-boxlink a,#fb-boxlink a:hover {color:#aaaaaa;font-size:9px;text-decoration:none;text-align:center;padding:5px;}
</style>
<script type='text/javascript'>
//<![CDATA[
jQuery.cookie = function (key, value, options) {
// Pengaturan cookie
if (arguments.length > 1 && String(value) !== "[object Object]") {
options = jQuery.extend({}, options);
if (value === null || value === undefined) {
options.expires = -1;
}
if (typeof options.expires === 'number') {
var days = options.expires, t = options.expires = new Date();
t.setDate(t.getDate() + days);
}
value = String(value);
return (document.cookie = [
encodeURIComponent(key), '=',
options.raw ? value : encodeURIComponent(value),
options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE
options.path ? '; path=' + options.path : '',
options.domain ? '; domain=' + options.domain : '',
options.secure ? '; secure' : ''
].join(''));
}
// Dapatkan cookie
options = value || {};
var result, decode = options.raw ? function (s) { return s; } : decodeURIComponent;
return (result = new RegExp('(?:^|; )' + encodeURIComponent(key) + '=([^;]*)').exec(document.cookie)) ? decode(result[1]) : null;
};
//]]>
</script>
<script type='text/javascript'>
jQuery(document).ready(function($){
if($.cookie('popup_facebook_box') != 'yes'){
$('#fb-fanbox').delay(3000).fadeIn('fast');
$('#fb-closebox, #fb-boxclose').click(function(){
$('#fb-fanbox').stop().fadeOut('fast');
});
}
$.cookie('popup_facebook_box', 'yes', { path: '/', expires: 7 });
});
</script>
<div id='fb-fanbox'>
<div id='fb-boxclose'>
</div>
<div id='fb-boxview'>
<div id='fb-closebox'>
</div>
<iframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?
href=https://www.facebook.com/kalabaniblog&width=402&height=255&colorscheme=light&show_faces=true&show_border=false&stream=false&header=false'
style='border:none;overflow:hidden;width:339px;height:200px;'></iframe>
</div>
</div>