Blogger Email Subscription Widget with Social Share Buttons Below Blog Post

social share with email subscription below postOne of the most elegant and simple email subscription widget for Blogger blogs (blogspot) with social media share buttons is finally here. The widget is inspired by one of the WordPress blogs design and indeed its simple design makes it stand out.

You can visit the link below to have a feeling of the widget with Live demo.

How to Install to Blogger?

Simply sign in your Blogger blogs dashboard >> Template >> Edit HTML and click the code area right when it loads. Refer the image below.


blogger edit html search box

Step #1 Search for the right code

Use CTRL+F to search the line of code below. This is the line that refers to the section below your Blogger post. We'll be adding our widget code below it.

<div class='post-footer-line post-footer-line-1'>

Once you're able to find that code, follow step #2 to add the widget code beneath it.

Step #2 Widget Installation

<div class="after-post bloggingehow">
<div id="enews-ext-2" class="widget enews-widget">
<div class="widget-wrap">
<div class="enews">
<h4 class="widgettitle">Email Newsletter</h4>
<p>Subscribe our daily newsletter us for Free Updates</p>
<form id="subscribe" name="Email Newsletter" onsubmit=" ' Feed Burner ID Here', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow" method="post" action="">
<label class="screenread" for="subbox">Enter your email address...</label>
  <input id="subbox" type="text" name="email" onblur="if ( this.value == '' ) { this.value = 'Enter your email address...'; }" onfocus="if ( this.value == 'Enter your email address...') { this.value = ''; }" value="Enter your email address..."/>
  <input type="hidden" value="Your Feedburner ID Here" name="uri"/>
  <input type="hidden" value="en_US" name="loc"/>
  <input id="subbutton" type="submit" value="Go"/>
 <span class='st_facebook_hcount' displayText='Facebook'></span>
<span class='st_twitter_hcount' displayText='Tweet'></span>
<span class='st_sharethis_hcount' displayText='ShareThis'></span>
  <p style=" line-height:0px; font-size:5px; font-weight:bold; text-align:right;padding-top:0px;"><a  class="beh-link-style" href="">Blogger widgets</a></p>


.beh-link-style  {text-decoration:none; color:#242424;}

  .after-post {
    background: url("") repeat scroll 0 0 transparent;
    border: medium double #DDDDDD;
    clear: both;
    color: #FFFFFF;
    margin: 30px 0;
    overflow: hidden;
    padding: 25px;
    text-shadow: 0 1px #111111;
.after-post p {
    color: #FFFFFF;
.after-post form {
    background: url("") no-repeat scroll 40px 0 transparent;
    display: block;
    padding: 10px 0 10px 120px;
  .enews #subbox {
    margin: 5px -7px 0 0;
    padding: 9px 8px;
    width: 70%;
 #subbox input[type="button"], input[type="submit"] {
    background: url("") repeat scroll 0 0 transparent;
    border: 1px solid #ED702B;
    color: #FFFFFF;
    cursor: pointer;
    line-height: 19px;
    padding: 8px 10px;
    text-decoration: none;
#subbox input[type="button"]:hover, input[type="submit"]:hover {
    background: url("") repeat scroll 0 -33px transparent;
    text-decoration: none;
   .bloggingehow h4 {
    font-size: 16px;
   color: #DDDDDD;
    font-size: 20px;
    margin: 0 0 20px;
    padding: 0;
    text-shadow: 0 2px #111111;
  <script type="text/javascript">var switchTo5x=false;</script>
<script type="text/javascript" src=""></script>
<script type="text/javascript">stLight.options({publisher: "ur-88a9f357-eb7f-69fe-f4c5-4fe18ad04bda", doNotHash: false, doNotCopy: false, hashAddressBar: false});</script>

Copy/paste the above code right after the code that you found in step#1. Thats it! Save your template and you would see your widget blooming.

Though there is one simple step left behind. You'll need to edit your Feedburner ID replacing Your Feed Burner ID Here with your own.

You may also like to see some of these great widgets:



AdSense affiliate marketing Announcement AskHassam Blogger Blogging Tips Blogosphere News Bluehost Building Traffic BuySellAds Contest Customizations Disqus Tutorials Domain Hosting Drop Down Menus eBook Email Marketing Facebook Tutorials Feedburner Freelancing Giveaway Google Google Analytics Google Gmail Google Plus Tricks Guest Post HowTo Interview Making Money Online Monetization Motivation PayPal Pinterest Plugins review SEO Slideshare Social Media Top Lists Twitter Wordpress YouTube
BloggingeHow | Making Blogging Simpler: Blogger Email Subscription Widget with Social Share Buttons Below Blog Post
Blogger Email Subscription Widget with Social Share Buttons Below Blog Post
BloggingeHow | Making Blogging Simpler
Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS CONTENT IS PREMIUM Please share to unlock Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy

Tools of the Trade