Facebook is the largest social network with 1.2 billion active users. So obviously Facebook is the best place to promote your business or website. That’s why every website or business creates their own Facebook fan page to connect with their customers. For bloggers Facebook is the platform which drives more traffic to their blog. So they aim to get more fans on Facebook. Unless you are an established brand it would be difficult to get huge fan following. That’s why bloggers place a like box on their blog.
FeedBurner is a free feed management provider. It delivers latest posts to the subscribers. FeedBurner is the only service that is free forever. Blogger places a feed subscription form on their website to get more readers. WordPress has many plugins to get more Facebook followers and feed subscribers. But blogger blogs have no such widgets available. Popups are the best way to generate more leads. Once a new user visits your blogger blog a Popup will appear asking to like our Facebook fan page or subscribe to your feed. We can control Popups by setting time limit when a Popup should appear and after how many days it should appear again. If you have an attractive Popup with catchy headings it will generate more leads.
In this post we will help you to get a Facebook Popup like box and FeedBurner subscriber form. Just follow below steps to get a Popup Facebook like box and FeedBurner subscription form.
1. From your Blogger Dashboard click on Layout.
2. Click on Add a Gadget any where on the layout.
3. Add an HMTL/JavaScript gadget.
4. Copy and paste the following code in the gadget’s Content section.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 |
<!-- Facebook Like Box Pop Up Widget For Blogger By etechknol.com --> <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%;} #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 0px rgba(0,0,0,0.4); -moz-box-shadow:0 0 0px rgba(0,0,0,0.4); -webkit-box-shadow:0 0 0px rgba(0,0,0,0.4); } #cboxTopLeft{width:14px; height:14px; background:url(http://www.etechknol.com/wp-content/uploads/2014/02/controls.png) no-repeat 0 0;} #cboxTopCenter{height:14px; background:url(http://www.etechknol.com/wp-content/uploads/2014/02/border.png) repeat-x top left;} #cboxTopRight{width:14px; height:14px; background:url(http://www.etechknol.com/wp-content/uploads/2014/02/controls.png) no-repeat -36px 0;} #cboxBottomLeft{width:14px; height:43px; background:url(http://www.etechknol.com/wp-content/uploads/2014/02/controls.png) no-repeat 0 -32px;} #cboxBottomCenter{height:43px; background:url(http://www.etechknol.com/wp-content/uploads/2014/02/border.png) repeat-x bottom left;} #cboxBottomRight{width:14px; height:43px; background:url(http://www.etechknol.com/wp-content/uploads/2014/02/controls.png) no-repeat -36px -32px;} #cboxMiddleLeft{width:14px; background:url(http://www.etechknol.com/wp-content/uploads/2014/02/controls.png) repeat-y -175px 0;} #cboxMiddleRight{width:14px; background:url(http://www.etechknol.com/wp-content/uploads/2014/02/controls.png) repeat-y -211px 0;} #cboxContent{background:#fff; overflow:visible;} #cboxLoadedContent{margin-bottom:5px;} #cboxLoadingOverlay{background:url(http://www.etechknol.com/wp-content/uploads/2014/02/loading-background.png) no-repeat center center;} #cboxLoadingGraphic{background:url(http://www.etechknol.com/wp-content/uploads/2014/02/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://www.etechknol.com/wp-content/uploads/2014/02/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;} #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: #3B5998; font-size: 20px !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; } .tbisubscribe { border: 1px solid #D3D3D3; padding: 8px; width: 300px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .tbisubscribe:hover { -moz-box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1); -webkit-box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1); box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1); } .tbimailbox { border: 1px solid #D3D3D3; -webkit-border-radius: 4px; border-radius: 4px; -moz-box-shadow: 1px 1px 1px 1px rgba(255, 172, 84, 0.4) inset; -webkit-box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset; box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset; color: #666; font: 14px "trebuchet ms", sans-serif; padding: 7px 15px; width: 160px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .tbimailbox:hover { -webkit-box-shadow: none; box-shadow: none; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .tbisubmit { font: bold 12px Tahoma, Geneva, sans-serif; font-style: normal; color: #ffffff; background: #ff5714; border: 0px solid #ffffff; text-shadow: 0px -1px 1px #222222; box-shadow: 2px 2px 5px #000000; -moz-box-shadow: 2px 2px 5px #000000; -webkit-box-shadow: 2px 2px 5px #000000; border-radius: 10px 10px 10px 10px; -moz-border-radius: 10px 10px 10px 10px; -webkit-border-radius: 10px 10px 10px 10px; padding: 8px 15px; cursor: pointer; margin: 0 auto; } .tbisubmit:active { cursor: pointer; position: relative; top: 2px; } .tbisubmit::-moz-focus-inner { border: 0; padding: 0; margin: 0; } .tweet { background: url("http://www.etechknol.com/wp-content/uploads/2014/02/twitter.png") no-repeat scroll 1px 1px; } .fb { background: url("http://www.etechknol.com/wp-content/uploads/2014/02/facebook500.png") no-repeat scroll 1px 1px; } .feed { background: url("http://www.etechknol.com/wp-content/uploads/2014/02/rss.png") no-repeat scroll 1px 1px; } </style> <script src='http://widcraft.googlecode.com/svn/jquery.min.js'></script> <script src="http://widcraft.googlecode.com/svn/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*15; var expires = new Date((new Date()).valueOf() + fifteenDays); document.cookie = "visited=true;expires=" + expires.toUTCString(); $.colorbox({width:"400px",height:"485px", inline:true, href:"#subscribe"}); } }); </script> <div style='display:none'> <div id='subscribe' style='padding:10px; background:#fff;'> <center> <div class="tbisubscribe"> <div class="fb" style="color: #666666; font-weight: bold; font: 22px Oswald, cursive; margin: 0px 0px 10px 15px;">Like Us On Facebook</div> <iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Ffbname&width=318&height=65&colorscheme=light&show_faces=false&stream=false&header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:318px; height:65px;" allowtransparency="true"></iframe> </div> <link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css' /> <div class='tbisubscribe'> <div class="feed" style='color: #666666; font-weight: bold; font: 22px Oswald, cursive; margin: 0px 0px 10px 15px;'>Subscribe To Us</div> <div style='margin: 10px 0 0 6px;'> <form action='http://feedburner.google.com/fb/a/mailverify' class='emailform' method='post' onsubmit='window.open('http://feedburner.google.com/fb/a/mailverify?uri=fdname', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true' style='margin: 0pt;' target='popupwindow'> <input name='uri' type='hidden' value='fdname' /> <input name='loc' type='hidden' value='en_US' /> <input class='tbimailbox' name='email' onblur='if (this.value == "") {this.value = "Enter your email...";}' onfocus='if (this.value == "Enter your email...") {this.value = ""}' type='text' value='Enter your email...' /> <input alt='' class='tbisubmit' title='' type='submit' value='Subscribe'/> </form> </div> <div style='border: none; color: #666666; font: 22px Oswald, cursive; margin: 25px 0 0 5px;text-align:left;'>Follow us on:</div> <div style='margin: -32px 0 0 120px;'> <a href='http://www.facebook.com/fbname' target='_blank' title='Join us on Facebook'><img src='http://www.etechknol.com/wp-content/uploads/2014/02/facebook500.png' alt='facebook'/></a> <a href='http://www.twitter.com/tname' rel='nofollow' target='_blank' title='Follow us on Twitter'><img src='http://www.etechknol.com/wp-content/uploads/2014/02/twitter.png' alt='twitter'/></a> <a href='https://plus.google.com/+Gname' rel='nofollow' target='_blank' title='Follow Us On Google Plus'><img src='http://www.etechknol.com/wp-content/uploads/2014/02/googleplus-revised.png' alt='gplus'/></a> <a href='http://pinterest.com/pname' rel='nofollow' target='_blank' title='Follow us on Pinterest'><img src='http://www.etechknol.com/wp-content/uploads/2014/02/pinterest.png' alt='pinterest'/></a> <a href='http://feeds.feedburner.com/techknol' rel='nofollow' target='_blank' title='Subscribe to RSS'><img src='http://www.etechknol.com/wp-content/uploads/2014/02/rss.png' alt='rss'/></a> </div> </div> </center> <p style=" float:right; font-size:9px;" >Powered By <a style=" font-size:9px; color:#3B78CD; text-decoration:none;" href="http://www.etechknol.com">Tech Knol</a></p> </div> </div> <!-- Facebook Like Box Pop Up Widget For Blogger By etechknol.com --> |
Use (Ctrl+F or F3). Find fbname and replace it with your Facebook fan page username (2 times).
Find tname and replace it with your Twitter username (1 time).
Find pname and replace it with your Pinterest username (1 time).
Find fdname and replace it with your FeedBurner uri (2 times).
Find Gname and replace it with your Google+ username (1 time).
After changing usernames save the gadget. From now when a new user visits your blogger blog a Popup will appear as shown in below pic. This Popup timer is set to 15 days, in the sense once visitor sees the Popup it will again appear after 15 days only.
Conclusion
This Popup is one of the best ways get more fans on Facebook and more FeedBurner subscribers. If you are facing any problem in using this code please leave a comment we will be happy to help you.
If you enjoyed reading this post you would be doing a huge favour by sharing our post on Facebook and twitter and leaving us a comment to let us know what you think.
20 Comments on “Facebook Popup Like BOX and FeedBurner Subscription Form for Blogger”
Hi Anil, I am new in here 🙂 Awesome Widget for blogger Thanks Anil keep it up sharing useful contents, i will be exept more blogger widgets
Noufal, glad you liked the widget and We will surely come up with new widget ideas in the future.
Thanks admin its really a good and hardworking job currently doing you are. This help me a lot to get more likes on my Facebook page, Thanks again.
Thanks Madiha 🙂
Greetings,
Great Job.
Please I would like to set mine to one day interval, kindly help, thanks.
Nice Job,
Please kindly help with Close Button…
Mobile users are finding it hard to close the popup.
Thanks
Nice work bro but not working its showing once only
Satish, once you see Popup it will appear again after 15 days. If you want to check whether it’s working or not clear history and see.
I really want this for my wordpress blog, can you help me please? 🙂
Ashu, this code won’t work with WordPress. But I can help you to get same popup on WordPress with a technique 🙂
hey i used it in my website and its not working
Tanuj, delete your page cache & cookies and see if it’s working.
Thank you for very clear instruction on how to install this widget! I did all the steps but once I saved and viewed my blog, a pop up came up saying widcraft.googlecode.com needed an authentication? I went ahead and removed the widget because I didn’t want my readers confused by this. Please consult. Thanks!
Hi Anil, I’m having the same issue as Araquel — it looks like where the javascript is stored is not accessible without a login? Could you put it somewhere it can be accessed publically?
Thanks
I copied your instructions and nothing is working. Nothing pops up.
Arwa, the code has been deleted by the developer.
It says the scripts aren’t found on the server… Nothing shows up.
Tatiana, may be the developer has deleted the code. Sorry for the inconvenience 🙁
Thanks for sharing with us. However it’s not working on my blogger blog.
Mohamed, the code has been deleted by the developer. Apologies for the inconvenience 🙁