All In One New Cool Buttons Subscribe By Email Widget For Blogger

A new subscription box it contains your backlink to your RSS OR ATOM feeds along with a fabulous Email Form this brings you targeted visitors.They can easily submit their Email address username id so that they can obtain latest updates right from your website. Blog site without having a subscription form makes no experience. Subscribers are actually the central source for every profitable website. A lot more audience you have got the better you will get. Most people subscribe for your Rss feeds exclusively whenever you share high quality articles. 

[post_ad]For that reason it is extremely valuable that you can test every single practical way of boosting the amount of subscribers on your blog site no matter whether you can be a Wordpress end user or even Blogger user. Just one simple and most prominent option to take is always to squeeze in a subscription box widget to all your blog page and spot the plugin close to the top part region of your blog just beneath the header.

What Is The Right Place To Place This Widget On A Blog?

Make sure your subscription box towards the top right or eventually left placement of the sidebars to catch the attention of plenty of people as you can.An outstanding subscription form by using pleasant icons and Email Text box does always draw in people to sign up for your updates.That will increase your loyal readers

Special Features Of This Subscribe Box Widget

• SEO optimized added nofollow tag to external links.
• Fast loading coding are located on their own server.
• Unique widget to attract your loyal readers.
• East to use no complicated stuff.
• Just two-step installation.
• A large email image and a tag line can be modified.
• Subscribe to facebook,Twitter,RSS,Youtube and email listings.
• Hover effect for icons.
• You can also add this plugin to you wordpress.
• No javascript coding so it can load much more faster than ever.

Live Demo

                                    

Css Part

Add this below code to above ]]></b:skin> tag and save it.

/* Social &Newsletter Widget *//* Social */.social {
background:#fcfcfc;
height:80px;
padding:0 15px;
border-bottom:1px solid #f0f0f0;
}


.social li {
float:left;
width:52px;
margin-right:15px;
text-align:center;
}


.social li.last {
margin-right:0;
}


.social li a {
opacity:0.6;
filter:alpha(opacity=60);
font-size:11px;
color:#666;
padding-top:42px;
line-height:34px;
}


.social li a:hover {
opacity:1.0;
filter:alpha(opacity=100);
color:#666;
text-decoration:none;
}


.social .social-feed {
display:block;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjbZOOLwhl3BA9HwckZvucS4Qw2e0vAfVSp-yR3oM54MVqRi6m9CQQuP-l-SnzH3aFOnwuZBDxsqxmMW2od8JBhHHPys4gh_l7DdJdqk3jKicO7S1b6B46E3PV5AnY710I84Jk7o7Ar94/s1600/ico-social-rss.png) no-repeat;
}


.social .social-twitter {
display:block;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFL2ygz4g0HntvDaNdEdWZSED0Bt6akLJYTmf3TVxRNeTIZs2ID21BdgCY78SPbC426KS5OaSHzhBnMloxGyf2kyTEh2_7IDPxE_3ijx2CprHdET1V1j23F-YRg90mkjn439YRuLLDXuY/s1600/ico-social-twitter.png) no-repeat;
}


.social .social-facebook {
display:block;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7O2Po6ik-1J3wrcUBjhetrJWFeBnLxq8Ki3aAcuyCeRKXD-LnxGZSQiXYHmMnoP7DMmijz2rx5jPJQ8DoEP9nfLay2YdVf0TR-r4M8cI8q7EYfTaCeLQc-ucDx7kA5Y3X2Bht63CoocY/s1600/ico-social-facebook.png) no-repeat;
}


.social .social-youtube {
display:block;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJrQcsgsZBgSfkGVhWpn6DpCb1A4wvzkqV81eX2IwdMPy_DtR2U7QnxqP8BbD4mNGHTH-zJidBFcbQ3cUnT5h9BoLvQKwo_xZCfYQpX-GROQ-K760oN2qfGeIowX-9VUVOJgb2gua1vqE/s1600/ico-social-youtube.png) no-repeat;
margin-right:0;
}

