زوار ومتابعي المدونة الكرام
السلام عليكم ورحمة الله وبركاته
اليوم سوف نتعرف كود صندوق الفيس بوك عائم ومنبثق بشكل جديد أنه يطلع مرة واحدة لكل أيبي IP ، وهذه الإضافة في قمة الروعة وتضيف إلى مدونتك لمسة جمالية أحترافية .
- طريقة التركيب :
1- ادخل إلى مدونتك ثم اختر لوحة التحكم .
2- من لوحة التحكم اختر قالب ثم اضغط على تحرير قالب HTML
3- ابحث عن الوسم :
]]></b:skin>
4- ضع الكود التالي فوقه .
/*=============== CSS Popup Like box by homeblog7.blogspot.com ======================*/
.mspopup{position:fixed;top:0;left:0;right:0;bottom:0;z-index:90000;background:rgba(0,0,0,.6);overflow-x:hidden;overflow-y:auto;display:none}
.mspopup-container{background:#fff url(http://i.imgur.com/2twQjiN.gif) no-repeat 50% 50%;padding:0;font-size:14px;height:236px;position:fixed;top:50%;left:50%;z-index:90001;-webkit-box-shadow:0 0 15px 0 rgba(50,50,50,0.8);transform:translateY(-50%) translateX(-50%)}
.mspopup .mspopup-close{position:absolute;top:9px;right:20px;font-weight:700;font-family:Verdana;font-size:18px;cursor:pointer;color:#fff}
.mspopup .mspopup-close:hover{color:#535353}
.mspopup .mspopup-header{font-size:20px;padding:10px;text-align:center;color:#fff;font-family:Open Sans;background-color:#3B5998;text-shadow:1px 2px 4px #838383}
.mspopup .mspopup-header p{font-size:10px;padding:0;margin:0;font-weight:400;text-transform:initial}
.mspopup .mspopup-content{padding:10px 20px}
5- بعد ذلك ابحث عن الوسم :
</body>
6- ضع الكود التالي فوقه .
<script src='https://googledrive.com/host/0BxFbqjck0GDdNHFGdXFERjhyVzQ' type='text/javascript'/>
<script type='text/javascript'>
$('#popup-box').mspopup({
'autoOpen': true
});
</script>
7-اذهب إلى تخطيط ثم اختر إضافة أداة : HTML/JavaScript
8- ضع الكود التالي في صندوق الأداة ثم احفظ .
<div id="popup-box" class="mspopup">
<div class="mspopup-container">
<div class="mspopup-header">
<div class="mspopup-close" data-dismiss="mspopup">x</div>
انضم إلى صفحتنا على الفيس بوك
<p> واحصل على آخر التحديثات مجاناً</p>
</div>
<div class="mspopup-content">
<div class="fb-page" data-href="https://www.facebook.com/ChristiaUnion" data-width="400" data-height="300" data-small-header="true" data-adapt-container-width="true" data-hide-cover="true" data-show-facepile="true" data-show-posts="false"><div class="fb-xfbml-parse-ignore"></div></div>
</div>
</div>
</div>
- استبدل اسم صفحتنا على الفيس بوك " ChristiaUnion " باسم صفحتك على الفيس بوك .
0 Comments:
إرسال تعليق