Thursday, December 1, 2011

Add a pop up email subscription to your blog | A a feed burner email subsciption to blog

If you are a google adsense user and a experienced blogger, then you might be knowing that adsense is giving a revenue on feedburner email subscription.


To increase your blog's email subscription and earn more this is the best thing you can ever do

Remember Always Back Up Your Template Before You Make Changes - How To Back Up A Blogger Template

Step 1. In Your Blogger Dashboard Click Design > Edit Html

Design Edit Html Blogger

Step 2. Find the following piece of code in your blogs Html : (Click Ctrl and F for a search bar to help find the code - How To Find Code In Blogger Template Template)


]]></b:skin>

Step 3. Copy and Paste the following code Directly Above / Before ]]></b:skin>

Note - This is a scroll box make sure to get all the code.
/*Subscription Pop Up Css*/
#popupContactClose{
cursor: pointer;
text-decoration:none;
}
#backgroundPopup{
display:none;
position:fixed;
_position:absolute; /* hack for internet explorer 6*/
height:100%;
width:100%;
top:0;
left:0;
background:#000000;
border:1px solid #cecece;
z-index:1;
}
#popupContact{
display:none;
position:fixed;
_position:absolute; /* hack for internet explorer 6*/
height:384px;
width:408px;
background:#FFFFFF;
border:2px solid #cecece;
z-index:2;
padding:12px;
font-size:13px;
}
#popupContact h1{
text-align:left;
color:#6FA5FD;
font-size:22px;
font-weight:700;
border-bottom:1px dotted #D3D3D3;
padding-bottom:2px;
margin-bottom:20px;
}
#popupContactClose{
font-size:14px;
line-height:14px;
right:6px;
top:4px;
position:absolute;
color:#6fa5fd;
font-weight:700;
display:block;
}
/*End Subscription Pop Up Css @ http://www.spiceupyourblog.com */

Step 4. Find the following piece of code in your blogs Html : (Click Ctrl and F for a search bar to help find the code - How To Find Code In Blogger Template Template)

</head>

Step 5. Now Copy And Paste This Code Directly Above / Before </head>

<!--Pop Up Subscription-->
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js' type='text/javascript'/>
<script src='http://dinhquanghuy.110mb.com/jquery.cookie.js' type='text/javascript'/>
<script type='text/javascript'>
var popupStatus = 0;

//loading popup with jQuery magic!
function loadPopup(){
centerPopup();
//loads popup only if it is disabled
if(popupStatus==0){
$(&quot;#backgroundPopup&quot;).css({
&quot;opacity&quot;: &quot;0.7&quot;
});
$(&quot;#backgroundPopup&quot;).fadeIn(&quot;slow&quot;);
$(&quot;#popupContact&quot;).fadeIn(&quot;slow&quot;);
popupStatus = 1;
}
}

//disabling popup with jQuery magic!
function disablePopup(){
//disables popup only if it is enabled
if(popupStatus==1){
$(&quot;#backgroundPopup&quot;).fadeOut(&quot;slow&quot;);
$(&quot;#popupContact&quot;).fadeOut(&quot;slow&quot;);
popupStatus = 0;
}
}

//centering popup
function centerPopup(){
//request data for centering
var windowWidth = document.documentElement.clientWidth;
var windowHeight = document.documentElement.clientHeight;
var windowscrolltop = document.documentElement.scrollTop;
var windowscrollleft = document.documentElement.scrollLeft;
var popupHeight = $(&quot;#popupContact&quot;).height();
var popupWidth = $(&quot;#popupContact&quot;).width();
var toppos = windowHeight/2-popupHeight/2+windowscrolltop;
var leftpos = windowWidth/2-popupWidth/2+windowscrollleft;
//centering
$(&quot;#popupContact&quot;).css({
&quot;position&quot;: &quot;absolute&quot;,
&quot;top&quot;: toppos,
&quot;left&quot;: leftpos
});
//only need force for IE6

$(&quot;#backgroundPopup&quot;).css({
&quot;height&quot;: windowHeight
});

}


//CONTROLLING EVENTS IN jQuery
$(document).ready(function(){
if ($.cookie(&quot;anewsletter&quot;) != 1) {

//load popup
setTimeout(&quot;loadPopup()&quot;,5000);
}
//CLOSING POPUP
//Click the x event!
$(&quot;#popupContactClose&quot;).click(function(){
disablePopup();
$.cookie(&quot;anewsletter&quot;, &quot;1&quot;, { expires: 7 });
});
//Click out event!
$(&quot;#backgroundPopup&quot;).click(function(){
disablePopup();
$.cookie(&quot;anewsletter&quot;, &quot;1&quot;, { expires: 7 });
});
//Press Escape event!
$(document).keypress(function(e){
if(e.keyCode==27 &amp;&amp; popupStatus==1){
disablePopup();
$.cookie(&quot;anewsletter&quot;, &quot;1&quot;, { expires: 7 });
}
});

});
</script>
<!--End Pop Up Subscription @ http://www.spiceupyourblog.com -->

Step 6. Find the following piece of code in your blogs Html : (Click Ctrl and F for a search bar to help find the code - How To Find Code In Blogger Template Template)

</body>

Step 7. Copy and Paste the following code Directly Above / Before </body>

<div id='popupContact'>
<a id='popupContactClose'>x</a>
<h1>Get Our Latest Posts Via Email - It&#39;s Free</h1>
<p id='contactArea'><form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=SpiceUpYourBlog&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' style='border:1px solid #ccc;padding:3px;text-align:center;' target='popupwindow'><p>Enter your email address:</p><p><input name='email' style='width:140px' type='text'/></p><input name='uri' type='hidden' value='SpiceUpYourBlog'/><input name='loc' type='hidden' value='en_US'/><input type='submit' value='Subscribe'/><p>Delivered by <a href='http://feedburner.google.com' target='_blank'>FeedBurner</a></p></form></p>
</div>
<div id='backgroundPopup'/>

Important - You need to change our feedburner username with yours.The username for your feed can be found at the end of your feed URL.For example the our feedburner URL is http://feeds.feedburner.com/SpiceUpYourBlog , with SpiceUpYourBlog being the username.

That's it all thanks go to Simplex Design.

0 comments:

Post a Comment