Feedburner Is A Subscription Service Provided By Google Which Automatically Mails Your Articles To Your Subscribed Users Automatically . This Service Allows Everybody Who Is Interested In Your Blog And Its Content To Get Your Articles Straight To Their Inbox Automatically . This Can Easily Increase Your Traffic If You Have A Lot Of Subscribed Users . So , Here We Are Presenting A Widget Which Can Be Put Up At The End Of All Posts Automatically And Can Gradually Increase Your Feedburner Mailing List And Can Definetely Increase Your Traffic As Each Time You Publish A Post , It Is Being Notified To Your Mailing List in Feed Burner . This One Of the Best services Provided By Google . This FeedBurner Newsletter Widget Is Created By Envy Blogging And Please Dont Reproduce This Article Without The Permission Of Author . This Widget Is Made With HTML And CSS . It Will Not slow Down Your Blog Load Time . if Any Problem Occurs , Feel free To Comment Here .
STEPS
1 . Go To Blogger - Template - EDIT HTML
2 . Now Find <data:post.body/>
3. You May Find Two Or Three <data:post.body/> In Your Template
4. Copy And Paste The Below Code Above <data:post.body/>
5. One By One And Try To Find which Is the Right One .
3. You May Find Two Or Three <data:post.body/> In Your Template
4. Copy And Paste The Below Code Above <data:post.body/>
5. One By One And Try To Find which Is the Right One .
6. Now Customize the highlighted Places With Your usernames .
- Change The Orange Highlighted Colour With Your Desired Text That Should Be Shown
- Change The Yellow highlighted Text With Your Feedburner Username .
HTML/CSS Coding
<!-- Newsletter Widget By www.envyblogging.blogspot.in -->
<style>
#envy-subsbox {
height:300px;
width:500px;
background:hsla(0,0%,95%,0.4);
padding:10px;
border:5px solid hsla(0,0%,67%,0.19);
border-radius:10px 10px 10px 10px;
}
#envy-subsboxh3 {
text-align:center;
margin:10px;
text-transform:uppercase;
font-weight:bold;
font-family:'Merienda';,cursive;
font-size:1.4em;
letter-spacing:1px;
}
#envy -subsboxheader {
border-bottom:1px solid #ddd;
border-top:1px solid #ddd;
font-size:16px;
padding-bottom:10px;
font-family:'Marmelad',sans-serif;
text-align:left;
}
.envy-subsbox-form {
padding:20px;
}
#envy-subsboxheader img {
padding-right:10px;
}
.envy-subsbox-name {
background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHWr230rRb64rmfOjJCwsUqPDIfynFcUvUb_ZaK4jkzp5vwTJd9RiD3DjOJMpqkQRLfd7knDZmJGIRAma_EQfY-NspbqXwWbpEVg6ov5wOBTOGupacoey7HRgly09xd-iAQ6KNBq7v6DY/s320/name.png) no-repeat 7px 8px;
border:1px solid #ddd;
font-family:Arial,sans-serif;
font-size:13px;
font-weight:bold;
color:hsla(0,0%,27%,0.69);
width:90%;
height:24px;
padding:5px 15px 5px 28px;
vertical-align:top;
display:inline-block;
}
.envy-subsbox-email {
background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-lxMFi9onDcp688ycmIuaLWpBbNvH-nhvTmjkSwAuPLjnrEzvrDXDthBiLKzL9wPFqFPECLwvRQNGOCCRNviHOzn9RC0HY3Wi5By9s-rkUXIjg-k3ADC9SQaekM1qnIu6ubte35XkP3U/s320/email.png) no-repeat 7px 10px;
border:1px solid #ddd;
font-family:Arial,sans-serif;
font-size:13px;
font-weight:bold;
color:hsla(0,0%,27%,0.69);
width:90%;
height:24px;
margin-top:10px;
padding:5px 15px 5px 28px;
vertical-align:top;
display:inline-block;
}
.envy-subsbox-name:hover,.envy-subsbox-email:hover {
border:1px solid #bebebe;
box-shadow:0.5px 1.5px 2px rgba(5,95,255,.1);
}
.envy-subsbox-submit {
float:right;
margin-top:20px;
-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
box-shadow:inset 0px 1px 0px 0px #ffffff;
background:-webkit-gradient( linear,left top,left bottom,color-stop(0.05,#ededed),color-stop(1,#dfdfdf) );
background:-moz-linear-gradient( center top,#ededed 5%,#dfdfdf 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed',endColorstr='#dfdfdf');
background-color:#ededed;
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
border:1px solid #dcdcdc;
display:inline-block;
color:#777777;
font-family:arial;
font-size:15px;
font-weight:bold;
padding:6px 24px;
text-decoration:none;
text-shadow:1px 1px 0px #ffffff;
}
.envy-subsbox-submit:hover {
background:-webkit-gradient( linear,left top,left bottom,color-stop(0.05,#dfdfdf),color-stop(1,#ededed) );
background:-moz-linear-gradient( center top,#dfdfdf 5%,#ededed 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf',endColorstr='#ededed');
background-color:#dfdfdf;
}
.envy-subsbox-submit:active {
position:relative;
top: 1px;
}
</style>
<link href='http://fonts.googleapis.com/css?family=Marmelad' rel='stylesheet' type='text/css'/>
<link href='http://fonts.googleapis.com/css?family=Merienda' rel='stylesheet' type='text/css'/>
<center>
<div id='envy-subsbox'>
<div id='envy-subsboxh3'>
Subscribe To Our Newsletter
</div>
<div id='envy-subsboxheader'>
<a href='http://goo.gl/6rQJK'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHhnHIfZfBvj55VApEu7YbrhyqzlblwBvmGwVi0nQrq1SrywTWMKyJoXLbnfDGM1hitRsvLauHbyX5C3V4kAQSJUtnHWNbpo82xM0TAGfCA-HGtsnes5azpQ1MZhT__djrHTMoNY2gC78/s1600/mail-icon.png' style='float:left;'/></a>
<p style='margin-top:13px;'>
Sign Up To our Newsletter Now To Get Professional Tutorials About Widgets, Blogging Tips , Make Money And SEO. It's 100% Free!
</p>
</div>
<form action='http://feedburner.google.com/fb/a/mailverify?uri=envyblogging' class='envy-subsbox-form' method='post' target='_new'>
<input class='envy-subsbox-name' name='name' onblur='if (this.value == '') {this.value = 'Your Name';}' onfocus='if (this.value == 'Your Name') {this.value = '';}' value='Your Name'/>
<input class='envy-subsbox-email' name='email' onblur='if (this.value == '') {this.value = 'Your Email Adress';}' onfocus='if (this.value == 'Your Email Address') {this.value = '';}' value='Your Email Address'/>
<input class='envy-subsbox-submit' type='submit' value='Sign Up!'/>
</form>
<p style='font-family:times new roman;margin-top:10px;font-size:15px;'>
<b/>
</p>
</div>
<br/>
</center>
</b:if>
it's really cool and stylish Rizwan!
ReplyDelete