Oct 12, 2015

Below Post Responsive Subscription Box For Blogger

Are you searching for Below Post Responsive Subscription Box Widget for Your Blogger Blog, then you are on right platform because today we are going to share a responsive subscription box widget for Blogger Blog. You have to read below tutorial for adding this cool looking Responsive below post subscription box widget toy your blogger blog.
Below Post Responsive Subscription Box Widget For Blogger
Responsive Subscription Box Widget

Now Days every person in this world is using in their gadget like mobile, laptop. PC, and the biggest source is for getting free traffic to a blog is social networking sites. If we getting huge traffic to our blog then it is a good signal for our blog, Because it can improve our Alexa Rank and Google Rank also. For getting traffic from social sites we must have to huge followers. So today we are here with responsive subscription box widget for your blog. When a reader subscribed you then he / she get free tutorials direct to their mail box when you publish a new blog post.

How To Add Responsive Subscription Box Widget To Blogger

So if you are interested in adding this responsive subscription box widget to your each post footer then read complete guide below.
  • Go to Blogger Dashboard.
  • Now Go To Template. >> Edit HTML.
  • Now search for ]]></b:skin> tag and paste below code just above of this tag.
Below Post Sub Box CSS By MyBloggerGuides.com
#mbg-blogger-sbox-below-post { padding: 0; margin: 0; width: 100%; height: auto; border-radius: 1px; border: 0; display: inline-block; background: #FF5D5D; } #mbg-blogger-sbox-below-post p { font-family: "Oswald", sans-serif; font-size: 19px; color: #FFFFFF; line-height: 30px; text-align: center; font-weight: normal; padding: 15px 0px 0px; margin: 0px 0px 25px 0px; text-transform: capitalize; } #mbg-blogger-sbox-below-post .fa { color: #FFF; font-family: FontAwesome; font-size: 25px; margin-right: 10px; } #mbg-blogger-sbox-below-post .rssform { padding: 0px 0px; margin: 30px auto 30px; display: block; width: 300px; } #mbg-blogger-sbox-below-post .rssform input { text-align: center; padding: 8px; color: #000; font-size: 13px; border-radius: 1px; font-family: Oswald; font-weight: normal; width: 100%; height: 45px!important; line-height: 1.5em; overflow: hidden!important; text-transform: capitalize; outline: none!important; display: block; background-color: #FFF4F4; border: 1px solid rgb(255, 80, 80); box-sizing: border-box!important; } #mbg-blogger-sbox-below-post .rssform .button { background: #000000; color: #FFFFFF; border: 1px solid #FF2727; margin-top: 15px; border-radius: 1px; outline: none!important; -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; padding: 4px!important; float: none; font-family: "Oswald",sans-serif; font-size: 17px; font-weight: normal; cursor: pointer; } #mbg-blogger-sbox-below-post .rssform .button:hover { background: #3A3939; }

  • Now Search For <div class='post-footer-line post-footer-line-3'> tag and paste below code just after of this tag. 
<b:if cond='data:blog.pageType == &quot;item&quot;'> <div id='mbg-blogger-sbox-below-post' oncontextmenu='return false'>
<p><i class='fa fa-envelope'/> Stay connected, You&#39;ll not be disappointed!</p>
<div class='rssform'>
<form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=MyBloggerGuides&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>
<input name='email' placeholder='Enter your email address...' type='text'/>
<input name='uri' type='hidden' value='MyBloggerGuides'/>
<input name='loc' type='hidden' value='en_US'/>
<input class='button' type='submit' value='Join!'/>
  • Now change MyBloggerGuides and This Color Text into your's.
  • Save Template.
  • That's it. You have added responsive subscription box widget to each post's footer of your blogger blog.


So above guide is about How To Add Below Post Responsive Subscription Box To Blogger Blog. hope this guide help you to install this responsive subscription box widget into your blogger blog. If it did not appear on your blog properly after following all steps correctly then please let us know.We'll personally help you out of sure. Also give us Feedback for design and responsiveness of this subscription box widget by dropping a comment below. Don't forget to share on Blogging communities and with your Blogger Friends. 


  1. Not working for me. I am using bmag template and this line is not available. It only has and Tried on second line but it didn't worked. Kindly help me.

  2. Hello @Sumair Hisbani , Nice to see you here buddy.

    Find tag and paste HTML part of below post subscribe box just above/below of it.

    Note: Maybe, You'll find tag more than one time so paste HTML code above/below of second or third appearance.

    Hope it will work for you and in case not work then please mail me your template.

  3. Thank you so much Anmol bhai, for your help. It's working fine now. Great widget, thanks for sharing.

    - Sumair

  4. Happy to help you. Stay in touch brother. <3


We’re eager to see your comment. If you have any query related to the topic then drop a comment below. We will help you out of sure. However, Please Keep in mind that all comments are moderated manually by our human reviewers. According to our comment policy all link are nofollow so keep in mind that never use links in comments, we consider link comments as a spam.