2 New Stylish Sidebar Email Subscription Widget for Blogger

Stylish Sidebar Email Subscription Widget for Blogger – To get instant page views on a new post we must have a lot of subscribers. More Subscribers means More power to you regarding free and instant highly targeted traffic to your every new blog post. Email Subscribe widget is most important part of every blogger. Some of the newbies don’t know about the power of email subscribe widget. So, first let us tell you about What is Email Subscribe widget?

How To Add Stylish Subscription Widget for Blogger to the Sidebar

 

Our Recommended Blogger Widgets

  1. Add Sticky Notification Bar To Blogger with Show/Hide Button.
  2. Stylish Contact Form For Blogger! Add to Static Page, Responsive & Pro Version.
  3. Cute & Stylish Email Popup Subscription Widget.

What is Email Subscribe widget?

Email Subscribers widget has a subscription box, and it allows users to publicly subscribe by submitting their email addresses, and if you get email subscribers for your blog, then you get free traffic to your blog because, when you publish a new article on your blog then a subscriber get a newsletter from Feedburner. Thus, you must have an email subscribe widget on your blog and tell your readers to subscribe your blog if they like your article and they want your newsletter to their mailbox.

So, today we are going to share 2 New! Stylish Sidebar Subscription Widget for Blogger. You can add the subscription box of your choice to your Blogger site from below instruction.

1. Sidebar Stylish Email Subscription Widget for Blogger

Stylish Subscription Box Widget Style1 for Blogger

How To Add this Stylish Email Subscription Widget for Blogger?

  • Go to Blogger >> Layout >> Add A Gadget >> HTML/JavaScript.
  • Paste Below code inside it and change all highlighted colors with your choice and after that save it.

<style>
//**Subscription Box Style1 By mybloggerguides.com**//
#mbg-sub-box{border:5px solid #444;}
#mbg-sub-box-wrap1 {background:#8ff; width:100%; height:auto; border-bottom:20px solid #8ff;}
.mbg-sub-box-wrap { background:#8ff; max-width:100%; margin-left:5px; margin-right:5px;  }
#mbg-sub-box .main-tagline {
padding: 0px 0px;
line-height: 2.2em;
font-size: 28px;
margin: 0;
height: 55px !important;
overflow: hidden;
font-weight: normal;
color:#ff0066;
text-align: center;
border: 0;
background-color: #444;
border:55px solid #ff0066;
border-radius:60px;
border-bottom: 15px solid #444;
border-top: 15px solid transparent;
}
#mbg-sub-box .sub-box-wrap-text{ height:auto; background:#444; margin-top:10px; margin-left:15px; margin-right:15px; border-bottom-left-radius:70px; border-top-right-radius:70px; text-align: 10px; border:2px solid #8f2;}

#mbg-sub-box .sub-box-wrap-text p{color:#8ff; font-size:20px; font-weight:normal; line-height:1.35em;  margin:13px 20px 20px 20px; }

#mbg-sub-box .rssform {
padding: 0px 20px;
margin: 16px 0px 16px 0px;
}
#mbg-sub-box .rssform input {
padding: 8px;
font-size: 13px;
font-family: “Oswald”, sans-serif;
font-weight: normal;
width: 100%;
text-transform: uppercase;
outline: none !important;
border:2px solid #8f2;
border-radius: 3px;
box-sizing: border-box !important;
-moz-box-sizing:border-box;
}
#mbg-sub-box .rssform .button:hover {
background: #ff0036; /*—– Change Subscribe button hover color here —–*/
}
#mbg-sub-box .rssform .button {
background: #ff0066; /*—– Change Subscribe button background color here —–*/
color: #FFF!important; /*—— Change Font color here ——*/
border:2px solid #8f2;
margin-top: 15px;
outline: none !important;
transition: all .5s ease-in-out;
width: 100%;
padding: 6px !important;
float: none;
text-transform: uppercase;
font-family: “Oswald”, sans-serif;
font-size: 18px;
font-weight: normal;
cursor: pointer;
border-radius:3px;
}
#mbg-sub-box .lock-policy a {
color:#444;
text-decoration:none !Important;
}
#mbg-sub-box .lock-policy {
font-family: “Oswald”,sans-serif;
background: url(https://2.bp.blogspot.com/-tXdn9KgyPt0/V5eRBuMiCPI/AAAAAAAAEwY/nsls2VVLPmYyR5bipSOlbmEBVgV94aw7QCLcB/s1600/MyBloggerGuides-Lock-Policy.png) no-repeat -3px -4px; /*— image URL of Lock appears in footer —*/
color: #444;
text-align: center;
font-size: 12px; /*— Font size of footer line —-*/
margin-left: 10px;
padding: 0px;
line-height: 30px;
margin-top: -5px;
}
</style>
<div id=’mbg-sub-box’>
<div id=’mbg-sub-box-wrap1′>
<div class=’mbg-sub-box-wrap’>
<div class=’main-tagline’>Subscribe Us</div>
<div class=’sub-box-wrap-text’><p>And Get Latest Blogger Guides, Widgets, Templates Direct to Your Mailbox!
Just Enter Your Email, Hit Sign Up and Verify for Lifetime Updates.</p></div>
<div class=’rssform’>
<form action=’http://feedburner.google.com/fb/a/mailverify’ method=’post’ target=”popupwindow” onsubmit=”window.open(‘http://feedburner.google.com/fb/a/mailverify?uri=MyBloggerGuides’, ‘popupwindow’, ‘scrollbars=yes,width=550,height=520′);return true”>
<input type=’text’ name=’email’ placeholder=’Enter your email address…’ />
<input type=”hidden” value=”MyBloggerGuides” name=”uri”/>
<input type=”hidden” name=”loc” value=”en_US”/>
<input value=”Sign Up” class=”button” type=”submit” />
</form>
</div>
<div class=”lock-policy”>
Safe With Us | <a href=”https://mybloggerguides.com/p/privacy-policy.html”>Privacy Policy</a> | <a href=”https://www.mybloggerguides.com/2016/07/stylish-sidebar-subscription-box-widget-for-blogger.html” target=’_blank’>>Get This Widget</a>
</div>
</div>
</div>

  • Now Open your Blog and see it live on your Blog.

