Force to Subscribe Widget for Blogger Blog

After another busy weekend,I returned with another cool post.I was mentioned that how to attract readers to your blog and make them stay.Now Im going to tell about how to force your visitors to subscribe to your blog updates.
Its really nice to get more subscribers to our blog.You already know that subscribers are the returning wealth of a blog.If you have a good amount of subscribers,you don't worry about the traffic(I mean,it never down).Its not so easy to get much subscribers to your blog because most of the subscribers are lazy to subscribe.So sometimes we have to force them to subscribe.
Adding the below widget is a good way to force the people to subscribe to your updates.check the screenshot:

Now how to add this subscription widget to your blogger blog.Follow the steps to make it easy:
Step 1 : Login to your blogger account >> Design(Layout) >> Add a Gadget
Step 2 : Choose html/JavaScript


Step 3 : Paste the below code inside it
<style type='text/css'>

.wb a{
    color: #6e6e6e;
    font: bold 12px Helvetica, Arial, sans-serif;
    text-decoration: none;
    padding: 7px 12px;
    position: relative;
    display: inline-block;
    text-shadow: 0 1px 0 #fff;
    -webkit-transition: border-color .218s;
    -moz-transition: border .218s;
    -o-transition: border-color .218s;
    transition: border-color .218s;
    background: #f3f3f3;
    background: -webkit-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
    background: -moz-linear-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
    border: solid 1px #dcdcdc;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
}
.wb a:hover {
    color: #333;
    border-color: #999;
    -moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2)
    -webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}

.wb a:active {
    color: #000;
    border-color: #444;
}


.wbbar{ width:280px; float: left; margin-left:3px; margin-top:5px; padding:0;}

.wbbar .emailsub{border-bottom: 0px solid #e6e6e6; padding: 0px 0 15px 0; float: left; width: 100%; font-family: Helvetica, Arial;}

.wbbar .emailsub .emailupdatesform{width: 100%; float: right; padding:0px;}

.wbbar .emailsub .emailupdatesform input.emailupdatesinput{background: #F3F3F3;  float: left; border: 1px solid #dcdcdc; padding: 0px 8px; color: #989898; font-size: 14px;  width: 130px; height:30px;   border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;}

.wbbar .emailsub .emailupdatesform input.emailupdatesinput:hover{

border-color: #999;
    -moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2)
    -webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}



.wbbar .emailsub .emailupdatesform input.joinemailupdates:hover{ border-color: #666;
    -moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2)
    -webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15); cursor:pointer;
}

.wbbar .emailsub .emailupdatesform input.joinemailupdates{
border: solid 1px #dcdcdc;
    background: #F3F3F3;
   font-family:Helvetica, Arial;
text-transform: none; color: #989898; height: 25px; padding: 0 10px; margin: 0 0 0 5px; font-weight:bold; font-size:14px; height:30px;
  border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
}



.wbbar .emailsub .emailupdatesform input.emailupdatesinput{background: #F3F3F3;  float: left; border: 1px solid #dcdcdc; padding: 0px 8px; color: #989898; font-size: 14px;  width: 145px; height:28px;   border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;}

.wbbar .emailsub .emailupdatesform input.joinemailupdates{
border: solid 1px #dcdcdc;
    background: #F3F3F3;
   font-family:Helvetica, Arial;
text-transform: none; color: #989898; height: 25px; padding: 0 0px; margin: 0 0 0 5px; font-weight:bold; font-size:14px; height:30px;
  border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
}

</style>


<!--[if IE 8]> <style>
.wbbar .emailsub .emailupdatesform input.emailupdatesinput{background: #F3F3F3;  float: left; border: 1px solid #dcdcdc; padding: 5px 10px; color: #989898; font-size: 12px;  width: 130px; height:18px;   border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;}

.wbbar .emailsub .emailupdatesform input.joinemailupdates{
border: solid 1px #dcdcdc;
    background: #F3F3F3;
   font-family:Helvetica, Arial;
text-transform: none; color: #989898; height: 25px; padding: 0 5px; margin: 0 0 0 5px; font-weight:bold; font-size:14px; height:30px;
  border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
}





</style> <![endif]-->





<div class="wb" style="padding: 0pt 0pt 0pt 5px;">
<table><tbody><tr>

<td>
<a   href="ADD-FEEDBURNER-LINK-HERE" rel="nofollow" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiA94PIIy78SO8_ZiiNhxmgyd0o8LjcfCyBymPZgqu0qUecSKavnk4jd2ESI311KpdDVexCgc66a7DT2KPudvbQMUWy7p1BROGK2duVlWU6t_y1g-NNqJRyg-pEwcdkx0PJj0-UgmK74eY/s1600/rss.png" border="0"></a>
</td>

<td>

<a style="margin-left:5px;"href="ADD-TWITTER-FAN-PAGE-LINK-HERE" rel="nofollow" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGIUDVj-AWtKY4bCo8bYE5sJbutLj_DoxWqV4ZZ6E1nIH-iDBB3P5CVmACbKF47vo3kt9axCjRxZWhwt0uBJXmOg27TKYknXV-dMO0OwhCdR456eTC5zXbnEhRejUpBq16PB8Xv8TL2U0/s1600/twitter.png" border="0"></a>
</td>

<td>
<a style="margin-left:5px;"href="ADD-FACEBOOK-FAN-PAGE-LINK-HERE" rel="nofollow" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVTUzuUO1GX_a-0Q92lG9UZ7VdEgzTs3hU_d2dzu9Jvi4umDBLROCDVXBvVt420C9vQ7ZHssQ3kmsASg7y6BXH0cp30CO92NSXIInuc1cet0QKnEQI__o2hYViQCptdooBK44j214V1RE/s1600/facebook.png" border="0"></a>
</td>

</tr></tbody></table>
<div class="wbbar">
<div class="emailsub">
<div class="emailupdatesform">
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=tntbystc', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><input gtbfieldid="10" class="emailupdatesinput" name="email" value="Submit email..." onblur="if (this.value == &#39;&#39;) {this.value = &#39;Submit email...&#39;;}" onfocus="if (this.value == &#39;Submit email...&#39;) {this.value = &#39;&#39;;}" type="text" /><input value="tntbystc" name="uri" type="hidden" /><input value="Subscribe" class="joinemailupdates" type="submit" /></form></div></div></div></div>

</div>
Make some changes:
* Change tntbystc to your feedburner RSS name.
* Replace the bolded text to your feedburner,twitter and facebook links.
Step 4 : Give a title to your widget.
Step 5 : Save and view your blog.
If You Like This Post. Please Take 5 Seconds To Share It.

Technorati Digg This Stumble Stumble Facebook Twitter

Never Lose a Single Update From Us..!!

 

Copyrights

Protected by Copyscape DMCA Takedown Notice Checker

About the Author

My Photo
Mohamed Naseef
Naseef is a Freelance writer and Blogger with several years Experience.In his Spare time,he enjoys his busy school days and write for top websites.
View my complete profile