Hello Bloggers today er're going to show that how to add Newsletter Email Subscription Widget In Blogger blogs in ending of each posts and sidebar. we've developed a simple but useful email subscription widget for blogger blog. It also help to increase you email subscribers. In Today's time the email subscription widget is very necessary for every bloggers and webmasters this is important role in blogging world. They help your getting high number of traffic and also increase your blog page views.. Not only they help in traffic but they also give support in getting other ads network approved and Google Adsense or any other Affiliates Programs.This is a clean, simple and attractive widget which is obviously going to help you in building the email subscribers list. This widget is build with only two programming languages which are CSS3 and HTML. After developing this, we've checked it in several most popular browsers and we came to know that it's working pretty cool in every browser. It consists of a title on the top, little description along with cool icon to tell the subscriber that what he will receive, two input fields which are Name and Email Address, a little line for telling your visitors that we'll not spam and in the last, an awesome Sign Up button. This widget is having 500 pixels width, So the best place for adding this widget is below every post. There you have more chances of getting new subscribers. Before you get this widget in your blog, have a live look on this widget by pressing the below button.
How To Add Newsletter Email Subscription Widget In Blogger Blogs?
- Go To Blogger Dashboard>>Template>>Edit HTML
- Find below code Using (Ctrl+F)
<data:post.body/>
- After finding the right code paste the following below code just below <data:post.body/>
<b:if cond='data:blog.pageType == "item"'>
<!-- Newsletter Widget By Www.nextbloggertricks.Com -->
<style>
#NBT-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;
}
#NBT-subsboxh3 {
text-align:center;
margin:10px;
text-transform:uppercase;
font-weight:bold;
font-family:'Merienda';,cursive;
font-size:1.4em;
letter-spacing:1px;
}
#NBT-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;
}
.NBT-subsbox-form {
padding:20px;
}
#NBT-subsboxheader img {
padding-right:10px;
}
.NBT-subsbox-name {
background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNIZio9mlz2UCgOpWWK_gMJeMQ30AVtLQXOnNjYK1zpv4uRqKOYJOy_qOgi3HHES3DAhchU8pLa6zb9-QRevwN9L0ZdlWa5q205rBhZPOvIwG-aozQuwSjEzXNiZbKAI2hHjngghN0qE8/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;
}
.NBT-subsbox-email {
background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRN9E22mm51rqz538qQ4QlBkB5J9GffqC4uNj-X2cmx2Dz5J5bpv_YgBEw6_cVzkkpRw5w04yuKtXDoXZi4HW0QttrHnhOPe1am4HSmGQQwK8rdCkfhhHvWHM7wNb0B4PAtvOwQoGSxiA/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;
}
.NBT-subsbox-name:hover,.NBT-subsbox-email:hover {
border:1px solid #bebebe;
box-shadow:0.5px 1.5px 2px rgba(5,95,255,.1);
}
.NBT-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;
}
.NBT-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;
}
.NBT-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='NBT-subsbox'>
<div id='NBT-subsboxh3'>
Subscribe To Our Newsletter
</div>
<div id='NBT-subsboxheader'>
<a href='http://nextbloggertricks.com'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhxaZagHdlvC4SaKhYJ2e5ugAHDLs41WExJ0vOt6aKiqjSRhUemmSuINX68eXgp_45Z6AzRNG0rATp68poQZ5y8dXnygfaK9yYoZS8amS-_7_6I-2A2jU695TCIek4Pgdp5r2GTW33twQ/s1600/mail-icon.png' style='float:left;'/></a>
<p style='margin-top:13px;'>
Sign Up Now To Get Free Pro Tutorials About Search Engine Optimization, Blogging Guide, Blogging Trick, Template, SEO Tricks and Much More. It's 100% Free!
</p>
</div>
<form action='http://feedburner.google.com/fb/a/mailverify?uri=NextBloggertricks' class='NBT-subsbox-form' method='post' target='_new'>
<input class='NBT-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='NBT-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='NBT-subsbox-submit' type='submit' value='Sign Up!'/>
</form>
<p style='font-family:times new roman;margin-top:10px;font-size:15px;'>
<b>We Hate Spam! </b>Really, It's terrible and we never do it.
</p>
</div>
</center>
</b:if>
- Replace NextBloggertricks with your Feedburner Username.
- Replace Sign Up Now To Get Free Pro Tutorials About Search Engine Optimization, Blogging Guide, Blogging Trick, Template, SEO Tricks and Much More. It's 100% Free! with your message which will show in this widget.
- Finally, Click Save Button.
Final Words
So friends, this our small widget and we're back again with the cool blogger widget and This article written by Prajjwal Rajput and this widget developed by Ram Prasad & Prajjwal Rajput
Ram prasad is the owner of the blog myblogingyard he is 16 year old,study in 11 class-(PCB) and have a good interest and experience in blogging. He currently work on two blog and work hard to give you a wonderful blogging experience . ...
No comments:
Post a Comment