Final Look of Your Pop up Box
Who make advance this Widget
(1). It's work With all the Browser
(2). Cool & attractive Design
(3). Load faster Compare to other Blogger Widget
(4). Not Effect to your Site Speed
(5). POP-UP With LightBox Effect
(6). Work With All The blogging Platform
(2). Cool & attractive Design
(3). Load faster Compare to other Blogger Widget
(4). Not Effect to your Site Speed
(5). POP-UP With LightBox Effect
(6). Work With All The blogging Platform
How to install in blogger platform:
(1). Go to- Blogger.com and Login your Account
(2). Open Your Blog where you Get This Widget.
(3). Go to under the Option Layout
(4). & Click to +Add a Gadget Option
(5). Now Scroll To "HTML-JAVASCRIPT"
(6). Click "+" Icon To Add It
(7). Now Copy The Below Code And Paste It To There.
(8). Leave The Title Empty.
(9). Click Save, Now You Are Done.
(2). Open Your Blog where you Get This Widget.
(3). Go to under the Option Layout
(4). & Click to +Add a Gadget Option
(5). Now Scroll To "HTML-JAVASCRIPT"
(6). Click "+" Icon To Add It
(7). Now Copy The Below Code And Paste It To There.
(8). Leave The Title Empty.
(9). Click Save, Now You Are Done.
Pop out Box Code:
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js'></script>
<script src="http://24blogger-com.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:"#exestylepopups"});
}
});
</script>
<style type="text/css">
/*
ColorBox v1.3.16
(Copyright (c) 2011 Jack Moore - jack@colorpowered.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{cursor:pointer}.cboxPhoto{float:left;margin:auto;border:0;display:block}.cboxIframe{width:100%;height:100%;display:block;border:0}#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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDTPWQgpgzsdNm9JGN5tN17LF5Phf4Mynxea-Kh4qT3r74vVwCGG-4SKNaRqq8PfxFLawz3kc6_P68cNvlk4Oh03G5VRL0lBW_Rq6Yoe41ifEhU9OIHtVDYpt5gQcGT3lDdm2llzN_PP0/s1600/controls.png) no-repeat 0 0}#cboxTopCenter{height:14px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvGMMRAbDPIlRFfpIgSeHDv6AxXhobZhoTo27xSeLIdtywZkDJtT5xPml5-NxpLIuIcA-SL-whrBITjJIVUh3UGayHo0WL4eex_7qS4W5k1gIcyAqoGFIS7Da2PJ76nsyVCbGacoNprtc/s400/border.png) repeat-x top left}#cboxTopRight{width:14px;height:14px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDTPWQgpgzsdNm9JGN5tN17LF5Phf4Mynxea-Kh4qT3r74vVwCGG-4SKNaRqq8PfxFLawz3kc6_P68cNvlk4Oh03G5VRL0lBW_Rq6Yoe41ifEhU9OIHtVDYpt5gQcGT3lDdm2llzN_PP0/s1600/controls.png) no-repeat -36px 0}#cboxBottomLeft{width:14px;height:43px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDTPWQgpgzsdNm9JGN5tN17LF5Phf4Mynxea-Kh4qT3r74vVwCGG-4SKNaRqq8PfxFLawz3kc6_P68cNvlk4Oh03G5VRL0lBW_Rq6Yoe41ifEhU9OIHtVDYpt5gQcGT3lDdm2llzN_PP0/s1600/controls.png) no-repeat 0 -32px}#cboxBottomCenter{height:43px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvGMMRAbDPIlRFfpIgSeHDv6AxXhobZhoTo27xSeLIdtywZkDJtT5xPml5-NxpLIuIcA-SL-whrBITjJIVUh3UGayHo0WL4eex_7qS4W5k1gIcyAqoGFIS7Da2PJ76nsyVCbGacoNprtc/s400/border.png) repeat-x bottom left}#cboxBottomRight{width:14px;height:43px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDTPWQgpgzsdNm9JGN5tN17LF5Phf4Mynxea-Kh4qT3r74vVwCGG-4SKNaRqq8PfxFLawz3kc6_P68cNvlk4Oh03G5VRL0lBW_Rq6Yoe41ifEhU9OIHtVDYpt5gQcGT3lDdm2llzN_PP0/s1600/controls.png) no-repeat -36px -32px}#cboxMiddleLeft{width:14px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDTPWQgpgzsdNm9JGN5tN17LF5Phf4Mynxea-Kh4qT3r74vVwCGG-4SKNaRqq8PfxFLawz3kc6_P68cNvlk4Oh03G5VRL0lBW_Rq6Yoe41ifEhU9OIHtVDYpt5gQcGT3lDdm2llzN_PP0/s1600/controls.png) repeat-y -175px 0}#cboxMiddleRight{width:14px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDTPWQgpgzsdNm9JGN5tN17LF5Phf4Mynxea-Kh4qT3r74vVwCGG-4SKNaRqq8PfxFLawz3kc6_P68cNvlk4Oh03G5VRL0lBW_Rq6Yoe41ifEhU9OIHtVDYpt5gQcGT3lDdm2llzN_PP0/s1600/controls.png) repeat-y -211px 0}#cboxContent{background:#fff;overflow:visible}#cboxLoadedContent{margin-bottom:5px}#cboxLoadingOverlay{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheApr-ExNXzHbfaAwfXBi0YET12w2CUYErQdr1HSVf0zVcAc63sONQJgEFcK6Ax8qefLEwNoHvCaUUWFcgY26xmVvii6QRTVnQ5vBYmgzst9Q8JWNHsj0KVauyYKILUsYFoPyCsJrT9nI/s400/loadingbackground.png) no-repeat center center}#cboxLoadingGraphic{https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDjwpzDL9lcSXkPHwVA9PwcMIKeyrvODKfCBXrHSlh9I_sQc-i3d3qkFUAxPfMyiGfzfnVZp7lHIsWFcp1rn4tBgbH1oVsafvzCYKlDP0_rlGqby7IUbNuvdNCUhXTa__JV-t6yuzvuGU/s400/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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDTPWQgpgzsdNm9JGN5tN17LF5Phf4Mynxea-Kh4qT3r74vVwCGG-4SKNaRqq8PfxFLawz3kc6_P68cNvlk4Oh03G5VRL0lBW_Rq6Yoe41ifEhU9OIHtVDYpt5gQcGT3lDdm2llzN_PP0/s1600/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}#mdfb{font:12px/1.2 Arial,Helvetica,san-serif;color:#666}#mdfb a,#mdfb a:hover,#mdfb a:visited{text-decoration:none}.mdbox-title{background:#000;color:#fff;font-size:20px !important;font-weight:bold;margin:10px 0;border:20px solid #ddd;-moz-border-radius:6px;-webkit-border-radius:6px;border-radius:6px;box-shadow:5px 5px 5px #CCC;padding:10px;line-height:25px;font-family:arial !important}
</style>
<div style='display:none'>
<div id='exestylepopups' style='padding:10px; background:#fff;'>
<center><h3 class="mdbox-title">Receive all updates via Facebook. Just Click the Like Button Below...</h3></center><center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fhackerspositive&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:35px; font-size:9px;" >Get this <a style=" font-size:9px; color:#3B78CD; text-decoration:none;" href="http://hackers-positive.blogspot.in/2013/08/how-to-add-facebook-pop-up-box-widget_15.html" rel="Dofollow" >Here</a></p>
</div></div>
<script src="http://24blogger-com.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:"#exestylepopups"});
}
});
</script>
<style type="text/css">
/*
ColorBox v1.3.16
(Copyright (c) 2011 Jack Moore - jack@colorpowered.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{cursor:pointer}.cboxPhoto{float:left;margin:auto;border:0;display:block}.cboxIframe{width:100%;height:100%;display:block;border:0}#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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDTPWQgpgzsdNm9JGN5tN17LF5Phf4Mynxea-Kh4qT3r74vVwCGG-4SKNaRqq8PfxFLawz3kc6_P68cNvlk4Oh03G5VRL0lBW_Rq6Yoe41ifEhU9OIHtVDYpt5gQcGT3lDdm2llzN_PP0/s1600/controls.png) no-repeat 0 0}#cboxTopCenter{height:14px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvGMMRAbDPIlRFfpIgSeHDv6AxXhobZhoTo27xSeLIdtywZkDJtT5xPml5-NxpLIuIcA-SL-whrBITjJIVUh3UGayHo0WL4eex_7qS4W5k1gIcyAqoGFIS7Da2PJ76nsyVCbGacoNprtc/s400/border.png) repeat-x top left}#cboxTopRight{width:14px;height:14px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDTPWQgpgzsdNm9JGN5tN17LF5Phf4Mynxea-Kh4qT3r74vVwCGG-4SKNaRqq8PfxFLawz3kc6_P68cNvlk4Oh03G5VRL0lBW_Rq6Yoe41ifEhU9OIHtVDYpt5gQcGT3lDdm2llzN_PP0/s1600/controls.png) no-repeat -36px 0}#cboxBottomLeft{width:14px;height:43px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDTPWQgpgzsdNm9JGN5tN17LF5Phf4Mynxea-Kh4qT3r74vVwCGG-4SKNaRqq8PfxFLawz3kc6_P68cNvlk4Oh03G5VRL0lBW_Rq6Yoe41ifEhU9OIHtVDYpt5gQcGT3lDdm2llzN_PP0/s1600/controls.png) no-repeat 0 -32px}#cboxBottomCenter{height:43px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvGMMRAbDPIlRFfpIgSeHDv6AxXhobZhoTo27xSeLIdtywZkDJtT5xPml5-NxpLIuIcA-SL-whrBITjJIVUh3UGayHo0WL4eex_7qS4W5k1gIcyAqoGFIS7Da2PJ76nsyVCbGacoNprtc/s400/border.png) repeat-x bottom left}#cboxBottomRight{width:14px;height:43px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDTPWQgpgzsdNm9JGN5tN17LF5Phf4Mynxea-Kh4qT3r74vVwCGG-4SKNaRqq8PfxFLawz3kc6_P68cNvlk4Oh03G5VRL0lBW_Rq6Yoe41ifEhU9OIHtVDYpt5gQcGT3lDdm2llzN_PP0/s1600/controls.png) no-repeat -36px -32px}#cboxMiddleLeft{width:14px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDTPWQgpgzsdNm9JGN5tN17LF5Phf4Mynxea-Kh4qT3r74vVwCGG-4SKNaRqq8PfxFLawz3kc6_P68cNvlk4Oh03G5VRL0lBW_Rq6Yoe41ifEhU9OIHtVDYpt5gQcGT3lDdm2llzN_PP0/s1600/controls.png) repeat-y -175px 0}#cboxMiddleRight{width:14px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDTPWQgpgzsdNm9JGN5tN17LF5Phf4Mynxea-Kh4qT3r74vVwCGG-4SKNaRqq8PfxFLawz3kc6_P68cNvlk4Oh03G5VRL0lBW_Rq6Yoe41ifEhU9OIHtVDYpt5gQcGT3lDdm2llzN_PP0/s1600/controls.png) repeat-y -211px 0}#cboxContent{background:#fff;overflow:visible}#cboxLoadedContent{margin-bottom:5px}#cboxLoadingOverlay{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheApr-ExNXzHbfaAwfXBi0YET12w2CUYErQdr1HSVf0zVcAc63sONQJgEFcK6Ax8qefLEwNoHvCaUUWFcgY26xmVvii6QRTVnQ5vBYmgzst9Q8JWNHsj0KVauyYKILUsYFoPyCsJrT9nI/s400/loadingbackground.png) no-repeat center center}#cboxLoadingGraphic{https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDjwpzDL9lcSXkPHwVA9PwcMIKeyrvODKfCBXrHSlh9I_sQc-i3d3qkFUAxPfMyiGfzfnVZp7lHIsWFcp1rn4tBgbH1oVsafvzCYKlDP0_rlGqby7IUbNuvdNCUhXTa__JV-t6yuzvuGU/s400/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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDTPWQgpgzsdNm9JGN5tN17LF5Phf4Mynxea-Kh4qT3r74vVwCGG-4SKNaRqq8PfxFLawz3kc6_P68cNvlk4Oh03G5VRL0lBW_Rq6Yoe41ifEhU9OIHtVDYpt5gQcGT3lDdm2llzN_PP0/s1600/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}#mdfb{font:12px/1.2 Arial,Helvetica,san-serif;color:#666}#mdfb a,#mdfb a:hover,#mdfb a:visited{text-decoration:none}.mdbox-title{background:#000;color:#fff;font-size:20px !important;font-weight:bold;margin:10px 0;border:20px solid #ddd;-moz-border-radius:6px;-webkit-border-radius:6px;border-radius:6px;box-shadow:5px 5px 5px #CCC;padding:10px;line-height:25px;font-family:arial !important}
</style>
<div style='display:none'>
<div id='exestylepopups' style='padding:10px; background:#fff;'>
<center><h3 class="mdbox-title">Receive all updates via Facebook. Just Click the Like Button Below...</h3></center><center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fhackerspositive&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:35px; font-size:9px;" >Get this <a style=" font-size:9px; color:#3B78CD; text-decoration:none;" href="http://hackers-positive.blogspot.in/2013/08/how-to-add-facebook-pop-up-box-widget_15.html" rel="Dofollow" >Here</a></p>
</div></div>
Customization:
1.) Replace hackerspositive With Your Facebook Username.
2.) It Will Not POP Up Again And Again On Every Reload Or Every Pages. To Review The Widget Just Delete Your Browser Cookies And Refresh The Page To See It Appearing Again.
3.) If You Want To Appear This Widget On Every Reload Of Your Visitor On Every Page, Just Change true To false
4.) This Widget Will Again POPUP On Your Viewer Desktop After 30 Day If He Is Clearing His Browser Cookies, If You Want To Minimize This Time, Just Change*30 From The Above Code To Your Desire Day With 30.
5.) You Can Also Change The Text In Receive all updates via Facebook. Just Click the Like Button Below....
6.) Save And Done..
2.) It Will Not POP Up Again And Again On Every Reload Or Every Pages. To Review The Widget Just Delete Your Browser Cookies And Refresh The Page To See It Appearing Again.
3.) If You Want To Appear This Widget On Every Reload Of Your Visitor On Every Page, Just Change true To false
4.) This Widget Will Again POPUP On Your Viewer Desktop After 30 Day If He Is Clearing His Browser Cookies, If You Want To Minimize This Time, Just Change*30 From The Above Code To Your Desire Day With 30.
5.) You Can Also Change The Text In Receive all updates via Facebook. Just Click the Like Button Below....
6.) Save And Done..
Enjoy
NOTE- Please Don't Edit this Code Other Wise It's stop Working in few days
No comments: ADD A COMMENT
Post a Comment