Friday, August 5, 2011

How To Add Cool Subscription Email Form To Your Blog !!

Hi guys,

Happy April fools Day. Hehehe, No this post is not regarding April fool but Its just regarding some good tutorial. Now in this post I will help you form a good cool Feed Subscription form, So that visitors can subscribe to your feeds.
Now As usual this is going to be Simple and easy all you have to do is follow this few steps and you will have a cool Subscription form added to your site.

Now follow this simple steps as usual.
  • Log in to your bloggers account.
  • Go to Design > Page element > add a gadget.
  • choose HTML/Javascript
  • And paste the below code
<a href='http://feeds2.feedburner.com/GetPaidForEverythingYouDo' 
rel='alternate' title='Subscribe now to avail the unthinkable'
type='application/rss+xml'><img alt='' border='0'
src='http://img801.imageshack.us/img801/6769/panda1x.png' style='
padding-bottom:20px; margin: 0pt 10px 10px 0pt; float: left;
width:150px;
;height:150px;'/></a><p><br/><br/><br/><a
href='http://feeds2.feedburner.com/GetPaidForEverythingYouDo'
rel='alternate' title='Subscribe to my feed'
type='application/rss+xml'/>Join the team! <span style='color:
#FFFFFF; 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'
method='post'
onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=GetPaidForEverythingYouDo&apos;,
&apos;popupwindow&apos;,
&apos;scrollbars=yes,width=550,height=520&apos;);return true'
style='padding: 5px; ' target='popupwindow'><input name='email'
style=' color:#5C6AA4; background: #fff; border:2px solid #5C6AA4;
width: 200px;' type='text'/><input name='uri' type='hidden'
value='GetPaidForEverythingYouDo'/><input name='loc' type='hidden'
value='en_US'/> <input class='mbt1'
onmouseout='this.className=&apos;mbt1&apos;'
onmouseover='this.className=&apos;mbt1 mbt1hov&apos;'
type='submit' value='GO!'/></form><br/>
Now You see some of the codes are in different color. Now every color has come changes to be done.

Now everything that is highlighted in Red is you feed address. go to your feed burner and check out your feed address. 
Go to feed burner and then click on Edit feed details you will get something like this :
 This is your feed ID repace everything in Red with your Feed Id.

Now the Orange one is the Image link. Can you see my Subscription form and the panda on the side that's the image. You can find other cool images on Google and just replace this image link. if you dont want then dont do it.

Next is Green The test marked in green is the color codes. You can change the color codes according to your template and blend it to your template color. Find the color does on Google.
Just type Html color chat.

Now next is Purple this is just and extra part if you want to edit then only do it. The purple part is the width and the height  of the form. blend it according to your template.

If you still have any problem just contact me through comments I will definetly help you out.

Guys it seriously takes a lot of time and effort to post this tutorials.
A word of thanks would be appreciated.

Regards

0 comments:

Post a Comment

Find me on Bloggers

Hatim - Find me on Bloggers.com