السلام عليكم و رحمة الله تعالى و بركاته
تحية طيبة لاصدقاء و متتبعي شروحات مهووس على مدونة مطور بلوجر، درس اليوم سيكون حول إضافة نافذة منبتقة عليها صندوق الفيس بوك ، هذه الإضافة جميلة و فعالة و تعتبر من اهم الوسائل التي يلجأ اليها المدون ل لفت انتباه الزائر ، و كدلك هي اسرع وسيلة لجمع اكبر عدد للاعجاب بصفحتك على الفيس بوك
عند دخولك إلى المدونة ستنبثق لك نافذة بها صندوق عائم في وسط المدونة ، هذا الصندوق يحتوي على صفحتك على الفيس بوك
كما هو موضح على الصورة
تحية طيبة لاصدقاء و متتبعي شروحات مهووس على مدونة مطور بلوجر، درس اليوم سيكون حول إضافة نافذة منبتقة عليها صندوق الفيس بوك ، هذه الإضافة جميلة و فعالة و تعتبر من اهم الوسائل التي يلجأ اليها المدون ل لفت انتباه الزائر ، و كدلك هي اسرع وسيلة لجمع اكبر عدد للاعجاب بصفحتك على الفيس بوك
عند دخولك إلى المدونة ستنبثق لك نافذة بها صندوق عائم في وسط المدونة ، هذا الصندوق يحتوي على صفحتك على الفيس بوك
كما هو موضح على الصورة
How To Add POP UP Facebook Like Box For Blog & Website?
طريقة انشاء نافذة منبثقة بتقنية jQuery بها صندوق اعجابات الفيس بوك (Facebook) (J'aime/Like) .
اهم مميزات الإضافة
انها تظهر مرة واحدة للزائر، أي أنها لن تزعج متتبعيك و زوار مدونتك .
ملحوظة :
عندما تريد التعديل على الإضافة بما يناسبك ستظهر لك النافذة مرة واحدة فقط ، لأنها تعتمد على حفظ إيبي Ip لكي لا تظهر مرة ثانية.
طريقة تركيب الإضافة :
1. توجه إلى لوحة التحكم
2. ثم تخطيط ،
.3 إضافة أداة
HTML/Javascript
ثم أضف هذا الكود
<style>#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}#cboxOverlay{position:fixed; width:100%; height:100%;}#cboxMiddleLeft, #cboxBottomLeft{clear:left;}#cboxContent{position:relative;}#cboxLoadedContent{overflow:auto;}#cboxTitle{margin:0;}#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}.cboxPhoto{float:left; margin:auto; border:0; display:block;}.cboxIframe{width:100%; height:100%; display:block; border:0;}#cboxOverlay{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjORhxcYGqxK2PemzqfjQDx9PjRzefwur5aP-k9v2rFHu2iBqBe29QCSlPn0gx8rW8sd2rhTBT32kKwvZDFsUTNdM46KJMtCawbUdvf0Z4inaWbkwiM4UhVmlveBsdXRL5B2LxTa1953Hvm/s1600/overlay.png) repeat 0 0;}#colorbox{} #cboxTopLeft{width:21px; height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqbqfWDftgtUeAUNz9Eco5Ywrr547j8F9I2yDT7dUgUDw3dKS-vYLK75GfaQWAfyCbNoAvcXGLbNybITxkBaMXOICOo0sPm56GrL0QIjTIU_MFyFmRiSNoWWFjmJi2-cGT1-nNida4y2IZ/s1600/controls.png) no-repeat -101px 0;} #cboxTopRight{width:21px; height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqbqfWDftgtUeAUNz9Eco5Ywrr547j8F9I2yDT7dUgUDw3dKS-vYLK75GfaQWAfyCbNoAvcXGLbNybITxkBaMXOICOo0sPm56GrL0QIjTIU_MFyFmRiSNoWWFjmJi2-cGT1-nNida4y2IZ/s1600/controls.png) no-repeat -130px 0;} #cboxBottomLeft{width:21px; height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqbqfWDftgtUeAUNz9Eco5Ywrr547j8F9I2yDT7dUgUDw3dKS-vYLK75GfaQWAfyCbNoAvcXGLbNybITxkBaMXOICOo0sPm56GrL0QIjTIU_MFyFmRiSNoWWFjmJi2-cGT1-nNida4y2IZ/s1600/controls.png) no-repeat -101px -29px;} #cboxBottomRight{width:21px; height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqbqfWDftgtUeAUNz9Eco5Ywrr547j8F9I2yDT7dUgUDw3dKS-vYLK75GfaQWAfyCbNoAvcXGLbNybITxkBaMXOICOo0sPm56GrL0QIjTIU_MFyFmRiSNoWWFjmJi2-cGT1-nNida4y2IZ/s1600/controls.png) no-repeat -130px -29px;} #cboxMiddleLeft{width:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqbqfWDftgtUeAUNz9Eco5Ywrr547j8F9I2yDT7dUgUDw3dKS-vYLK75GfaQWAfyCbNoAvcXGLbNybITxkBaMXOICOo0sPm56GrL0QIjTIU_MFyFmRiSNoWWFjmJi2-cGT1-nNida4y2IZ/s1600/controls.png) left top repeat-y;} #cboxMiddleRight{width:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqbqfWDftgtUeAUNz9Eco5Ywrr547j8F9I2yDT7dUgUDw3dKS-vYLK75GfaQWAfyCbNoAvcXGLbNybITxkBaMXOICOo0sPm56GrL0QIjTIU_MFyFmRiSNoWWFjmJi2-cGT1-nNida4y2IZ/s1600/controls.png) right top repeat-y;} #cboxTopCenter{height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheRWOP6-PqXoa87jS1iKmoutdwi7Gkq60L8w60QH7_grJsKaLzCI86nyfNXNm2frFEEp_7NOSwTZElKxIsWIM_vrV5S3OoeNzkp_OH7FzCb05qmQNzFXJvxCnuqLQB8TYc2njE3jicyQbd/s1600/border.png) 0 0 repeat-x;} #cboxBottomCenter{height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheRWOP6-PqXoa87jS1iKmoutdwi7Gkq60L8w60QH7_grJsKaLzCI86nyfNXNm2frFEEp_7NOSwTZElKxIsWIM_vrV5S3OoeNzkp_OH7FzCb05qmQNzFXJvxCnuqLQB8TYc2njE3jicyQbd/s1600/border.png) 0 -29px repeat-x;} #cboxContent{background:#fff; overflow:hidden;} .cboxIframe{background:#fff;} #cboxError{padding:50px; border:1px solid #ccc;} #cboxLoadedContent{margin-bottom:28px;} #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;} #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;} #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;} #cboxPrevious{position:absolute; bottom:0; left:0; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqbqfWDftgtUeAUNz9Eco5Ywrr547j8F9I2yDT7dUgUDw3dKS-vYLK75GfaQWAfyCbNoAvcXGLbNybITxkBaMXOICOo0sPm56GrL0QIjTIU_MFyFmRiSNoWWFjmJi2-cGT1-nNida4y2IZ/s1600/controls.png) no-repeat -75px 0; width:25px; height:25px; text-indent:-9999px;} #cboxPrevious:hover{background-position:-75px -25px;} #cboxNext{position:absolute; bottom:0; left:27px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqbqfWDftgtUeAUNz9Eco5Ywrr547j8F9I2yDT7dUgUDw3dKS-vYLK75GfaQWAfyCbNoAvcXGLbNybITxkBaMXOICOo0sPm56GrL0QIjTIU_MFyFmRiSNoWWFjmJi2-cGT1-nNida4y2IZ/s1600/controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;} #cboxNext:hover{background-position:-50px -25px;} #cboxLoadingOverlay{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBDaQc6cG2jIra9uD3XzhxeeiUZCQ6GfWy6A3eJ1ompelRNwdOhogUGNMkU-gFlHtRDvpjdv0TDj-Paxl5stGtn3n1agctMv1sIMhiyRyC_9TtrAJySGnsUhTBKVElOqrfbCWtty9NhaDW/h120/loading.gif) no-repeat center center;} #cboxLoadingGraphic{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhBDaQc6cG2jIra9uD3XzhxeeiUZCQ6GfWy6A3eJ1ompelRNwdOhogUGNMkU-gFlHtRDvpjdv0TDj-Paxl5stGtn3n1agctMv1sIMhiyRyC_9TtrAJySGnsUhTBKVElOqrfbCWtty9NhaDW/h120/loading.gif) no-repeat center center;} #cboxClose{position:absolute; bottom:0; right:0; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqbqfWDftgtUeAUNz9Eco5Ywrr547j8F9I2yDT7dUgUDw3dKS-vYLK75GfaQWAfyCbNoAvcXGLbNybITxkBaMXOICOo0sPm56GrL0QIjTIU_MFyFmRiSNoWWFjmJi2-cGT1-nNida4y2IZ/s1600/controls.png) no-repeat -25px 0; width:25px; height:25px; text-indent:-9999px;} #cboxClose:hover{background-position:-25px -25px;}.cboxIE #cboxTopLeft,.cboxIE #cboxTopCenter,.cboxIE #cboxTopRight,.cboxIE #cboxBottomLeft,.cboxIE #cboxBottomCenter,.cboxIE #cboxBottomRight,.cboxIE #cboxMiddleLeft,.cboxIE #cboxMiddleRight { filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);}.cboxIE6 #cboxTopLeft{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcpI0iL9cGsRjoJ34tkWnPcnCP-rs18ZrBugFISfC3YCsxP2T9QxvMWkM3shidfXYmo0c7oj4TKLMTzN_MKBTU50KD4aacCMZF0uNb7-hzb3exLayP7c39A5GmlstZ6Fiv2kwUO6mwKS0j/s1600/borderTopLeft.png);}.cboxIE6 #cboxTopCenter{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhS6EM3-U1RlxHQmyPuj0vKYiB5WIvyME3kyPLHAFUfzexwZFsDHovLOZ9y72rCaSkfkKhdSMgXZ6BMmg4fCCzOCOyf7OymAjl5o8y6Jw3HMTT_zyR1QZRQ_716pOo8XxueAL0GD9xyeczr/s1600/borderTopCenter.png);}.cboxIE6 #cboxTopRight{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUu8euObj5vTkPCvxGL6f6fEC6PcjeFL-XuImgk5LcfEt-4s8LlaPY2xYCk0xHN57TL5jS37EPIJDp3mbHUytRU96eBKmySaYZiKboIiieUzH5OCLZY2hEeTpaSwy2NxdqMrgyaPMONunV/s1600/borderTopRight.png);}.cboxIE6 #cboxBottomLeft{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUu8euObj5vTkPCvxGL6f6fEC6PcjeFL-XuImgk5LcfEt-4s8LlaPY2xYCk0xHN57TL5jS37EPIJDp3mbHUytRU96eBKmySaYZiKboIiieUzH5OCLZY2hEeTpaSwy2NxdqMrgyaPMONunV/s1600/borderTopRight.png);}.cboxIE6 #cboxBottomCenter{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9_vSvw-Dj0lSGF9qzjTTm4kT9CA4WOM5SXp-QxBW7NZP8StdfKaYkj0SCB9sVJJXVPrwed9nxhujor1an3sMNQj_qNHJJsgJgdQ-9dlyHQFxDmVrNeGKg7TOKdRwyBcM3aYEou3cRD_K0/s1600/borderBottomCenter.png);}.cboxIE6 #cboxBottomRight{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSN2DnOyAMd_5gAArtPp8RJtXF2VAkiOcXdStNQijvnNSkAnlh3WX1UAj_MBUKk-kmlOiic9C4YmO1tIkwRm6WoRUnSbTCwASKDNU2vsu4cFwipceVpmoQIkRQCbJFTB1b22idGXXiT50N/s1600/borderBottomRight.png);}.cboxIE6 #cboxMiddleLeft{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnlDMgK9S1noOcU32sRGgqajnRmIK6vCY52mIYQ6N1RLXLDXGGyt_cQTdRbBFDncb-F7DabrNHACVI66es_vOgM-7HKLnLQA3VZxeYhf3JVLd0ECT-Sfq0hFoUBZgUbB82h5sAbdpPrBey/s1600/borderMiddleLeft.png);}.cboxIE6 #cboxMiddleRight{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJHUNmPE5hgu7dGl2V-XMDme2jYQ4Yu_LKNvSRKnWA5J8-xdSUq9xiOIjBvtVm89gyBkh0jtekUL2g0ly-9blYDwoYQK7TOSaxaP7E-Rq1j2BIJ8tYMhEdhBziwOGJunoGU-sKwxEAsDEF/s1600/borderMiddleRight.png);}.cboxIE6 #cboxTopLeft,.cboxIE6 #cboxTopCenter,.cboxIE6 #cboxTopRight,.cboxIE6 #cboxBottomLeft,.cboxIE6 #cboxBottomCenter,.cboxIE6 #cboxBottomRight,.cboxIE6 #cboxMiddleLeft,.cboxIE6 #cboxMiddleRight { _behavior: expression(this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('"')[1], this.style.background = "none", this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + this.src + ", sizingMethod='scale')");}#subscribe {font: 12px/1.2 Arial,Helvetica,san-serif; color:#666;}#subscribe a,#subscribe a:hover,#subscribe a:visited {text-decoration:none;}.box-tagline {color: #999;margin: 0;text-align: center;}#subs-container {padding: 35px 0 30px 0;position: relative;}a:link, a:visited {border:none;}.demo {display:none;}</style><script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script><script src="http://yourjavascript.com/3093182329/btt_jquery.colorbox-min.js"></script><script type="text/javascript">jQuery(document).ready(function(){if (document.cookie.indexOf('visited=true') == -1) {var fifteenDays = 1000*60*60*24*7;var expires = new Date((new Date()).valueOf() + fifteenDays);document.cookie = "visited=true;expires=" + expires.toUTCString();$.colorbox({width:"400px", inline:true, href:"#subscribe"});}});</script><!-- This contains the hidden content for inline calls --><div style='display:none'><div id='subscribe' style='padding:10px; background:#fff;'><center><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjt1bhVnXHQnADuQtuhpoSrjs4uTfdr5wzcg6SOLKveV0sx0xDCpORPTSEErj8pyuxjgvF_O8vx7deY_K2sCrWSK_JhX5c06ZyL46VGlyvcHHOKP782iEJmISK50YJknT4wEaybISTYWN6k/s1600/BecomeFanOnFacebook.jpg" width:300px; height:150px;"/></center><center><iframe src="//www.facebook.com/plugins/likebox.php?href= info3arab &width=300&colorscheme=light&show_faces=true&border_color=%23ffffff&stream=false&header=false&height=258" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:258px;" allowtransparency="true"></iframe></center><p style=" float:right; margin-right:15px; font-size:6px;" >Powered By <a style=" font-size:6px; color:#3B78CD; text-decoration:none;" href="http://www.bloggertipsandtricks.net/2012/04/jquery-popup-facebook-like-box-v5.html" target='_blank'>Blogger Tips and Tricks</a></p></div></div>
قم بتغيير info3arab باسم صفحتك فيس بوك
اي اسئلة او استفسار نحن نهن الاشارة