We Started A Facebook AutoLiker & AutoCommenter. Check Out Our EXELiker & EXECommenter...

Stylish LightBox POP-UP Twitter Follow Box Widget For Blog & Website

Stylish LightBox POP-UP Twitter Follow Box Widget For Blog & Website

This code is based upon Facebook POPUP that was published in our previous post and it's is 99.99% workable with fixed bug and full feature customization with stop showing on every reload code.
Get the more followers to your twitter page from blogger by adding a popup Twitter Follower box to your blogspot. By adding this customized widget may know the visitors to know the number of people Follow your website and join your site directly.
Twitter Follow Box is unofficially used widget all over the world on internet. The importance of the Twitter Follow Box is tremendous in terms of the number of Followers it brings. About 90+ % of the fans that you can get here from the Follow box installed on the blog.

Today we'll be sharing the latest Twitter Box Lightbox style popup widget that you can add to your blogger blog (blogspot). This popup appears only once to every new visitor. The ip address of the visitor is stored in browser cookie and as the page loads again the widget wont be called again for the same visitor thus eliminating the chances of bugging regular readers. Because of course it will look weird if the popup appears again and again on every pageview.

It will appear both on homepage and sub pages depending which page the visitor is accessing. I have set the cookie refresh time to 30 days, which means that this lightbox will appear again for the same visitor after 30 days. We can easily set the number of days to prompt the visitors about your Twitter Follow Profile. Lets get straight to the one step installation process.

We also have the CSS Version but that doesn't have the same one-time features but 50% lighter then this one that will save your blog loading time that is better for SEO. Now it's upto you whats you want to use. There are only one simple step to add is quickly.To get this widget follow below procedure:-


Features:

1.) Un-Blockable POP-UP By All Browsers.
2.) POP-UP With LightBox Effect.
3.) Close Button Also Included.
4.) Quick To Load And Easy To Install.
5.) Simple And Stylish Design.
6.) Works On 99.99% Blog Template.
7.) User Friendly.
8.) Full Customizable.
9.) You Have Full Option When You Want To Display This Widget To Your Visitor.
10.) You Can Show This POPUP Once In A Month Or Once In A Week Or Daily Depend Upon Your Mood.
11.) It Will Get Visitor Cookied To Locked Down The IP To Stop Showing On Every Reload Of Your Blog/Website.
12.) Simple Step To Make It More Awesome And Bring Happieness To Your Visitor Face.

How To Add In Blogspot?

1.) Go To Your www.blogger.com
2.) Open Your Desire Blog.
3.) Go To "Layout".
4.) Click "Add A Gadget" Where You Want To Add It.
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.

How To Add In Website?

1.) Just Go To Your HTML File.
2.) Now Copy The Below Code And Paste It Between <body> </body>.
3.) Save It, Now You Are Done.

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js'></script>
<script src="https://raw.github.com/EXEIdeas/JS/master/ColorBox-v1.3.16"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
if (document.cookie.indexOf('visited=false') == -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(http://4.bp.blogspot.com/-_VSGGUcsUPE/TwNIXL6W2qI/AAAAAAAAFwQ/5KR8F-N3Mqk/s1600/controls.png) no-repeat 0 0}#cboxTopCenter{height:14px;background:url(http://3.bp.blogspot.com/-dJQm3QEd5Iw/TxohpCter-I/AAAAAAAAF0Q/GRny7olLbv8/s400/border.png) repeat-x top left}#cboxTopRight{width:14px;height:14px;background:url(http://4.bp.blogspot.com/-_VSGGUcsUPE/TwNIXL6W2qI/AAAAAAAAFwQ/5KR8F-N3Mqk/s1600/controls.png) no-repeat -36px 0}#cboxBottomLeft{width:14px;height:43px;background:url(http://4.bp.blogspot.com/-_VSGGUcsUPE/TwNIXL6W2qI/AAAAAAAAFwQ/5KR8F-N3Mqk/s1600/controls.png) no-repeat 0 -32px}#cboxBottomCenter{height:43px;background:url(http://3.bp.blogspot.com/-dJQm3QEd5Iw/TxohpCter-I/AAAAAAAAF0Q/GRny7olLbv8/s400/border.png) repeat-x bottom left}#cboxBottomRight{width:14px;height:43px;background:url(http://4.bp.blogspot.com/-_VSGGUcsUPE/TwNIXL6W2qI/AAAAAAAAFwQ/5KR8F-N3Mqk/s1600/controls.png) no-repeat -36px -32px}#cboxMiddleLeft{width:14px;background:url(http://4.bp.blogspot.com/-_VSGGUcsUPE/TwNIXL6W2qI/AAAAAAAAFwQ/5KR8F-N3Mqk/s1600/controls.png) repeat-y -175px 0}#cboxMiddleRight{width:14px;background:url(http://4.bp.blogspot.com/-_VSGGUcsUPE/TwNIXL6W2qI/AAAAAAAAFwQ/5KR8F-N3Mqk/s1600/controls.png) repeat-y -211px 0}#cboxContent{background:#fff;overflow:visible}#cboxLoadedContent{margin-bottom:5px}#cboxLoadingOverlay{background:url(http://2.bp.blogspot.com/-bMneOFi_UDo/Txohpge3Z9I/AAAAAAAAF0s/AbVgxX9pXtQ/s400/loadingbackground.png) no-repeat center center}#cboxLoadingGraphic{http://3.bp.blogspot.com/-SKktU1-SCCw/TxohpRB19LI/AAAAAAAAF0Y/iwIo3LnjoE0/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(http://4.bp.blogspot.com/-_VSGGUcsUPE/TwNIXL6W2qI/AAAAAAAAFwQ/5KR8F-N3Mqk/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 tweets via Twitter. Just Click the Follow Button Below...</h3></center><center>
<iframe name="EXEIdeas" frameborder="0" allowtransparency="true" src="http://s.moopz.com/connect.html?user=EXEIdeas" class="EXEIdeas" scrolling="no" style="width: 300px; height: 250px; border: none; border-width: initial; border-color: initial; "></iframe>
</center><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.exeideas.com">EXEIdeas</a></p>
</div></div>

 

Customization:

1.) Change Red Text According To Your Desire.
2.) Change Blue Text With Your Twitter UserName.
3.) If You Want To Display This Gadget Once Upon User Cookies, Just Change false To true .
4.) If You Want To Clear Your User Cookies After Desired Days, Just Change 30 To You Desired Days.(Must Be Within 1-30)

5.) Save And Done.

Note:

1.) If You Want To Lite Up Your Blog Template Or Want Quick Load Time Then Get This Widget In CSS Only Without J-Query...

You Like It, Please Share This Recipe With Your Friends Using...

12 Responses to “Stylish LightBox POP-UP Twitter Follow Box Widget For Blog & Website”

  1. It worked and i’ve added it to both of my Blog. Can you do one for Blogger Follower? I have a lot of visitors but no one hardly clicks on the Follower’s tab.

  2. Anonymous says:

    Not working help…………..

  3. Mohit Gupta says:

    what happend when i wil chnge false to true ?

  4. Mohit Gupta says:

    one time in a day? Or it depends upon browser cookies?

  5. Anonymous says:

    I want to show it one time whats why i cannot use css one

Leave a Reply