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

بسم الله الرحمن الرحيم

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

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

واضافة عبر عن اجبار الزائر علي الاعجاب بمدونتك بصفحتك علي الفيس بوك ، والاضافة تزيد عدد معجبين صفحتك الي حد بعيد .

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

ولتطبيق الاضافةعلي مدونتك تابح الشرح

نذهب إلى لوحة تحكم مدونتك وتقوم بالضغط على التخطيط ثم على ،إضافة أداة ؛ ثم بعد ذلك تختار، html/java script وتقوم بوضع هذا الكودفي المربع

الكود

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; 
    cursor:pointer;}
        </style>
    <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js'></script> 
    <script src="http://mybloggertricks.googlecode.com/files/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*30; 
           var expires = new Date((new Date()).valueOf() + fifteenDays); 
           document.cookie = "visited=true;expires=" + expires.toUTCString(); 
       $.colorbox({width:"400px", inline:true, href:"#subscribe"}); 
           } 
    }); 
    </script> 
      
      
            <div style='display:none'>
 
           <div id='subscribe' style='padding:10px; background:#fff;'>
 
                <h3 class="box-title">
تابع جديد المواضيع عبر فيسبوك بالضغط على أعجبني<center>
<p style="line-height:3px;" >
▼</p>
</center>
</h3>
<center>
    <iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fرابط الفيس&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>
<div class="box-title1 ">
    <center>
 
    <h3 style="color:#F66303;">
كما يمكنك التوصل بآخر المنشورات عبر الإيميل:</h3>
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=عنوانك الخاص بالتغذية', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input gtbfieldid="10" class="enteryouremail" name="email" value="Enter your email here..." onblur="if (this.value == '') {this.value = 'Enter your email here...';}" onfocus="if (this.value == 'Enter your email here...') {this.value = '';}" type="text" /><input value="عنوانك الخاص بالتغذية" name="uri" type="hidden" /><input value="Submit" class="submitbutton" type="submit" /></form>
</center>
</div>
 
        <p style=" float:right;  margin-right:35px;  font-size:9px;" >
Powered By <a style=" font-size:9px; color:#3B78CD; text-decoration:none;" href="http://www.mybloggertricks.com">Blogger Widgets</a></p>
</div>
</div>