Mega PopUp to offer E-book in return to enjoy the fan page for Blogger

Hello bloggers this is a new Mega PopUp, she has the same functionality, which is offering the eBook in exchange for something that only has a connection with Facebook and not with the feed. Increase the number of fans on Facebook is a desire for all bloggers. Have more people watching their content on the biggest social network of all time is sensational. There are always new ways to generate more fans, from promotions to premium content. Offering an e-book in exchange for a click is very good and certainly will generate many new fans for you very quickly.

     If you do not know how to offer something in exchange for enjoying on Facebook, I recommend reading this our blog to learn: How to offer something in exchange for enjoying on a fan page


I no longer mention the lightness and simplicity of Mega PopUp leading the structure to function in jquery extremely simple. Moreover, PopUp has cookies, files that record the browser preventing PopUp reopen in the same week. Recalling that the structure jquery was produced by Claudio Sanchez. Actually, this article was retidado a Brazilian blog and a blogger answered the request of our reader Matheus Roberto, who was interested in using this PopUp, but prefers to use the system of Facebook.

How to install the Mega PopUp to Facebook on your Blogger blog:

Go to your blog dashboard and click the model.
2 - Then click on Edit HTML.
3 - Hold the CTRL + F and search for:

</head>

4 - And, above it, paste the following code:

script src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js?ver=3.3.1' type='text/javascript'/>
<script src='http://dl.dropbox.com/u/73386157/codigos/minipopup/jquery.cookie.js' type='text/javascript'/>
<script type='text/javascript'>jQuery(document).ready(function($){if($.cookie('popup_user_login')!='yes'){$('#fanback').delay(100).fadeIn('medium');$('#fanclose,#fan-exit').click(function(){$('#fanback').stop().fadeOut('medium')})}$.cookie('popup_user_login','yes',{path:'/',expires:7})});</script>


5 - Then again hold the CTRL + F and search for:

]]></b:skin>

6 - And, above it, paste the following code:

#fanback {display:none;background:rgba(0,0,0,0.8);width:100%;height:100%;position:fixed;top:0;left:0;z-index:99999}
#fan-exit {width:100%;height:100%}
#fanbox {background: white;width: 720px;height: 400px;position: absolute;top: 50%;left: 50%;-webkit-box-shadow: inset 0 0 50px 0 #939393;-moz-box-shadow: inset 0 0 50px 0 #939393;box-shadow: inset 0 0 50px 0 #939393;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;margin: -225px 0 0 -350px;}
#infomage {float: left;margin-left: 24px;margin-right: 10px;}
#infomage img {max-height: 385px;max-width: 200px;}
#boxer-left {float: left;height: 400px;width: 480px;overflow: hidden;}
#fanclose {float: right;cursor: pointer;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfPNBgks0jw-ooy6WNWxW7-_HciYJSjj9Od1n6r7jQ5SkkBlwbz4aVz-h45i_GkSuhbQAXlBphdv1fS3Bc7f7XFR45yw4TXh-ouQ8dQLe6RhQB0lhX59lgAPP1cKD7GHx8nbRyHTIi77VO/s1600/fanclose.png) repeat;height: 15px;padding: 20px;position: relative;padding-right: 40px;margin-top: -20px;margin-right: -22px;}
.boxertoptitle {color: #525252;font-weight: bold;font-family: Arial,sans-serif;font-size: 24px;text-align: left;margin-top: 5px;line-height: 26px;}
.boxertoptitle span {color: #8C171A;font-size: 27px;}
#caixacurtir {width: 420px;height: 50px;background: -moz-linear-gradient(top, #EDEDED 0%, #E2E2E2 100%);background: -webkit-linear-gradient(top, #EDEDED 0%,#E2E2E2 100%);border: 1px solid #C5C5C5;-webkit-border-radius: 7px;border-radius: 7px;background: #F2F2F2;background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#F2F2F2), color-stop(100%,#EAEAEA));filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#eaeaea',GradientType=0 );padding: 10px;}
#baixarbook {background: #A02023;background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#A02023), color-stop(100%,#8C171A));filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a02023', endColorstr='#8c171a',GradientType=0 );border: 1px solid #8B1114;padding: 9px;color: white;font-weight: bold;-webkit-border-radius: 3px;border-radius: 3px;cursor: pointer;text-shadow: 1px 1px 0 #8B1114;font-family: Arial, sans-serif;font-size: 22px;margin-top: 1px;display: block;width: 155px;}
#baixarbook:hover {background: #941A1D;text-decoration: none;text-align: center;}
#baixarbook:active {background: #A4272A;}
#descriptionboxer {margin-top: 10px;padding-bottom: 15px;width: 442px;text-align: justify;font-family: Arial,sans-serif;font-size: 14px;line-height: 19px;color: #444;height: 150px;min-height: 150px;max-height: 150px;}
#descriptionboxer strong {color: #8C171A;}
.septionfan {color: #444;font-size: 15px;font-family: Arial,sans-serif;font-weight: bold;text-transform: uppercase;float: left;width: 210px;}
.btnfan {width: 60px;overflow: hidden;float: left;margin-top: 3px;}
.septionbook {float: left;border-left: 1px solid #CCC;padding-left: 17px;margin-left: 14px;}
.septionfan div {font-size: 12px;color: #941A1D;padding-top: 0px;display: block;margin-left: 5px;float: left;line-height: 10px;}
.septionfan div strong {font-size: 38px;padding-top: 6px;float: left;}
.septionfan span {line-height: 29px;padding-left: 5px;}



7 - And, last, hold the CTRL + F and search for:

<body

8 - And below it paste the following code:


<div id='fanback'><div id='fan-exit'/><div id='fanbox'><div id='fanclose'/><div class='remove-borda'/>
<div id='infomage'>
<img src='IMAGE-EBOOK'/>
</div>
<div id='boxer-left'>
<div class='boxertoptitle'>Enjoy our blog and on Facebook <br/>Download a E-book <span>Free</span>!</div>
<div id='descriptionboxer'>
<p>DESCRIPTION OF FIRST PARAGRAPH!</p>
<p>SECOND PARAGRAPH OF DESCRIPTION!</p>
</div>
<div id='likeus'>
<div class='septionfan'>
Like-us on Facebook!
<div class='btnfan'>
<iframe allowTransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/like.php?href=ADDRESS OF HIS FAN PAGE&amp;send=false&amp;layout=standard&amp;width=450&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=35&amp;appId=228657373907484' style='border:none; overflow:hidden; width:450px; height:35px;'/>
</div><div><strong>‹</strong><span>Like to!</span></div></div>
<div class='septionbook'><a href='ADDRESS OF APPLICATION TO DOWNLOAD THE E-BOOK!' id='baixarbook' target='_blank' rel='nofollow'>Download E-book</a></div></div>



Warning: Remember to change the field in red negritado the address (with http://) image of your eBook hosted.
     Warning: Remember to change the two fields in orange boldface the first and second paragraph of description of the eBook, respectively.
     Warning: Remember to change the field in green negritado the address of your fan page. Example: http://facebook.com/madebyblogger
     Warning: Remember to change the field in blue by negritado address from static html. This address is generated when you install the Static HTML, you can complete the tutorial: How to offer something in exchange for enjoying a Facebook Page

9 - Finally, click Save Model!
What did you think of Mega PopUp to Facebook?