WordPress Adapted Stylish Email Subscription Box For Blogger

Today i will share an amazing blogger widget with you. This widget is adapted from WordPress and will make your blog look more professional and cool. Oh!! i forget to tell what i am talking about. Actually this is an email subscription widget that appears below all posts in blogger. You can see the demo picture below.

This email subscription widget as i told earlier is displayed below all blog posts. So in this article i will tell you how to add this widget to your blog.

How To Add WordPress Adapted Stylish Email Subscription Box To Blogger

1. Go to Blogger Dashboard >> Template >> Edit HTML.

2. Tick Expand Widget box and using Ctrl + F find this code

3. Paste the below code after the above code

Email Newsletter






Get tips on blogging, SEO, social media and the internet.

Learn more about me and my experiences online.





        


        

Remember to replace text highlighted in red without your own Feedburner username.

You can also change the text that is displayed on the box by changing text highlighted in purple color.

Don’t miss – WordPress Adapted Social Subscription Box For Blogger

4. Now again using Ctrl + F , find

]]>

and paste the below code above it

#newsletter {
background-color: whiteSmoke;
border: 10px solid #DDD;
margin: 48px 40px;
margin: 3rem 2.5rem;
}
#newsletter .white-border {
border: 1px solid white;
}
.newsletter-wrap {
background: url(http://3.bp.blogspot.com/-kJ-VsPOz48g/UJ1GD3U7XzI/AAAAAAAAIjo/v8-re7Kwmv8/s1600/newsletter-sign-up-ribbon-by-infozguide.png) no-repeat top left;
margin: -17px -18px;
overflow: hidden;
padding: 48px 32px 40px;
padding: 3rem 2rem 2.5rem;
text-shadow: 1px 1px white;
}.newsletter-wrap p {
margin: 0 24px 20px;
margin: 1.5rem 1.25rem;
}

.newsletter-wrap input[type="email"] {
background: white url(http://1.bp.blogspot.com/-aH_VsYTUBoI/UJ1GDB5OHiI/AAAAAAAAIjg/hfw2z1L8_DM/s1600/newsletter-box.png) no-repeat center left;
margin: 0 6px;
margin: 0 0.375rem;
padding: 16px 0 16px 40px;
padding: 1rem 0 1rem 2.5rem;
width: 60%;
}

.submit-button {
background-color: #171717;
border: none;
-moz-border-radius: 1000px;
-webkit-border-radius: 1000px;
border-radius: 1000px;
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
cursor: pointer;
letter-spacing: 1px;
padding: 16px 20px;
padding: 1rem 1.25rem;
color: #fff;
}

5. Save your template and you are done.