How to add pop up like box of fb page in blogger

Facebook pop up like box play a vital special in increasing your blog traffics. Facebook pop up like box will increase your facebook page traffics in a very short duration. Previously we shared automatic sliding floating facebook like box in blogger. Today every blogger want to increase their blog traffics as well as theirs social media networks sites. So there are out thousands of ways to increase your traffics by different methods some of them you will have to do manually while some of them are automatics. Now we have not much time to works on social media networks thats why if we use automatic method then it will become better for us. So in today article we will discuss about new facebook pop up like box which appear before while visitor landing your blog home page. So in this way we have more chances to increase our blog website facebook fan page popularity.


Today article is all about how to add facebook pop up like box in blogger. So before adding facebook pop up like box in blogger you will need to have a facebook fan page along with user name.

How to add Pop Up like box in blogger

This is a simple java script pop up widget So adding this widget in blogger its so simple.Jus add the Facebook pop up like box code in blogger java script section.
Got to blogger>>Layout:
Add a Gadget>>Html JavaScript Gadget:
Inside Html/JavaScript Gadget Past below code:

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js'></script>
<script src="http://exeideasinternational.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/AVvXsEhG8hk3PgbP6FWS6hKt1hVpwxfkWZBUbF7T9GL8xMk1kv7mWGlxFmVdx-fEe4a6o1jyRM5OOIqxfp4GIXH1m3ZnM6ivRUymlTaxWav8dWvGUlz_aDSu01HWUy4qLBrRcnSd9oxRsrYJhRY/s1600/controls.png) no-repeat 0 0}#cboxTopCenter{height:14px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQyyIoW-HEuM5xAjRW0hLacrNFkVgiLy9eYgOWE3JvBn453gteROvfiZ37nvJeLKCbyJAHsD6wwhiVOLcPrbZAMM5oQsb0JvYDcNAEmh92_vqa5mWg318qr13yj9j9H0OywQ7n_gpQXSE/s400/border.png) repeat-x top left}#cboxTopRight{width:14px;height:14px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhG8hk3PgbP6FWS6hKt1hVpwxfkWZBUbF7T9GL8xMk1kv7mWGlxFmVdx-fEe4a6o1jyRM5OOIqxfp4GIXH1m3ZnM6ivRUymlTaxWav8dWvGUlz_aDSu01HWUy4qLBrRcnSd9oxRsrYJhRY/s1600/controls.png) no-repeat -36px 0}#cboxBottomLeft{width:14px;height:43px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhG8hk3PgbP6FWS6hKt1hVpwxfkWZBUbF7T9GL8xMk1kv7mWGlxFmVdx-fEe4a6o1jyRM5OOIqxfp4GIXH1m3ZnM6ivRUymlTaxWav8dWvGUlz_aDSu01HWUy4qLBrRcnSd9oxRsrYJhRY/s1600/controls.png) no-repeat 0 -32px}#cboxBottomCenter{height:43px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQyyIoW-HEuM5xAjRW0hLacrNFkVgiLy9eYgOWE3JvBn453gteROvfiZ37nvJeLKCbyJAHsD6wwhiVOLcPrbZAMM5oQsb0JvYDcNAEmh92_vqa5mWg318qr13yj9j9H0OywQ7n_gpQXSE/s400/border.png) repeat-x bottom left}#cboxBottomRight{width:14px;height:43px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhG8hk3PgbP6FWS6hKt1hVpwxfkWZBUbF7T9GL8xMk1kv7mWGlxFmVdx-fEe4a6o1jyRM5OOIqxfp4GIXH1m3ZnM6ivRUymlTaxWav8dWvGUlz_aDSu01HWUy4qLBrRcnSd9oxRsrYJhRY/s1600/controls.png) no-repeat -36px -32px}#cboxMiddleLeft{width:14px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhG8hk3PgbP6FWS6hKt1hVpwxfkWZBUbF7T9GL8xMk1kv7mWGlxFmVdx-fEe4a6o1jyRM5OOIqxfp4GIXH1m3ZnM6ivRUymlTaxWav8dWvGUlz_aDSu01HWUy4qLBrRcnSd9oxRsrYJhRY/s1600/controls.png) repeat-y -175px 0}#cboxMiddleRight{width:14px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhG8hk3PgbP6FWS6hKt1hVpwxfkWZBUbF7T9GL8xMk1kv7mWGlxFmVdx-fEe4a6o1jyRM5OOIqxfp4GIXH1m3ZnM6ivRUymlTaxWav8dWvGUlz_aDSu01HWUy4qLBrRcnSd9oxRsrYJhRY/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/AVvXsEj3SDXcSb2Tnpjqcq5xsg_zgXTiHOdL7f_LQ-I_j3x1Q7DCeFWgxHuHNdS1EVicOZBPlS00qN6Pe8o_51zsqdMLs6ZeHEvhM33H37xrae9K1oBBbgc6ixYEHgJTiKcgYS0Aykx3G0RiuzQ/s400/loadingbackground.png) no-repeat center center}#cboxLoadingGraphic{https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3hmPiFisUiqmGWQ8UJdvdxdVw20Zhd5fh7PIWUW8viB2RSR9LFt63eHiW8-BVoIA4mZVfonBnqf2bdNy94iNUvJxJatwQfX54ek66MjvzWa3-446k3gIcVKio0GBoFivFiZSfcmahjK8/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/AVvXsEhG8hk3PgbP6FWS6hKt1hVpwxfkWZBUbF7T9GL8xMk1kv7mWGlxFmVdx-fEe4a6o1jyRM5OOIqxfp4GIXH1m3ZnM6ivRUymlTaxWav8dWvGUlz_aDSu01HWUy4qLBrRcnSd9oxRsrYJhRY/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%2xgrouporg.blogspot.com&amp;width=300&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23ffffff&amp;stream=false&amp;header=false&amp;height=258" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:258px;" allowtransparency="true"></iframe>
</center></div></div>

  Now save the widget and you done everything.

Normally this widget will appear only Once in a month for each visitor who visits your blog first time.This will widget will also appear if you clear your browser all Data, History and Cache and re visit your blog.
IF you want to appear this widget for every page refresh then just change the yellow color "true" value to "false". But I would recommend you to keep it as it is.
The yellow color text is the text which will be displayed above the Facebook like box in the pop up, so you can change it to whatsoever you like.
This is my facebook page user name "xgrouporg.blogspot.com" , so you must replace it with your FB page user name, and you can find that just by visiting your facebook page.
You have done now save the widget again and visit your blog for seeing the beautiful pup up like box.if possible clear your browser cache.

If your pop up  like box doesnot work then follow these way:

1. Go to your facebook fan page which you want to appear:
2. Go to edit page >> update info:
3. Then write unique name for your page by click Username:
4. When you write available username for your page then copy that and replace withProBloggerTrick
5. Noted you can only one time change this name after this you have no permission to change it:
6. Clear your Browser history, data and Cache.