Add subscribe to the blog pop-up Th3safelink
A very nice addition. Add subscribe to the blog pop-up. This addition is responsive and can be used for all blogger templates
How to Install?
Login your Blogger >> Layout >> Add a Gedget >> HTML/Javascript >> Paste code
<style>
#backgroundPopup {
display: none;
position: fixed;
_position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
background-color: transparent;
background: rgba(0, 0, 0, 0.5);
z-index: 999999999;
}
#popupContact {
position: absolute;
top: 18%;
left: 25%;
display: none;
position: fixed;
_position: absolute;
height: 47%;
width: 50%;
background: #FFFFFF;
box-shadow: 0px 5px 42px 2px #000;
z-index: 999;
padding: 8px;
font-size: 13px;
}
.pop-up-self {
background: #FFF;
}
.subscribe-title {
text-align: center;
font-size: 25px;
position: relative;
margin-top: 9px;
margin-bottom: 16px;
}
.content-sub {
background: #00ACf5;
float: left;
padding: 25px;
margin-left: 15px;
margin-right: 15px;
}
.content-img img {
float: left;
width: 160px;
padding-top: 25px;
}
.content-text {
color: #FFF;
text-align: center;
font-size: 18px;
line-height: 25px;
padding-left: 183px;
padding-top: 17px;
}
.content-form {
margin-top: 32px;
}
.content-form form input.email-address-subscribe:hover {
box-shadow: 0 0 7px -1px #004E6F;
background: #F7F7F7;
}
.content-form form input.email-address-subscribe {
font-size: 16px;
transition: .2s;
padding: 18px;
border-radius: 5px;
width: 90%;
border: 0;
}
.content-form form input.buttom-subscribe {
padding: 18px;
cursor: pointer;
color: #FFF;
font-weight: 700;
font-family: sans-serif;
border: 0;
border-bottom: 3px solid #74A700;
font-size: 16px;
background: linear-gradient(#a9d249, #8dc437);
}
#prdh {display:none}
#popupContactClose:active {
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFoAAABaCAMAAAAPdrEwAAAAY1BMVEUAAAD///+SkpI9PT339/eenp4zMzP8/Pzw8PC7u7vFxcXs7Oz09PRsbGxKSkqOjo7l5eWIiIitra0qKioPDw/T09NWVlZ3d3fNzc0aGhpPT0+AgIBFRUVeXl5jY2Pe3t4iIiLbYsqoAAADUklEQVRYhe3Z25qiMAwA4FRAQFCxHnAUdd7/KQcVsG0OLbC7315MLgf8J9bSpgHUXwv4pf9Huiyqqij/LF0edd3AEE2tjyH/wUsX+nIAFIeLLubRsY4w20ek48l0uSPytXLfSQPD0/FOdt+x4zNnae3JeMhcj6Srxo/20VRj6DwcfkYeTtfjZIA6kE5PY2WAUxpCx1/jZYAvPFMQXS6nyABLNMVdOp2U8ytvd0xc+jJVBrjI9Hq6DLCWaD1HBtA8/ZgnAzxYeuLk+MSSo5O5MkBC0xlx601a/27E3zKSJmZHu+6w20z75Vf4r2uKLkhZxYz9evoIuyBonHS3VpJLd/S+hu0a0zjpfhVON4Tcr0bYLhC9cG+5fkYN2dHn2ta9tkA0+u/GD+LmvTFWULxtuPQRf+nF5/PK2h02xgXiWTg69BXfwtmbVJSHkexp8hkn7ZOc8+dp7+iKugdgazA3LKOf/h2VRXPVwc61A+R+1nY0W4Q5trlzc3L/mY7miyXLNnNGE3qIxqLZ26xHJzVylopNk46F+0w7TIbYoJkJwttygVwZ9Fm8E9vUA2bE2aCJddeKepQMK4P2Fr3rMXI3sQPppbHWpd6y3qR9AxIpK4i9wYpVOB05FS6173C0XDY5Ofvzfhg0VYKwOT+D2+ffkRm09KATOT9DspVJfwflvDXWbyHvvUWzZ66lvYqa+w5r1xbNVZLmCeW1Phs2m3di0cSGTuTs2FzeD4suydMRyjko7/6c1+/o97CcQ/K+K5smVhEy54C8c4dO0R3fipHtvPfog8qhcQ28YGX52hrReI4MZwdiZg42XiKOiMb1wj5j5cHO0Hg0CtN4YT1krNzZGT5FrQia+EGeebMnvgWVc79+ODSxrR9yoSq45sTJ70zS5GMzMu6Kpsv5dMnQcxsLTmvBblrMaoe4DRGn1RLYkqTjoCRaris9UYk0tyeExFHJtLeQYmPlSriFONFGMtX4nDQm7mjQ9JTfkuozk53glGr9CHEjmrVsa3xUhyuhDa6hXwR3QC/cWxT+NURg553uuMt0u1rhld6JPfsOwkO3mYsl+obP2E+3Y54wh6Im8b2pCni9VuRXp0aKrrn3DVj4S8HinOukDZ2fA9RR9IT4pf8d/QPBoSMrFGvocgAAAABJRU5ErkJggg==) no-repeat;
background-size: 20px;
width: 18px;
height: 19px;
}
#popupContactClose {
background:url(data:image/png;base64,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) no-repeat;
width: 20px;
background-size: 20px;
height: 20px;
display: inline;
z-index: 3200;
border-radius: 100%;
overflow: hidden;
position: absolute;
top: -10px;
right: -10px;
cursor: pointer;
text-indent: -99999px;
}
</style>
<div id="backgroundPopup">
<div id="popupContact">
<a href="javascript:void(0);" id="popupContactClose">x</a>
<div class="pop-up-self">
<div class="subscribe-title">
Subscribe now to receive all new </div><div class="content-sub">
<div class="content-img">
<img src="https://i.imgur.com/4l7MEY8.png" />
</div>
<div class="content-text">
Welcome, dear visitor, you can subscribe to the mail messages service to receive all that is new on NQNIA</div>
<div class="content-form">
<a href="http://nqnia.blogspot.com" id="prdh">th3safelink</a><form action="https://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open("https://feedburner.google.com/fb/a/mailverify?uri=nqnia", "popupwindow", "scrollbars=yes,width=550,height=520"); return true" target="popupwindow">
<table width="100%">
<tbody><tr>
<td>
<input class="email-address-subscribe" name="email" placeholder="Email" type="text" />
</td>
<td width="64px">
<input class="buttom-subscribe" type="submit" value="Subscribe Now!" />
</td>
</tr>
</tbody></table>
<input name="uri" type="hidden" value="subscribe now" />
<input name="loc" type="hidden" value="en_US" />
</form>
</div></div>
</div>
</div>
<script type="text/javascript">
jQuery.cookie=function(key,value,options){if(arguments.length>1&&String(value)!=="[object Object]"){options=jQuery.extend({},options);if(value===null||value===undefined){options.expires=-1;}
if(typeof options.expires==='number'){var days=options.expires,t=options.expires=new Date();t.setDate(t.getDate()+ days);}
value=String(value);return(document.cookie=[encodeURIComponent(key),'=',options.raw?value:encodeURIComponent(value),options.expires?'; expires='+ options.expires.toUTCString():'',options.path?'; path='+ options.path:'',options.domain?'; domain='+ options.domain:'',options.secure?'; secure':''].join(''));}
options=value||{};var result,decode=options.raw?function(s){return s;}:decodeURIComponent;return(result=new RegExp('(?:^|; )'+ encodeURIComponent(key)+'=([^;]*)').exec(document.cookie))?decode(result[1]):null;};
var popupStatus = 0;
//this code will load popup with jQuery magic!
function loadPopup(){
//loads popup only if it is disabled
if(popupStatus==0){
$("#backgroundPopup").fadeIn("slow");
$("#popupContact").fadeIn("slow");
popupStatus = 1;
}
}
//This code will disable popup when click on x!
function disablePopup(){
//disables popup only if it is enabled
if(popupStatus==1){
$("#backgroundPopup").fadeOut("slow");
$("#popupContact").fadeOut("slow");
popupStatus = 0;
}
}
//this code will center popup
function centerPopup(){
//request data for centering
var windowWidth = document.documentElement.clientWidth;
var windowHeight = document.documentElement.clientHeight;
var popupHeight = $("#popupContact").height();
var popupWidth = $("#popupContact").width();
//centering
$("#popupContact").css({
"position": "absolute",
});
}
//CONTROLLING EVENTS IN jQuery
$(document).ready(function(){
if ($.cookie("anewsletter") != 1) {
//centering with css
centerPopup();
//load popup
loadPopup();
}
//CLOSING POPUP
//Click the x event!
$("#popupContactClose").click(function(){
disablePopup();
$.cookie("anewsletter", "1", { expires: 7 });
});
});
</script></div>