2. Sidebar Stylish Email Subscription Widget for Blogger

Add Stylish Sidebar Subscription Box Widget Style2 to Blogger

 

How To Add Stylish Email Subscription Widget for Blogger?

  • Go to Blogger >> Layout >> Add A Gadget >> HTML/JavaScript.
  • Paste Below code inside it and change all highlighted colors with your choice and after that save it.

<style>
//**Subscription Box Style1 By mybloggerguides.com**// #mbg-subbox {background:#111; width:100%; height:auto; border-bottom:5px solid #ff5959;}
#mbg-subbox .box-wrap { background:#111; max-width:100%; margin-left:5px; margin-right:5px; border-top:5px solid #444;   }
#mbg-subbox .main-tagline {
padding: 0px 0px;
line-height: 2.2em;
font-size: 28px;
margin: 0;
height: 55px !important;
overflow: hidden;
font-weight: normal;
color: #FFF;
text-align: center;
border: 0;
background-color: #FF5959;
border:15px solid #111;
border
border-bottom-radius:10px;
border-bottom: 10px solid transparent;
border-top: 10px solid transparent;

}
#mbg-subbox .box-wrap-text{height:auto; background:#111; margin-top:10px; margin-left:15px; margin-right:15px; border-bottom-left-radius:70px; border-top-right-radius:70px; text-align: 10px; border:2px solid #f3f3f3;}

#mbg-subbox .box-wrap-text p{color:#fff; font-size:20px; font-weight:normal; line-height:1.35em;  margin:13px 20px 20px 20px; }

#mbg-subbox .rssform {
padding: 0px 20px;
margin: 16px 0px 16px 0px;
}
#mbg-subbox .rssform input {
padding: 8px;
font-size: 13px;
font-family: “Oswald”, sans-serif;
font-weight: normal;
width: 100%;
text-transform: uppercase;
outline: none !important;
border: none;
border-radius: 3px;
box-sizing: border-box !important;
-moz-box-sizing:border-box;
}
#mbg-subbox .rssform .button:hover {
background: #ff2020; /*—– Change Subscribe button hover color here —–*/
}
#mbg-subbox .rssform .button {
background: #ff5959; /*—– Change Subscribe button background color here —–*/
color: #FFF!important; /*—— Change Font color here ——*/
border: 0;
margin-top: 15px;
outline: none !important;
transition: all .5s ease-in-out;
width: 100%;
padding: 6px !important;
float: none;
text-transform: uppercase;
font-family: “Oswald”, sans-serif;
font-size: 18px;
font-weight: normal;
cursor: pointer;
border-radius:3px;
}
#mbg-subbox .Box-bottom-text { margin-top:10px; margin-left:15px; margin-right:15px; border-top-left-radius:70px; border-bottom-right-radius:70px; text-align: 10px; border:2px solid #f3f3f3; margin-bottom:15px;}
#mbg-subbox .promise { line-height:1.2em; font-size:16px; color:#fff; text-align:center; margin-top:15px; margin-bottom:15px;}
</style>
<div id=’mbg-subbox’>
<div class=’box-wrap’>
<div class=’main-tagline’>Subscribe Us</div>
<div class=’box-wrap-text’><p>And Get Latest Blogger Guides, Widgets, Templates Direct to Your Mailbox!
Just Enter Your Email, Hit Sign Up and Verify for Lifetime Updates.</p></div>
<div class=’rssform’>
<form action=’http://feedburner.google.com/fb/a/mailverify’ method=’post’ target=”popupwindow” onsubmit=”window.open(‘http://feedburner.google.com/fb/a/mailverify?uri=MyBloggerGuides’, ‘popupwindow’, ‘scrollbars=yes,width=550,height=520′);return true”>
<input type=’text’ name=’email’ placeholder=’Enter your email address…’ />
<input type=”hidden” value=”MyBloggerGuides” name=”uri”/>
<input type=”hidden” name=”loc” value=”en_US”/>
<input value=”Sign Up” class=”button” type=”submit” />
</form>
</div>
<div class=’Box-bottom-text’>
<div class=’promise’>We Promise! We won’t Spam You.</div>
</div>
</div>
</div>

  • Now Open your Blog and see it live on your Blog.

In Conclusion of Stylish Email Subscription Widget for Blogger

So above guide is about How To Add Stylish Email Subscription Widget for Blogger to the Sidebar? We hope by this tutorial you can add it successfully on your blog without facing any problem. If the anyhow problem persists after following all steps then drop a comment below. We will help you out of sure. Do Share.
Thank You! Stay Blessed!

Paramjot Singh
 

Hey, How you all are? Myself Paramjot Singh, A young (Not Old :P) addicted Blogger from Lucknow, India who want to learn Aha to Shit of the Blogging. I’m blogging since 2 years, and here on My Blogger Guides, I’m sharing my little mind knowledge which I learned in these past two years. :)

0 Shares
+1
Pin
Tweet
Stumble
Share
Share