It is mandatory for your blog to install a good looking email subscription box. since it will increase your website’s beauty and also it will allow your readers to easily subscribe your blog.
This box looks simple, attractive and good looking font format.It looks exactly as shown in the picture.
All though this widget contains subscribe via email box only.
if you need a blogging widget containing all popular social social profiles you can install all in one social Blogging widget.
Add Email Subscription Widget in Blogger
- Go to blogger dashboard.
- Click on layout
- Click to add a widget
- Select a html/javascipt widget
- Leave title empty and insert the following code into the body section.
<style>
.a1bs-email{
background:url(https://4.bp.blogspot.com/_MbejYjGokMM/TSeZHmWJ6oI/AAAAAAAAALE/93ELYyzmi64/s1600/email.png) no-repeat 0px 12px ;
width:300px;
padding:10px 0 0 55px;
float:left;
font-size:1.4em;
font-weight:bold;
margin:0 0 10px 0;
color:#686B6C;
}
.a1bs-emailsubmit{
background:#9B9895;
cursor:pointer;
color:#fff;
border:none;
padding:3px;
text-shadow:0 -1px 1px rgba(0,0,0,0.25);
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
font:12px sans-serif;
}
.a1bs-emailsubmit:hover{
background:#E98313;
}
.textarea{
padding:2px;
margin:6px 2px 6px 2px;
background:#f9f9f9;
border:1px solid #ccc;
resize:none;
box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1);
-moz-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1);
-webkit-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1); font-size:13px;
width:170px;
color:#666;}
</style>
<div class=”a1bs-email”>
Subscribe via Email
<form action=”http://feedburner.google.com/fb/a/mailverify” id=”feedform” method=”post” target=”popupwindow” onsubmit=”window.open(‘http://feedburner.google.com/fb/a/mailverify?uri=a1bloggerseo‘, ‘popupwindow’, ‘scrollbars=yes,width=550,height=520’);return true”>
<input gtbfieldid=”3″ class=”textarea” name=”email” onblur=”if (this.value == "") {this.value = "Enter email address here";}” onfocus=”if (this.value == "Enter email address here") {this.value = "";}” value=”Enter email address here” type=”text” />
<input type=”hidden” value=”a1bloggerseo” name=”uri”/><input type=”hidden” name=”loc” value=”en_US”/>
<input class=”a1bs-emailsubmit” value=”Submit” type=”submit” />
</form>
</div>
- Replace a1bloggerseo with your own feedburner id.
- Now click on save
- All done..!!!!!!
You can add it in WordPress also. Click here to know how?
I Impressed this nice coding, One thing more which is that , please give some tip for; How to create feed burner Id.
it will be useful for new user. I think you will must post such a important tips.
best of luck for such a great job.
Thnx brooo for ur appreciation. I will post feedburner tutoial within 2 days. stay connected