Searching...
Tuesday, 1 January 2013

Add Top Subscription Widget on your Blogger/BlogSpot blog


You can see this widget on my blog on top. This widget has Big size box that It will increase your subscribers and you will get more email subscribers with this widget and Very easy to Install in your Blog. This Widget is made Compatible to work with all browsers especially with IE8. Today i am giving the Code and How to add the Social Subscription Widget to your Blogger/BlogSpot Blog. Let's start adding this gadget :)

To Check Live demo copy and Paste the given below code into our Live Html editor
How to Install This Widget in your Blogger/BlogSpot Blog?
The steps are made really simple. Follow these,
  • Go To Blogger > Design
  • Select an HTML/JavaScript Widget.
  • Paste the code below into the widget

<!-- Add Top Subscription Widget on your Blogger/BlogSpot blog rnhckr.com -->
<style>
#feature_box{background:#f0f4f4;
border-bottom: 1px solid #D4D4D4;
padding:10px 15px 0px;}
#sleek-subscribe{display: block;
margin:0 auto; }
.newsheadline {
color:#222;
font-size:16px;
line-height:50px;
float:left;
font-weight:bold;
}
.newsheadline span{font-size:38px;
color:#444;
line-height:14px;
font-family: "Droid Sans",arial,sans-serif;
font-weight:normal;
}
.newsheadline cite{font-style:normal;
color:#f00;
}
.signform{
background:urlundefined'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0XKZiW8vwnSd9YE0LERjvAo4aAy_d-GyCtccHQ6ZypDG-zomRnzvst6Rp8E05uctsRY2ukxCQa6i9ALFDGtr8THgpKM4OlguV7Y106y5rd6uuH22pCiqAb8N9Vb4J-VURCfB4Yua5uRo/s1600/arrow.jpg') no-repeat;
padding:0 0 10px 100px;
float:right;
}
.txt2, .txt2:focus{
width:140px;
font-size:15px;
background:#f7f7f7;
color:#004B80;
border:1px solid #E36B0A;
margin:0 5px;
float:left;
padding:10px;
width:160px;
border-radius: 10px;
}
.btn2, .btn2:focus {
background:#E36B0A;
margin:0 5px;
padding:8px 10px 9px;
border:1px solid #AD5513;
color:#fff;
font-size:15px;
border-radius:10px;
}
.btn2:hover{
background:#6689b0;
}
</style>
<div id="feature_box">
<div id="sleek-subscribe">
<div class="newsheadline"><span>Sign up</span> for <cite>FREE</cite> daily Updates.</div>
<form action="http://feedburner.google.com/fb/a/mailverify?uri=rnhckr" class="signform" method="post" target="_new">
<input class="txt2" name="name" onblur="if undefinedthis.value == '') {this.value = 'your name...';}" onfocus="if undefinedthis.value == 'your name...') {this.value = '';}" value="your name...">
<input class="txt2" name="email" onblur="if undefinedthis.value == '') {this.value = 'your email address...';}" onfocus="if undefinedthis.value == 'your email address...') {this.value = '';}" value="your email address...">

<input class="btn2" value="subscribe me!" type="submit">
</form>
<div class="clear"></div>
</div>
</div>
</div>
<!-- Add Top Subscription Widget on your Blogger/BlogSpot blog rnhckr.com -->


  •  Save the widget and you are done!
Now make these changes,
  • To change the any colour with a hexadecimal color of your choice.
  • Replace http://feedburner.google.com/fb/a/mailverify?uri=rnhckr with your feedburner RSS Email Link
  • Replace rnhckr with the Feedburner RSS Email Title which is always written at the end of your FEED Email Link as shown below,
http://feedburner.google.com/fb/a/mailverify?uri=rnhckr

Finally save your template and Visit your blogs to see it working just perfectly.  If still you are getting any single problem then feel free to mention it via comments, I will reply as soon as possible


Sign up for FREE daily Updates.




0 comments:

Post a Comment