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

الثلاثاء، 28 يوليو 2015

الرئيسية / New / طريقة إضافة صندوق إعجاب الفيس بوك منبثق ومظلل فى مدونة بلوجر

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

Unknown 7:32 ص 1 تعليق

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

أضف صندوق معجبين صفحتك على الفيسبوك عائم ومنزلق أوتوماتيكيا
طريقة اضافة صندوق معجبين الفيس بوك لمدونة بلوجر

هذا الصندوق ينبثق كما في الصورة التالية

من مميزات هذا الصندوق:

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

ننتقل إلى شرح تثبيت الكود:

1- توجه إلى لوحة التحكم البلوجر لمدونتك, و اختر تخطيط.

2- ثم إضافة أداة ثم اختر HTML/Javascript
والآن ألصق الكود التالي داخل المستطيل :

<style>

#fanback {

display:none;

background:rgba(0,0,0,0.8);

width:100%;

height:100%;

position:fixed;

top:0;

left:0;

z-index:99999;

}

#fan-exit {
width:100%;
height:100%;
}
#fanbox {
background:white;
width:420px;
height:270px;
position:absolute;
top:58%;
left:63%;
margin:-220px 0 0 -375px;
-webkit-box-shadow: inset 0 0 50px 0 #939393;
-moz-box-shadow: inset 0 0 50px 0 #939393;
box-shadow: inset 0 0 50px 0 #939393;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
margin: -220px 0 0 -375px;
}
#fanclose {
float:right;
cursor:pointer;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhp54AeklHsOD1Vpuvlkdb2ypm3xFFywA3S3b64re1IuDwC5PUmP3eQofByudIuk2hoCEuqR2u54yviTNr0nDX2Dok3_55ezAoIova4R-CBiJq4D87QSjoMw0p_hqf1kMyx9GC9EvGYdf9d/s1600/fanclose.png) repeat;
height:15px;
padding:20px;
position:relative;
padding-right:40px;
margin-top:-20px;
margin-right:-22px;
}
.remove-borda {
height:1px;
width:366px;
margin:0 auto;
background:#F3F3F3;
margin-top:16px;
position:relative;
margin-left:20px;
}
</style>

//<![CDATA[

jQuery.cookie = function (key, value, options) {

// key and at least value given, set 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(''));

}

// key and possibly options given, get 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>

jQuery(document).ready(function($){

if($.cookie('popup_user_login') != 'yes'){

$('#fanback').delay(100).fadeIn('medium');

$('#fanclose, #fan-exit').click(function(){
$('#fanback').stop().fadeOut('medium');
});
}
$.cookie('popup_user_login', 'yes', { path: '/', expires: 7 });
});
</script>

<div id='fanback'>
<div id='fan-exit'>
</div>
<div id='fanbox'>
<div id='fanclose'>
</div>
<div class='remove-borda'>
</div>
<iframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?

href=https://www.facebook.com/Elmohandis.Tech&width=402&height=255&colorscheme=light&show_faces=true&border_color=%23E2E2E2&stream=false&header=false'

style='border: none; overflow: hidden; margin-top: -19px; width: 402px; height: 230px;'></iframe>

</div>
</div>

و أخيرا قم بالبحث عن هذا الرابط https://www.facebook.com/Elmohandis.Tech داخل الكود و قم بتغيره الى رابط صفحتك على الفيس بوك
ثم قم بحفظ الاداه
الآن أصبح بإمكانك أنت و زوارك رؤية صندوق الفيس بوك هذا على مدونتك