كود code نافدة منبثقة لصندوق إعجاب الفيسبوك

[admin]

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

اليوم اود ان اقوم بعرض كود code مهم لاصحاب المدونات
وخصيصا الذين يتوفرون على صفحات على الفيسبوك

لهذا اود ان اضع بين ايديكم طرقة لإضافة نافذة منبثقة بتقنية jQuery
في مدونتك تقوم بـ(ارغام)الزائر على الاعجاب
على صفحت مدونتك على الفيسبوك وبهذا تقوم بالحصول على عدد ازيد من المعجبين ،،

لمعرفة الطريقة تابع معي الشرح طريقة :

نذهب إلى تصميم |عناصر الصفحة| إضافة أداة HTML javascript
ثم نقوم بلصف الكود code التالي في الصندوق :

رمز Code:
<style> /* Jquery Facebook Likebox Popup Version 2.0 by MBT MyBloggerTricks.com */ #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%;} #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursorointer;} .cboxPhoto{float:left; margin:auto; border:0; display:block;} .cboxIframe{width:100%; height:100%; display:block; border:0;} /* User Style: Change the following styles to modify the appearance of ColorBox. They are ordered & tabbed in a way that represents the nesting of the generated HTML. */ #cboxOverlay{background:#000;opacity:0.5 !important;} #colorbox{ box-shadow:0 0 15px rgba(0,0,0,0.4); -moz-box-shadow:0 0 15px rgba(0,0,0,0.4); -webkit-box-shadow:0 0 15px rgba(0,0,0,0.4); } #cboxTopLeft{width:14px; height:14px; background:url(http://imgboot.com/images/cybersidh/controls.png) no-repeat 0 0;} #cboxTopCenter{height:14px; background:url(http://imgboot.com/images/cybersidh/border.png) repeat-x top left;} #cboxTopRight{width:14px; height:14px; background:url(http://imgboot.com/images/cybersidh/controls.png) no-repeat -36px 0;} #cboxBottomLeft{width:14px; height:43px; background:url(http://imgboot.com/images/cybersidh/controls.png) no-repeat 0 -32px;} #cboxBottomCenter{height:43px; background:url(http://imgboot.com/images/cybersidh/border.png) repeat-x bottom left;} #cboxBottomRight{width:14px; height:43px; background:url(http://imgboot.com/images/cybersidh/controls.png) no-repeat -36px -32px;} #cboxMiddleLeft{width:14px; background:url(http://imgboot.com/images/cybersidh/controls.png) repeat-y -175px 0;} #cboxMiddleRight{width:14px; background:url(http://imgboot.com/images/cybersidh/controls.png) repeat-y -211px 0;} #cboxContent{background:#fff; overflow:visible;} #cboxLoadedContent{margin-bottom:5px;} #cboxLoadingOverlay{background:url(http://imgboot.com/images/cybersidh/loadingbackground.png) no-repeat center center;} #cboxLoadingGraphic{background:url(http://imgboot.com/images/cybersidh/loading.gif) no-repeat center center;} #cboxTitle{position:absolute; bottom:-25px; left:0; text-align:center; width:100%; font-weight:bold; color:#7C7C7C;} #cboxCurrent{position:absolute; bottom:-25px; left:58px; font-weight:bold; color:#7C7C7C;} #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{position:absolute; bottom:-29px; background:url(http://imgboot.com/images/cybersidh/controls.png) no-repeat 0px 0px; width:23px; height:23px; text-indent:-9999px;} #cboxPrevious{left:0px; background-position: -51px -25px;} #cboxPrevious.hover{background-position:-51px 0px;} #cboxNext{left:27px; background-position:-75px -25px;} #cboxNext.hover{background-position:-75px 0px;} #cboxClose{right:0; background-position:-100px -25px;} #cboxClose.hover{background-position:-100px 0px;} .cboxSlideshow_on #cboxSlideshow{background-position:-125px 0px; right:27px;} .cboxSlideshow_on #cboxSlideshow.hover{background-position:-150px 0px;} .cboxSlideshow_off #cboxSlideshow{background-position:-150px -25px; right:27px;} .cboxSlideshow_off #cboxSlideshow.hover{background-position:-125px 0px;} /*-----------------------------------------------------------------------------------*/ /* Facebook Likebox popup For Blogger Version 2.0 /*-----------------------------------------------------------------------------------*/ #subscribe { font: 12px/1.2 Arial,Helvetica,san-serif; color:#666; } #subscribe a, #subscribe a:hover, #subscribe a:visited { text-decoration:none; } .box-title { color: #F66303; font-size: 18px !important; font-weight: bold; margin: 10px 0; border:1px solid #ddd; -moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px; box-shadow: 5px 5px 5px #CCCCCC; padding:10px; line-height:25px; font-family:arial !important; } .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; } /* ---------MBT Subscribe Form---------- */ .box-title1 { border:1px solid #ddd; -moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px; box-shadow: 5px 5px 5px #CCCCCC; padding:10px; margin: 10px 0; } .enteryouremail{ background: #fff !important; border: 1px solid #d2d2d2; padding: 0px 8px 0px 8px; color: #a19999; font-size: 12px; height: 25px; width: 165px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; margin:0px; } .submitbutton{ background:#F66303; border: 1px solid #F66303; text-shadow: 1px 1px 1px #333; box-shadow: 3px 3px 3px #666; font:bold 12px Arial, sans-serif; color: #fff; height: 25px; padding: 0 12px 0 12px; margin: 0 0 0 5px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; cursorointer;} </style> <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js'></script> <script src=&quot;http://mybloggertricks.googlecode.com/files/jquery.colorbox-min.js&quot;></script> <script type=&quot;text/javascript&quot;> jQuery(document).ready(function(){ if (document.cookie.indexOf('visited=true') == -1) { var fifteenDays = 1000*60*60*24*30; var expires = new Date((new Date()).valueOf() + fifteenDays); document.cookie = &quot;visited=true;expires=&quot; + expires.toUTCString(); $.colorbox({width:&quot;400px&quot;, inline:true, href:&quot;#subscribe&quot;}); } }); </script> <div style='display:none'> <div id='subscribe' style='padding:10px; background:#fff;'> <h3 class=&quot;box-title&quot;>تابع جديد المواضيع عبر فيسبوك بالضغط على أعجبني<center><p style=&quot;line-height:3px;&quot; >▼</p></center></h3> <center> <iframe src=&quot;//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fإسم صفحتك على فيسبوك&amp;width=300&amp;colorscheme=light&amp;show_face s=true&amp;border_color=%23ffffff&amp;stream=false &amp;header=false&amp;height=258&quot; scrolling=&quot;no&quot; frameborder=&quot;0&quot; style=&quot;border:none; overflow:hidden; width:300px; height:258px;&quot; allowtransparency=&quot;true&quot;></iframe> </center> <div class=&quot;box-title1 &quot;> <center> <h3 style=&quot;color:#F66303;&quot;>كما يمكنك التوصل بآخر المنشورات عبر الإيميل:</h3> <form action=&quot;http://feedburner.google.com/fb/a/mailverify&quot; method=&quot;post&quot; target=&quot;popupwindow&quot; onsubmit=&quot;window.open('http://feedburner.google.com/fb/a/mailverify?uri=عنوانك الخاص بالتغذية', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true&quot;><input gtbfieldid=&quot;10&quot; class=&quot;enteryouremail&quot; name=&quot;email&quot; value=&quot;Enter your email here...&quot; onblur=&quot;if (this.value == '') {this.value = 'Enter your email here...';}&quot; onfocus=&quot;if (this.value == 'Enter your email here...') {this.value = '';}&quot; type=&quot;text&quot; /><input value=&quot;عنوانك الخاص بالتغذية&quot; name=&quot;uri&quot; type=&quot;hidden&quot; /><input value=&quot;Submit&quot; class=&quot;submitbutton&quot; type=&quot;submit&quot; /></form> </center> </div> <!--Please Do not Remove the Credits --> <p style=&quot; float:right; margin-right:35px; font-size:9px;&quot; >Powered By <a style=&quot; font-size:9px; color:#3B78CD; text-decoration:none;&quot; href=&quot;http://www.mybloggertricks.com&quot;>Blogger Widgets</a></p> </div> </div>

قم بتغيير ما بالاحمر باسم صفحتك على الفيسبوك
وما بالازرق بعنوان التغذية الخاصة بموقعك مثل :**4We-eb





المصدر: كود code نافدة منبثقة لصندوق إعجاب الفيسبوك | **4We-eb

©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى©