April 21, 2015

Email Subscription Popup Window With Facebook Like Button and YouTube Subscribe Button For Blogger


Go to Blogger=>Select Blog

          Select Layout

          Select Add a Gadget

          Select HTML/JavaScript

         Add Below Code in Content Box and Save it.





<script type="text/javascript">
function ks_style_v4_popup(){document.getElementById('ks-style-v4-popup-main').style.display='block'}setTimeout('ks_style_v4_popup();',1000);
</script>
<style type="text/css">
* html #mkstylepopupdiv {
position:absolute;
}
#mkstylepopupdiv {
z-index:999;
display:block;
top:0;
left:0;
width:100%;
height:100%;
position:fixed;
background-image:url(http://3.bp.blogspot.com/--QwfQi4MAE4/U0a5LnWN_SI/AAAAAAAAHic/r48Jeq7Vlzc/s1600/mkspir.png);
overflow-y:auto;
margin:0;
}
.mkstylepopup {
width:733px;
height:350px;
position:fixed;
top:50%;
left:50%;
margin-top:-195.5px;
margin-left:-359.5px;
}
#mkstylepopup {
overflow:none;
background-image:url(http://s26.postimg.org/tej32qoax/Subscribe_newsletter.png);
background-repeat:no-repeat;
}
#mkstylepopup #mkstylepopupdivfblikebutton {
position:absolute;
top:198px;
left:269px;
}
#mkstylepopup #mkstylepopupdivytsubscribe {
position:absolute;
top:192px;
left:389px;
}
#mkstylepopup #mkstylepopupdivgetthis {
position:absolute;
top:329px;
left:675px;
}
form#mkstylepopup {
display:block;
margin:0;
}
form#mkstylepopup #ksfield {
position:absolute;
top:251px;
left:220px;
width:341px;
font-size:16px;
border:none;
background:transparent;
padding:10px;
}
form#mkstylepopup #ksbutton {
position:absolute;
left:563px;
top:251px;
width:108px;
height:43px;
border:none;
background:transparent;
}
#mkstylepopup #copyright {
position:absolute;
left:670px
top:331px;
width: 110px;
}
#mkstylepopup #copyright a{
font-size:10px;
color: #999;
font-family: Electrolize , Arial, sans-serif;
}
</style>
<!--[if lte IE 6]>
<style type="text/css">
/*<![CDATA[*/
html {overflow-x:auto; overflow-y:hidden;}
/*]]>*/
</style>
<![endif]-->
<div id="ks-style-v4-popup-main" style="display:none;">
<div id="mkstylepopupdiv">
<div id="mkstylepopup" class="mkstylepopup">
<div id="mkstylepopupdivfblikebutton">
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.3";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like" data-href="https://www.facebook.com/karthikofficialpage" data-layout="button_count" data-action="like" data-show-faces="false" data-share="false"></div>
</div>
<div id="mkstylepopupdivytsubscribe">
<script src="https://apis.google.com/js/platform.js"></script>
<div class="g-ytsubscribe" data-channel="karneeluu"></div>
</div>
<center style="color:#000;cursor:pointer;float:right;margin-right:0px;margin-top:0px;" onmouseup="document.getElementById('mkstylepopupdiv').style.display='none'">
<img src="http://s26.postimg.org/aor3lzvk5/closebtnks.png"/>
</center>
<form id="mkstylepopup" action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=blogspot/uXNEGG', 'popupwindow', 'scrollbars=yes, width=600, height=550'); return true">
<input type="hidden" value="blogspot/uXNEGG" name="uri"/>
<input class='emailinput' id='ksfield' name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Enter your email&quot;;}' onfocus='if (this.value == &quot;Enter your email&quot;) {this.value = &quot;&quot;}' type='text' value='Enter your email'/>
<input type="hidden" name="loc" value="en_US" />
<input type="image" src="http://3.bp.blogspot.com/-380kiAZ85g0/U0a58SZ7-0I/AAAAAAAAHi0/kusJh7kaSOg/s1600/kstnn.gif" id="ksbutton" />
</form>
<div id="mkstylepopupdivgetthis">
<a href="http://karthiktechfreak.blogspot.in/" target="_blank"><img border="0" src="http://s26.postimg.org/x9mh5b7gl/getthis.png" /></a>
</div>
</div>
</div>
</div>

In the Above Code You need to Edit Four things.
1. Background PSD File
2. Facebook Link
3. YouTube Channel Name
4. Feedburner ID

Watch Below Video For Detail Instructions On How to Edit Above Things. 

No comments:
Write comments