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

الكاتب : Salah Nassih التاريخ : 3:42:00 م

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

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

1 : اذهب الى القالب و ابحث عن الوسم </head>  

2 : أضف الكود التالي أسفله لأنه مهم جدا

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.js"></script>

                                                                             الشكل : 

3 : أضف أداة html java script جديدة و ضع داخلها هذا الكود

<style type="text/css"> /*********************************************** * CSS POP-UP With Light Box Effect- © New Facebook Tips Trick (http://new-facebook-tipstricks.blogspot.com/) * This notice must stay intact for use. * Visit http://new-facebook-tipstricks.blogspot.com/ for full source code. ***********************************************/ * html #exestylepopupdiv {position:absolute;} #exestylepopupdiv {z-index: 999999;display:block; top:0px; left:0px; width:100%; height:100%; position:fixed; background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVrBPnIJwBg3gI790l7ulKoOzHgLRZ28YimENfZMFDZ8rEjENY4qc6kgYhBfkjBU_e6e5VeovZ3V-niAgUWOPYq5qdhG8T5_K-aWTd96BPgj3OmAG514kYaGiSSN6AfQo8O55UXjJJfw/s128/exeideasopacity0.5.png');margin:0; overflow-y:auto;} #exestylepopup {background-color: #fff; overflow:none;} .exestylepopup {width:400px; height:300px; position:fixed; top:50%; left:50%; margin-top:-150px; margin-left:-200px;} </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 style="color:#000;cursor:pointer;float:right;margin-right:-20px;margin-top:-20px;" onmouseup="document.getElementById('exestylepopupdiv').style.display='none'"> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEit0FcEV7zpKYPN6Drm5mrkFhG4wt0tn5-L4wYNtnKdZ-htECUd4nijRiFWvk94434ff7Ay3E6T22p_2RkRG_nMeFJi5GODBL-RwwZ5TfRdCNjKmh26pcPuJKwMTzTexrPmETFIjYTj0w/s40/exeideasclose.png"/> </center> <div id="exestylepopup" class="exestylepopup"> <center style="color:#000;cursor:pointer;float:right;margin-right:-20px;margin-top:-20px;" onmouseup="document.getElementById('exestylepopupdiv').style.display='none'"> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEit0FcEV7zpKYPN6Drm5mrkFhG4wt0tn5-L4wYNtnKdZ-htECUd4nijRiFWvk94434ff7Ay3E6T22p_2RkRG_nMeFJi5GODBL-RwwZ5TfRdCNjKmh26pcPuJKwMTzTexrPmETFIjYTj0w/s40/exeideasclose.png" /> </center> <iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FXXXXX&width=400&height=300&colorscheme=light&show_faces=true&border_color&stream=false&header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:390px; height:260px;" allowtransparency="true"></iframe> </div> </div> </div>

أتمنى نجاح الطريقة معكم أتمنى أن تنال الحلقة اعجابكم الى اللقاء و السلام عليكم و رحمة الله .