form.emailform {

margin:20px 0 0;

display:block;

clear:both;

}

.emailtext {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgfQ74FunjjgnvhvLJCbpBAC94lRFTnC4KLRdNGaRl0LyikWHNk3vnycUbK7E12jXLZkApm0jxkzBI39DbJIFZAgIUZCsP901YGDESP7c4ex0ujZ3Wucdt0EnN6PChFaFxSXbS9mbLeY-x/s28/w2b-mail.png) no-repeat scroll 4px center transparent;
padding:7px 15px 7px 33px;
color:#444;
font-weight:bold;
text-decoration:none;
border:1px solid #D3D3D3;
-moz-border-radius:4px;
-webkit-border-radius:4px;
border-radius:4px;
-moz-box-shadow:1px 1px 2px #CCC inset;
-webkit-box-shadow:1px 1px 2px #CCC inset;
box-shadow:1px 1px 2px #CCC inset;
}

.ebutton {

color:#444;

font-weight:bold;

text-decoration:none;

padding:6px 15px;

border:1px solid #D3D3D3;

cursor:pointer;

-moz-border-radius:4px;

-webkit-border-radius:4px;

-goog-ms-border-radius:4px;

border-radius:4px;

background:#fbfbfb;

background:-moz-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);

background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #fbfbfb), color-stop(100%, #f4f4f4));

background:-webkit-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);

background:-o-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);

background:-ms-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);

filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#FBFBFB', endColorstr='#F4F4F4', GradientType=0 );

background:linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);

}

HTML Part

Add this below code to html/javasript widget to your layout of your blog and save it.

<div class="widget-content">

<div style="border: 1px solid DodgerBlue; padding: 1mm;">
<center><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiv-uT-D-glBYA7f4F1VtV4c8Gx-PyIQy_5CguaauZaKancLTneFRCjiDc4vMyxRSdJaN0ycHdtPCOollSDYnBIOy_-59GGSIsKqk_bdpPUOGe-s2QtUxOZzp_cSFclDczOl6rzvk-26sU/s1600/email-px-png.png" /></center>
<center><span style="font-weight: bold;font-size:small;">Subscribe by E-mail &amp; receive free updates of these cool Tips N Tricks straight to your inbox!</span>


<ul class="social">
  <li><a class="social-facebook" href="https://www.facebook.com/pages/Softechnogeek/288154374528988" rel="nofollow" target="_blank">Facebook</a></li>
  <li><a class="social-twitter" href="http://twitter.com/softechnogeek" rel="nofollow" target="_blank">Twitter</a></li>
<li><a class="social-feed" href="http://feeds2.feedburner.com/softechnogeek" rel="nofollow" target="_blank">RSS</a></li>
  <li><a class="social-youtube" href="http://www.youtube.com/user/softechnogeek" rel="nofollow" target="_blank">YouTube</a></li>     
 </ul>
</center>


<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" class="emailform" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=softechnogeek', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">


<input type="hidden" value="softechnogeek" name="uri" />
<input type="hidden" name="loc" value="en_US" />
<input type="text" value="Enter your email..." name="email" class="emailtext" 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;}" />
<input type="submit" class="ebutton" value="SignUp" title="" alt="" />
</form>
<center>
<span class="Apple-style-span" style="color: rgb(51, 51, 51); font-family: 'Trebuchet MS', Trebuchet, Arial, Verdana, sans-serif; font-size: 10px; font-style: italic; background-color: rgb(255, 255, 255); ">Your email address will not be shared with anyone</span>
</center>
<div dir="ltr" style="text-align: left;" trbidi="on">
<a href="http://softechnogeek.blogspot.com/" target="_blank" title="Blogger Widget"><span style="font-size: xx-small;">Blogger Widget »</span></a></div>
</div>
</div>

Note:Highlighted red part should be changed with you suitable id If you have any bug or modification just post below your comments so that i can solve it

Watch The Video Tutorial On How To Add Subscription Box For Blogger

Get the best tips from Softechnogeek in your inbox, free!