HOW TO CREATE A PROFESSIONAL SUBSCRIPTION WIDGET - STEPS WITH PICTURES

As you know the subscription box provided by Blogger is kind of freaky and it doesn't even look like the 'P' of Professional, so we have come up with this professional subscription widget. This widget has got pro looks and will help you to get mass follower if you are a good Blogger. It is very necessary to have a subscription box because even if your content is not placed well in the search results, you will get traffic from the subscribers of your blog. That's why you should try to make a subscription box for yourself. For live demo check ours in the bottom of the page. Saw it, now follow the steps and get one for yourself too.

Steps :

• Open Blogger > Dashboard > Blog > Page Layout.
• Now in the area you want to create the subscription box select 'Add a Gadget'. You should choose the one in footer or right side area. But if you want it somewhere else, do whatever you want to do.

• In the Pop-up Select 'HTML/Java Script' Gadget.

• You can leave the Title box empty. Paste this code in content box :- 

<div align="center" id="UniquedSoftware">
<div id="ig-subscription-optin" filter: progid:dximagetransform.microsoft.gradient( startcolorstr='#55AAEE', endcolorstr='#003366',gradienttype=0 ); width: 265px;">
<h4 id="UniquedSoftware-title-text" style="color: 000; font-size: 20px;">
SUBSCRIBE US</h4>
<div id="UniquedSoftware-sub-title-txt" style="color: 000; font-size: 14px;">
Subscribe us for free and get our latest content delivered right through your inbox.</div>
<br />
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=UniquedSoftware', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
<input class="name" id="UniquedSoftware_Subscriber_name" name="name" onblur="if(this.value=='')this.value=this.defaultValue;" onfocus="if(this.value==this.defaultValue)this.value='';" type="text" value="Enter Your Name" /><br />
<input class="email" id="UniquedSoftware_Subscriber_email" name="from" onblur="if(this.value=='')this.value=this.defaultValue;" onfocus="if(this.value==this.defaultValue)this.value='';" style="width: 130px;" type="text" value="Enter Email Address" /><br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<input name="uri" type="hidden" value="UniquedSoftware" /><input name="loc" type="hidden" value="en_US" /> <input id="UniquedSoftware_Submit_Text" style="height: auto; padding: 5px 0;" type="submit" value="SUBMIT" /></form>
</div>
</div>
<style>
#ig-subscription-optin {margin: 0px;padding: 10px;height: auto!important;padding: 0px 10px 15px 15px !important;
text-align: center !important;font-family: Georgia, Times, "Times New Roman", serif !important;margin: 10px;margin: 0px;padding: 10px;
margin: 8px 0 0 !important;line-height: 22px;font-family: Georgia, Times, "Times New Roman", serif;padding: 5px;border: none;}#ig-subscription-optin p {margin: 8px 0 0 !important;line-height: 22px;font-family: Georgia, Times, "Times New Roman", serif;
padding: 5px;border: none;}#ig-subscription-optin input.name {
background: white url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjx9kycZko2ybMKpFgX55emwMJbG1274JJoyGNm2L_RYquawR-u8w0Gg0b2e0XACZsKjJXTakrNXt9sX_WZCDFcVtBVymN1bjyevVCT94QeXjh37jBIKfD13JIh1C4adbyP9hrbwZ2uavU8/s1600/subscribe-name.png) no-repeat center right;}
#ig-subscription-optin input[type="text"] {border: 1px solid #111 !important;
font-size: 15px !important;margin-bottom: 10px !important;padding: 8px 28px 8px 10px !important;width: 80% !important;height: auto !important;}
#ig-subscription-optin input.email {background: white url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwnW2lzyJxd_l8auPhWH3le-c1WuYchhjlmjYgRCqZnUCx5OwhLeuPBQjKFDeWe-8gPnqanK3qpb1babCZm7yXmDZTjhr3LLfu5i1Et509dmGQoZRaahCtvQnMsA9XiJ49XsqCafwScfle/s1600/subscribe-email.png) no-repeat center right;}#ig-subscription-optin input {
font-family: Georgia, Times, "Times New Roman", serif;border-radius: 3px;-moz-border-radius: 3px;-webkit-border-radius: 3px;box-shadow: 0 2px 2px #111;-moz-box-shadow: 0 2px 2px #111;-webkit-box-shadow: 0 2px 2px #111;margin: 0px;padding: 0px;}#ig-subscription-optin h4 {margin-bottom: 8px !important;
font-weight: bold !important;line-height: 26px !important;letter-spacing: normal;
text-transform: none;text-decoration: none;
text-align: center !important;font-family: Georgia, Times, "Times New Roman", serif;
border: none;padding: 0px !important;float: none;}input:hover[type="submit"] {
background-color: #0094D2;border: 1px solid #0094D2;color: red;text-decoration: none;}input[type="submit"] {background-color: #00A7ED;border: 1px solid #0094D2;
color: white;cursor: pointer;font-family: 'Droid Sans', sans-serif !important;font-size: 13px;font-weight: normal;padding: 5px;text-decoration: none;}input {
color: #333;font-family: 'Droid Sans', sans-serif;}#ig-subscription-optin input[type="submit"] {background: #3DC1FC; border: 1px solid #111 !important;color: white;cursor: pointer !important;font-size: 18px !important;font-weight: bold !important;
padding: 6px 0 !important;text-shadow: -1px -1px #0094D2 !important;width: 90% !important;height: auto !important;line-height: 24px !important;}
#ig-subscription-optin input[type="submit"]:hover {color: #FFFFFF;}</style>

 

•  Now change the UniquedSoftware with your own feed burner URL. Example : http://feeds.feedburner.com/uniquedsoftware. The highlighted text is our URL and you would also have to put your URL that is relevant to it.
• Click Save.

You are done but take some more tips :

• Change the green highlighted text to change description.
• Change the orange highlighted text to change the name asking text.
• Change the yellow highlighted text to change the Email asking text.

Comment if you have any difficulties....