0 Members and 1 Guest are viewing this topic.


Briggz5d

Blogs on blogger platform do not require readers to Register / Log-in before they can read or comment on topics. There are many other ways to notify readers of your latest updates on your blog, the most popular being:This post is one of the many changes I've made to my template and docomeenting it for future reference. Other Blogger performance improvement post have been filed under the Blogger Tips Label.


Ok lets get right to How i added Feed Email subscription form to the Bottom of my Posts.
Adding Blogger Feed Email Subscription form to below Posts.

Before we get started, please make sure you have used Google's Feedburner service to syndicate your RSS / Atom Feeds and you have the email subscription Link ready.
  • Backup Your Template - See how to do this in this post
  • Login to Blogger Dashboard
  • Click Template >> Edit HTML and check the box to Expand Widget template
  • Use CTRL + F to Find <data:post.body/>
  • Copy and Paste this Code directly below the First <data:post.body/> you found.

    <!-- Custom Feedburner Email Subsription Form-->
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <style>
    form.feedburner{
    margin:20px 0 0;
    display:block;
    clear:both;
    }
    .dcstyle{
    background:url(http://3.bp.blogspot.com/-pl1ECUAcVEQ/T4YS7ZgR_uI/AAAAAAAAB_k/R92yDhiO65Q/s400/email_icon.png) no-repeat scroll 4px center transparent;
    padding:7px 15px 7px 35px;
    color:#666;
    font-weight:bold;
    text-decoration:none;
    border:1px solid #D3D3D3;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    -moz-box-shadow: 1px 1px 2px #CCC inset;
    -webkit-box-shadow: 1px 1px 2px #CCC inset;
    box-shadow: 1px 1px 2px #CCC inset;
    }
    .dcsubmit{
    color:#666;
    font-weight:bold;
    text-decoration:none;
    padding:6px 15px;
    border:1px solid #D3D3D3;
    cursor: pointer;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -goog-ms-border-radius: 4px;
    border-radius: 4px;
    background: #fbfbfb;
    background: -moz-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fbfbfb), color-stop(100%,#f4f4f4));
    background: -webkit-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
    background: -o-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
    background: -ms-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=&#39;#FBFBFB&#39;, endColorstr=&#39;#F4F4F4&#39;,GradientType=0 );
    background: linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
    }
    #emailwidget-outer {
    -moz-border-radius: 10px 10px 10px 10px;
    -webkit-border-radius: 10px 10px 10px 10px;
    -goog-ms-border-radius: 10px 10px 10px 10px;
    border-radius: 10px;
    background: none repeat scroll 0 0 transparent;
    border: 1px solid #D3D3D3;
    padding: 8px;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    -webkit-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    width:480px;
    }
    #emailwidget-outer:hover{
    background: none repeat scroll 0 0 #FFF;
    -moz-box-shadow: 1px 1px 2px #CCC inset;
    -webkit-box-shadow: 1px 1px 2px #CCC inset;
    box-shadow: 1px 1px 2px #CCC inset;
    }
    #emailwidget-outer td{
    padding:3px 0;
    }
    </style>
    <center><div id='emailwidget-outer'>
    <div id='emailwidget'>
    <table style='border:none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;' width='100%'>
    <tbody>
    <tr style='border:none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;'>
    <td align='left' style='border:none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;'> <p style='color:#666; font-weight: bold; font-size: 22px; margin:0px 0px 5px 0px; '>Get free email updates!</p>
    <form action='http://feedburner.google.com/fb/a/mailverify' class='feedburner' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=NgbuzzBlog&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' style='margin: 0pt;' target='popupwindow'>
    <input name='uri' type='hidden' value='Ngbuzz'/>
    <input name='loc' type='hidden' value='en_US'/>
    <input class='dcstyle' name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Enter your email…&quot;;}' onfocus='if (this.value == &quot;Enter your email…&quot;) {this.value = &quot;&quot;}' type='text' value='Enter your email…'/>
    <input alt='' class='dcsubmit' title='' type='submit' value='Submit'/>
    </form></td>
    <td style='border:none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;'><p style='color:#666; font-weight: bold; font-size: 14px; margin:0px 0px 5px 0px; '>Follow us!</p>

    <a href='http://feeds.feedburner.com/NgbuzzBlog' rel='nofollow' target='_blank' title='Suscribe to RSS Feed'><img src='http://3.bp.blogspot.com/-ShqPVqX-vhs/TqgOXX5m9WI/AAAAAAAAFCg/WFRLxQ4yjuM/s1600/rss-30×43.png'/></a>

    <a href='http://twitter.com/ngbuzz' rel='nofollow' target='_blank' title='Follow us on Twitter'><img src='http://2.bp.blogspot.com/-eVZSNf1mj_E/TqgOX_ldq1I/AAAAAAAAFCk/2wDDaA8esG8/s1600/twitter-30×43.png'/></a>

    <a href='http://www.facebook.com/ngbuzzblog' rel='nofollow' target='_blank' title='Like us on Facebook'><img src='http://1.bp.blogspot.com/-sT9lHle5N54/TqgOWhi-amI/AAAAAAAAFCU/MwoQL3ZhEy4/s1600/facebook-30×43.png'/></a>


    <a href='https://plus.google.com/109078695148934306160/' rel='nofollow' target='_blank' title='Follow us on Google+'><img src='http://3.bp.blogspot.com/-icT9kVFhtOs/TqgOXLJCbBI/AAAAAAAAFCY/pU4wo8HyHNI/s1600/googleplus-30×43.png'/></a>
    </td>
    </tr>
    </tbody></table>
    <div align='right'><span style='font-style: italic; font-size: 8px; color: solid #ffffff;'><a href='http://www.ngbuzzblog.com/2012/08/how-to-add-custom-feedburner-email.html' style='text-decoration: none;' target='_blank'><font color='#ffffff' decoration='none'>[Get this widget]</font></a></span></div>
    </div></div>
    </center>
    </b:if>
    <!-- Feedburner email subscription form end-->
  • 5. Please Take not of parts of the Code highlighted in RED and replace them with Your own facebook, twitter, google plus, feedburner details
  • 6. Save changes and view one of your posts

« Last Edit: September 25, 2012, 09:49 AM by Briggz5d »

 

How to Float SMF post around Author Profile using CSS (Utilizing space.)

Started by Briggz5d

Replies: 0
Views: 1777
Last post December 22, 2012, 09:24 AM
by Briggz5d
Not sure where to post this...

Started by Haring

Replies: 2
Views: 2617
Last post June 08, 2011, 03:23 PM
by Haring
About the Blogger Default RSS & Atom Feed URL

Started by Briggz5d

Replies: 0
Views: 2250
Last post September 25, 2012, 06:56 AM
by Briggz5d
How to display Blogger Embedded Comment Box Below posts

Started by Briggz5d

Replies: 0
Views: 5176
Last post April 11, 2013, 09:44 PM
by Briggz5d
How To Divide Blogger theme Header

Started by mattmaik

Replies: 1
Views: 2594
Last post October 05, 2013, 11:16 PM
by iykyvic