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

زوار ومتابعي المدونة الكرام 

السلام عليكم ورحمة الله وبركاته 

اليوم سوف نتعرف كود صندوق الفيس بوك عائم ومنبثق بشكل جديد أنه يطلع مرة واحدة لكل أيبي 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'>
  $(&#39;#popup-box&#39;).mspopup({
  &#39;autoOpen&#39;: 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 " باسم صفحتك على الفيس بوك .