Have lesser number of email subscribers? Even if you have a huge amount of daily visitors, if you don't have a good amount of email subscribers then that's bit nasty. Email subscribers are something valuable as far as a blogger is concerned, they are the peoples who loves him and his content. But even if you had some high quality contents with you, that really cant increase your email subscribers in a large number.
It is about how much attractive is your email subscription widget. Here we have a eye-catching email subscription widget for you. Which will easily catch the attention of your visitors which may result in a subscription. This widget is originally a part of Streamline Wordpress theme by Studiopress and we have made some changes to make it available for blogger platform.
Screen Shot
Adding Feedburner Subscription Widget in Blogger
Step 1: Go to your blogger dashboard >> Layout >> Add a Gadget:
Step 2: Now from the list find out 'HTML/JavaScript' and select it.
Step 3: Now copy-paste the below code into it and click the orange save button.
<style>
.enews h4 {
background: none;
color: #fff;
font-size: 26px;
padding: 0;
text-align: center;
text-shadow: 1px 1px #333;
}
.enews #subbox {
background: #fff;
padding: 10px;
width: 80%;
}
.enews #subbutton {
-moz-border-radius: 3px;
-moz-box-shadow: 0 1px 1px #a24a1d;
-webkit-border-radius: 3px;
-webkit-box-shadow: 0 1px 1px #a24a1d;
border-radius: 3px;
box-shadow: 0 1px 1px #a24a1d;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMTfVMOtQqjG5kW1Ur-QX-0_GPPUxgiTt1oAGME28W_HfylBoWhsJpVU8WCBLLIqgy_1A0aQcXyP0gubmGwqc6XJdimdMSi5FvtguO98p7kxO2A9ydGmQeTZe0eGCvnBUQfXMT_y1CtDWz/s1600/button-light.png) 0 0;
border: none;
color: #333 !important;
font-size: 14px;
font-weight: bold;
margin: 0 auto;
padding: 10px 15px;
text-shadow: 1px 1px #fff;
text-transform: uppercase;
}
input[type="button"],
input[type="submit"],
a.more-link {
-moz-border-radius: 3px;
-moz-box-shadow: 0 1px 1px #ccc;
-webkit-border-radius: 3px;
-webkit-box-shadow: 0 1px 1px #ccc;
border-radius: 3px;
box-shadow: 0 1px 1px #ccc;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAlRSZGybZlea0hNMOSbmxSp0Uk9u7NJ8SQkgxEkq3e6B4xfy4Vh3dnphahl0ARea4HIszEcn5uJ3h4_m51w9cz6qJGmCApJGv4W2GWvgFQ5ZbtUKwa6yg1ZpXG0v1hqQSmj-VT_56Smh3/s1600/button.png) 0 0;
border: none;
border-bottom: 1px solid #b15120;
color: #fff !important;
font-size: 13px;
font-weight: normal;
padding: 8px 12px 6px;
text-decoration: none;
text-shadow: 1px 1px #a1491d;
}
.enews #subbutton:hover {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMTfVMOtQqjG5kW1Ur-QX-0_GPPUxgiTt1oAGME28W_HfylBoWhsJpVU8WCBLLIqgy_1A0aQcXyP0gubmGwqc6XJdimdMSi5FvtguO98p7kxO2A9ydGmQeTZe0eGCvnBUQfXMT_y1CtDWz/s1600/button-light.png) 0 -40px;
}
input:hover[type="button"],
input:hover[type="submit"],
a.more-link:hover {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAlRSZGybZlea0hNMOSbmxSp0Uk9u7NJ8SQkgxEkq3e6B4xfy4Vh3dnphahl0ARea4HIszEcn5uJ3h4_m51w9cz6qJGmCApJGv4W2GWvgFQ5ZbtUKwa6yg1ZpXG0v1hqQSmj-VT_56Smh3/s1600/button.png) 0 -40px;
cursor: pointer;
}
.enews h4 {
background: none;
color: #fff;
font-size: 26px;
padding: 0;
text-align: center;
text-shadow: 1px 1px #333;
}
.enews h4 {
margin-bottom: 10px;
text-shadow: 1px 1px #a1491d !important;
}
.enews {
background-color: #e96a2a;
margin: -5px;
min-height: 201px;
padding: 20px 10px 20px;
text-align: center;
}
.enews p {
color: #fff;
text-shadow: 1px 1px #a1491d;
}
.enews #subbox {
-moz-box-shadow: 1px 1px 3px #ccc inset;
-webkit-box-shadow: 1px 1px 3px #ccc inset;
background: #fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikLy4qruB5b4ADXiYMHNSvSIMcYJddd7DuBV4wQRQpaYkqZdLlVy7bUwkeKgs5nYkhvw0R5oOwxWyPJPshuAsD1QPbe39fI4CYwyqeoDL3O0sSooc4o5vWF7ZC-4sdN3Zbh-zseWiVY8td/s1600/enews.png) center left no-repeat;
box-shadow: 1px 1px 3px #ccc inset;
border-left: 1px solid #9e6e56;
border-top: 1px solid #9e6e56;
color: #aaa49f;
font-size: 11px;
font-weight: bold;
margin: 0 10px 15px;
padding: 14px 10px 12px 50px;
text-transform: uppercase;
width: 195px;
}
</style>
<div id="enews-2" class="widget enews-widget"><div class="widget-wrap"><div class="enews"><h4 class="widgettitle">Email Newsletter</h4>
<p>Join over 155,000 people who get free and fresh content delivered automatically. </p>
<form id="subscribe" action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open( 'http://feedburner.google.com/fb/a/mailverify?uri=tweaks123', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input type="text" value="Enter your email address …" id="subbox" onfocus="if ( this.value == 'Enter your email address …') { this.value = ''; }" onblur="if ( this.value == '' ) { this.value = 'Enter your email address …'; }" name="email" />
<input type="hidden" name="uri" value="tweaks123" />
<input type="hidden" name="loc" value="en_US" />
<input type="submit" value="Sign Up" id="subbutton" />
</form>
</div></div></div>
Now reload your blog to see the stylish subscription widget live on your blog. For better results you can place it at the top of the sidebar.
Coustomization
- To change the background colour, replace #e96a2a.
- Replace tweaks123 with your feedburner ID.
Faced any problem while installing this widget? Then please share it via the comment box below. If you really liked this widget then please subscribe to us by registering your mail id here.
No comments:
Post a Comment