October 31, 2009

Subscription Email Form For Blogger Equipped With RSS Feed


Click here To use Wordpress Type Subscription Email Form

Blogger-Subscription-Form

 

I am extremely sorry for delaying this post. Due to burden of studies I was finding it difficult to publish posts but now everything is fine. Now without wasting your time lets jump straight to the tutorial of adding a beautiful Subscription form to the sidebars of your BlogSpot blogs.

 

Before Proceeding make sure you have burnt your feeds at www.feedburner.com

Now do the following,

  1. Go To Blogger > Layout
  2. Click Add a Gadget or Add a Page element
  3. Choose HTML/JavaScript Widget
  4. Inside this widget paste the code below,

<a href="http://feeds2.feedburner.com/TntByStc" rel="alternate" title="Subscribe now to avail the unthinkable" type="application/rss+xml"><img border="0" alt="" style=" padding-bottom:20px; margin: 0pt 10px 10px 0pt; float: left; width:100px; height:100px;" src="http://3.bp.blogspot.com/_7wsQzULWIwo/Sty6EvZmTlI/AAAAAAAACGU/ArK94-9iDS0/s400/MBT-RSS-FEED.gif"/></a><p><a href="http://feeds2.feedburner.com/TntByStc" rel="alternate" title="Subscribe to my feed" type="application/rss+xml">Join the team! </a><span style="color: #5C6AA4; font-weight: bold;">By Submitting your email address:</span></p>
<style>
input.mbt1 {
color:#fff;
font: bold 10px Arial, sans-serif;
background:#F39100;
border:0;
padding:3px;
}
input.mbt1hov {
color:#fff;
font: bold 10px Arial, sans-serif;
border:2px solid #F39100;
padding:3px;
}
</style>
<form action="http://feedburner.google.com/fb/a/mailverify" style="padding: 5px; " target="popupwindow" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=TntByStc', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><input style=" color:#5C6AA4; background: #fff; border:1px solid #5C6AA4; width: 90px;" name="email" type="text"/><input value="TntByStc" name="uri" type="hidden"/><input value="en_US" name="loc" type="hidden"/> <input onmouseover="this.className='mbt1 mbt1hov'" onmouseout="this.className='mbt1'" value="GO!" class="mbt1" type="submit"/></form><br/>

Now you need to make some important changes to customize the widget.

  • Replace http://feeds2.feedburner.com/TntByStc with your Feed URL that Feedburner has provided you. If you don’t now how to get it simple replace TntByStc with your Feed title like this,

http://feeds2.feedburner.com/Paste-Your-Feed-Title-here

 

  • To use a different RSS Feed Icon simple change the URL below with that of yours,

http://3.bp.blogspot.com/_7wsQzULWIwo/Sty6EvZmTlI/AAAAAAAACGU/ArK94-9iDS0/s400/MBT-RSS-FEED.gif

  • Replace TntByStc with your own Feedburner Feed Title
  • The Color code #5C6AA4 refers to the text colour and border colour of the Subscription Box. May be MBT Color Chart will help you. If you are using MBT Buster Themes than change the colours as follows,

               For Buster Theme 1 leave the code #5C6AA4 unchanged.

               For Buster Theme 2 replace #5C6AA4 with #64A6E4

               For Buster Theme 3 replace #5C6AA4 with #37BD07

               For Buster Theme 4 replace #5C6AA4 with #7CA2C4

               If you are using MBT Church Theme then replace #5C6AA4 with #7CA2C4

That’s it. Hit Save and Preview Your Widget!

I hope it was simple to understand :|





If you don't want to get yourself into Serious Technical Trouble while editing your Blog Template then just sit back and relax and let us do the Job for you at a fairly reasonable cost. Submit your order details by Clicking Here »

39 comments : Post Yours! Read Comment Policy ▼
PLEASE NOTE:
We have Zero Tolerance to Spam. Chessy Comments and Comments with Links will be deleted immediately upon our review.

  1. '''I am extremely sorry for delaying this post. Due to burden of studies I was finding it difficult to publish posts but now everything is fine.'''

    As I tell my son and daughter, "Studies need to come first! They help your future"! lol! I'm sure you get to hear things along those lines as well! ;)

    Thank you for your quick response! lol or maybe it was my timing!

    ReplyDelete
  2. @Hannah

    Hannah your children are lucky to have such an active mother. Its impressive to see how easily you manage time.

    And yes you are right you replied just after few hours of this publish :D

    ReplyDelete
  3. A Good News:

    I successfully recovered my Google PageRank from 0 to 2.0 just after a month as I had expected. I hope it keeps on increasing.


    Thanks to all readers for their support.

    ReplyDelete
  4. Mohammad thanks for sharing this code.


    Congress on PR update dude!

    ReplyDelete
  5. You are a true SEO!

    Patel

    ReplyDelete
  6. Hey!! Thats great news!!:)My page rank is now 1 of http://anup-views.blogspot.com

    Or my page rank is 0 of http://hacktutors.blogspot.com

    :(
    How to increase page rank Mohammad?? please help me...

    ReplyDelete
  7. Hello I have a serious doubt i tried anshuldudeja's comment bubble for each post but when i tried it the comment bubble is messing up with my blog post title please help me

    ReplyDelete
  8. And one more doubt for me how can i split header into two sections as u can see in my blog jayarajyadav.blogspot.com where i use template designed by ipietoon.com please help me
    note:-same as i am using in my template in your MBT Church theme

    ReplyDelete
  9. @Anup

    PageRank is based on Google's Link building Algorithm that adds up when links from external sites are redirected to your blog. Each link especially a one-way link from an external source having a good PR contributes to your PR increase.
    The short and quick tip to increase your PR is that work hard on building up reputation in Blogosphere by sharing unique content. People will link to you from different authorities causing your PR to increase. Never ask for link exchanges. Two-way linking results zero. Moreover 1000 links from a PR zero blog to yours result in Zero or may be 1. In short work hard the fruit will be sweet by itself :>

    ReplyDelete
  10. @China

    Friend what do you mean by "anshuldudeja's comment bubble". Can you clarify your first comment


    You can add an extra widget area just below header. To do that , set showaddelement value to 3 in your template and maxwidgets to 3. Make sure you check the box next to "Expand Widget Templates"

    MBT Church theme has it be default :)

    ReplyDelete
  11. at first i mean check this URL http://www.anshuldudeja.com/2009/07/show-comment-bubble-at-top-of-each.html
    when i tried the tutorial given by him it worked but it is messing up with my blog post title

    and the second one is i know that i can change the max widgets to any number i am asking about splitting header into two and it should look like this
    see this below link for the picture how i want the header to be
    http://img2.pict.com/99/33/27/1886204/0/800/mybloglayout.jpg
    and see my blog jayarajyadav.blogspot.com for how it look like

    u r great because you created a nice templates for bloggers you are no.1 according to me

    and the last thing is the template which i am using is created by ipietoon.com name is blacknero template

    regards:-jayarajyadav.blogspot.com

    ReplyDelete
  12. Do you know when will google updated our page rank??

    ReplyDelete
  13. @China


    Thanks for explaining. Kindly email me the link of your Template so that I could make necessary alignment changes for the comment bubble/background to look good on yours template. I will share the new CSS code right here.

    You also asked about splitting the header well that is surely easy but comprehensive. The header wrapper need to be divided into three Div sections, one as headerright and the other as headerleft. You will than need to link the CSS to the Widget b:section area. All this needs a detailed post. But If you are eager to add this effect to some template, than email me the download link of it. I will split the header for you and will email the template back to you.
    I hope you understand that Splitting the header needs detailed instructions. May be you will find it confusing if I share it here.

    @Anup

    Google PR is updated once after each 45 days

    ReplyDelete
  14. thanks i will surely email the download link of the template as i have exams tomorrow i will email u tomorrow thanks for ur suggestions hope u will surely reply after i emailed to u

    regards:-jayarajyadav.blogspot.com(chinna)

    at last my name is not china
    it is chinna

    ReplyDelete
  15. at last i want a favicon like u with my name jayarajyadav

    ReplyDelete
  16. Wow! great you are great. Can you share me more about SEO tips and tricks? Please I want help from you.

    Regards,
    Hack Tutors

    ReplyDelete
  17. @China

    I will be waiting

    @Anup

    I am going to write a series of posts on SEO in coming days. I have a lot to share and would surely share first heard content.

    ReplyDelete
  18. Blogger-Subscription-Form I am extremely sorry for delaying this post. Due to burden of studies I was finding it difficult to publish posts but now everything is fine. Now without wasting your time lets jump straight to the tutorial of adding a beautiful Subscription form to the sidebars of your BlogSpot blogs.

    I found your post very helpful and easy to follow. I was able to add a subscription form in my blogger blog, but had one small problem. When I tested using an email address it showed me that "The feed does not have subscriptions by email enabled". I tried to enable it following the given instructions but it kept giving me the same . Could you assist so I enable the subscriptions.
    Thanks

    ReplyDelete
  19. @phosi,


    Did you inserted your feed title accurately instead of TNTbySTC. You can also use the following dynamic feed URL ->
    <a expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;'>Feed RSS</a>
    If the probelm persists than let me now so that I could update the post

    ReplyDelete
  20. The first method was easier, the only problem was that after subscribing, then it showed that my email was not enabled at feedburner.

    ReplyDelete
  21. @phosi


    Did you solve the problem or not? If yes then thumbs up! :D If not then let me know so that I could update the post

    ReplyDelete
  22. Thanks for the tutorials Mohammad. :D
    http://macosxstation.blogspot.com/

    ReplyDelete
  23. Sir Mohammad thanks alot, i have learned alot... visit my blog to check... e-shopcenter.blogspot.com ur widget is working fine and I really appreciate it! thanks for being helpful to us@! xD

    ReplyDelete
  24. @ebince

    Thanks for the kind remarks. I have reviewed your blog. I must appreciate your efforts put into tyour blog. Keep it up. I have also added your blog to E-buckets! :>>

    ReplyDelete
  25. weeee thanks alot sir.. godbless!:)

    ReplyDelete
  26. thanks...

    i use this wigdet...

    nice too meet you....

    ReplyDelete
  27. widget on top is too wide for my blog. is there any way to make it shorter? I've tried to cut the message but it makes a blank space under....and thanks for your attention

    ReplyDelete
  28. Hi.
    I have a doubt not related with your above post. I want to create a button or say you can say icon as u have made for your own( code: <a href="http:// )so that it can be embedded on others site to link my site. I know how to create image of my own in Photoshop and HTML and CSS. Just i wanna know that how to implement it.
    Thanks...

    ReplyDelete
  29. thanx friend..
    Khuda hafiz
    http://internetricks4u.blogspot.com/

    ReplyDelete
  30. It was very interesting for me to read that blog. Thanks the author for it.
    I like such topics and everything that is connected to them.

    I would like to read more soon.

    ReplyDelete
  31. Is it possible to get the "subscribe now"-Widget you're using on your blog?

    ReplyDelete
  32. Perfect post. Here’s a tool that lets youbuild all types of web forms with email alerts fast and without coding. Just point and clickhttp://www.caspio.com/online-database/features/web-forms-online.aspx

    ReplyDelete
  33. you are rocking dear. It is working 100%. But you have not replied of my questions. Plz reply as soon as possible.

    http://hottest-tips-and-tricks.blogspot.in/

    ReplyDelete
  34. Nice and short tutorial brother, Wonderful customization. I am very new in feeds and subscription things. This tutorial will help me a lot.
    Regards,
    Admin of SEO Service Provider

    ReplyDelete
  35. Thnxxxxxxx..................it works.....u can see here.....
    http://prateektechie.blogspot.in/

    ReplyDelete
  36. wow... thats very nice and this was really help me....thank you so much. get lots of mobile and pc technology http://kudantown.blogspot.com

    ReplyDelete
  37. This comment has been removed by the author.

    ReplyDelete