Elegant Email Subscription Widget For Your Blogger Blog

Email subscription widgets play important role in increasing the blogs traffic. Many bloggers use it as a machine which gives traffic to their blogs. Creating a attractive email subscription box is smart idea. If you are writing high quality content for your blog readers then it will not let you down. Setting Up a Elegant Email Subscription Widget is not very difficult it is very easy process, you don't need any special training. Today here you can learn how you can add elegant email subscription widget to your Blogger blog. Now let us start working.

How to Add Elegant Email Subscription Widget To Blogger Blog

Go to Template » Edit HTML, click on the sideways arrow next to <b:skin>...</b:skin> and paste the code just above ]]></b:skin> (Press CTRL + F to find it):

#subscriptionwrap {

float: left;

width: 600px;

padding: 15px;

margin-bottom: 20px;

border: 1px solid #ddd;

-webkit-border-radius:5px;     -moz-border-radius:5px;     border-radius:5px;

-webkit-box-shadow:0 1px 0 #f9f9f9 inset,1px 1px 1px rgba(223,223,223,0.4);

-moz-box-shadow:0 1px 0 #f9f9f9 inset,1px 1px 1px rgba(223,223,223,0.4);

box-shadow:0 1px 0 #f9f9f9 inset,1px 1px 1px rgba(223,223,223,0.4);

}

.subscriptionbox h4 {

font-size: 38px;

font-family: 'Open Sans', Arial;

margin: 0 auto;

text-align: center;

line-height: 30px;

color: #1ABC9C;

font-weight: 600;

text-decoration: none !important;

}

.subscriptionbox p {

font-family: Varela Round;

font-size: 22px;

text-align: center;

margin: 0px;

line-height: 25px;

margin-top: 25px;

border-bottom: 1px solid #1ABC9C;

color: #454545;

padding-bottom: 5px;

}

1. Go to Blogger Dashboard » Template » Edit HTML

2. Press Ctrl+F and Find the Following Code.

<data:post.body/>

3. Now, Paste the Following Code After/Below <data:post.body/>

<div id='subscriptionwrap'>

<div class='subscriptionbox'>

<h4>Ready To Be Make <strong>Elegant Blog</strong></h4>

<p>Subscribe to Blogs Daddy to enjoy Free Tricks</p><center>

<form action='http://feedburner.google.com/fb/a/mailverify' class='emailform' method='post' onsubmit='window.open("http://feedburner.google.com/fb/a/mailverify?uri=BlogsDaddy", "popupwindow", "scrollbars=yes,width=550,height=520");return true' target='popupwindow'>

<input name='uri' type='hidden' value='BlogsDaddy'/>

<input name='loc' type='hidden' value='en_US'/>

<input class='emailinput1' name='email' onblur='if (this.value == "") {this.value = "Enter your email...";}' onfocus='if (this.value == "Enter your email...") {this.value = ""}' type='text' value='Enter your email...'/>

<input class='emailbutton1' title='' type='submit' value='SignUp'/>

</form>

</center>

</div>

</div>

Customize This Widget

1. Replace the green color code with your blog name.
2. Replace the red color text with your own RSS feed username.

Congratulations! its all done.

Recommend For You:

• Add Subscription Box Widget Below Blogger Blog Post

If you like this post then please share with others via Google+, Facebook, Twitter etc. If you have any problem in adding the widget feel free to ask. Happy Blogging & Stay Blessed :)