Add css feedburner email subscription widget in blogger blog. ~ Blogger Tips And Tools |Latest Blogger Tricks| SEO Tips

Hi friends now add this special feedburner email subscription widget box in blogger with social network.

PREVIEW:-

Follow simple and easy step to adding this special box in blogger ---->>>

* First go to your blogger Dashboard.

* Now click in design tab and edit HTML.

* Click in small box to expand your blogger Template.

* Now find this code ]]</b:skin> by CTRL+F key.

* Copy below code and paste before ]]</b:skin>

.sociallinks ul{
font-family:Oswald;
}
.sociallinks ul li{
float:left;
width:90px;
padding-left:55px;
margin:0 0 0 5px !important;
line-height:48px !important;
}
.sociallinks ul li a{
font-size:20px !important;
}
.sociallinks ul li.w2brss{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisrXto3ZgfG0IkHfVsVDTvaywyl5eTmrATa5F4kG4WCQnuDu6gGUro6Q_9yvOnVwmEz81R7P0Z9e8-FGSOHQ7chFPYYNdM5La9plcd-J4BPmS1qqg_Lx6M07zGuMZ1yGS6ETdCD3uj2WuO/s48/RSS.png) no-repeat scroll left center transparent;
}
.sociallinks ul li.w2bmail{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEja59XY4uPzXJVuXn3rTOWucRsXzyJSU1h05Jp-KETTI2dIeNQ-nUq5byW8uLXQX7dJYvdJ26MqrhTtfBf8qCslXFUIWt1cm5IKSJ-LHnN1M2BulPvuMuRD5Emc0v-VeF7LMedFiOatSSg0/s48/Mail.png) no-repeat scroll left center transparent;
}
.sociallinks ul li.w2btwitter{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_O2gHtP6WUg1kRlzwFbUljk-dG9BF-kQ4oXd7jFiSJ0N9-bzEyo0vQ_WqsSEfDoSYq7QluH08u3ICuVFugLriHP2Zb7aFdAXoTZs9uzDp-M9QL6oRcBFiWtT_PIERFmlv0QPelJEwBq5L/s48/Twitter2.png) no-repeat scroll left center transparent;
}
.sociallinks ul li.w2bfacebook{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqo8Aez9Fo-KiLlyScGT9h17l6vrSshU-sI4BYFvUCZY3eAF13H7Qyg1WrXXEM17-WgTAs3HNYhHNYoPc7rQv51R2C1K0V9b8bAeMe7ivg0NbjoJaLqd6OZYPZ-pPMnJLsq41d8RgVVhhF/s48/Facebook.png) no-repeat scroll left center transparent;
}
form.emailform{
margin:20px 0 0;
display:block;
clear:both;
}
.emailtext{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3HfSLewFQvXoE9B67aGp8-ZBrLh1wxjLwzqEZc5ALTZKgaHAVUT0AN0ZjGLWk0l5frGnQJT1hIwKKffKJ325Tn0zvmabo8dpy-oC8y2BnXNlBuNwXUTZUbObpOdgJtfhcG2Kgtc98piMG/s28/w2b-mail.png) no-repeat scroll 4px center transparent;
padding:7px 15px 7px 35px;
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;
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%);
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
}

* Now click to save your blogger Template.

* Again go to your blogger Dashboard.

* Click in design tab and you are here--->>> Page element.

* Click in add Gadget which is in your blog sidebar.

* When open new window click in HTML/javascript from list.

* When open new blank box copy below code and paste in blank box.

<div class='sociallinks'>
<ul>
<li class='w2brss'><a target='_blank' href='YOUR FEEDBURNER EMAIL URL HERE'>RSS</a></li>
<li class='w2bmail'><a target='_blank' href='http://feedburner.google.com/fb/a/mailverify?uri=YOUR FEEDBURNER URL LAST NAME'>Em@il</a></li>
<li class='w2btwitter'><a target='_blank' href='YOUR TWITTER URL HERE'>Twitter</a></li>
<li class='w2bfacebook'><a target='_blank' href='YOUR FACEBOOK URL HERE'>Facebook</a></li>

</ul>
</div>
<br />
<div style="text-align: left; display: inline-block;">
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('YOUR FEEDBURNER EMAIL URL HERE', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" class="emailform">

<input type="hidden" value="Anilhindustani" name="uri" />
<input type="hidden" name="loc" value="en_US" />
<input type="text" 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;}" value="Enter your email..." name="email" class="emailtext" />
<input type="submit" class="ebutton" value="SignUp" title='' al='' />
</form>
</div>
</div>
<div class='clear'></div>