Sunday, July 3, 2011

How To Add Cool Subscribe Box For Blogger

How To Add Cool Subscribe Box For Blogger



1. Log in to blogger account and Go to Design > Edit HTML

2. Put checked marked in Expand Widget Templates

3. Find this tag by using Ctrl+F    ]]></b:skin>

4. Paste below code Before ]]></b:skin> tag

#subsfeed {  
    background: #616161 url(#);  
    width:260px;  
    height:45px;  
    }  
    .subsfeed_field{  
    width:200px;  
    height:18px;  
    border:2px solid #6ca408;  
   margin:13px;  
   float:left;  
   }  
   .subsfeed_button{  
   width:24px;  
   height:24px;  
   background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbWbdkuQR1ejlK1qjL6jaT8yklkiN5aEIDUvODHeb2uViqvwiKUkQ_uhu-zCbN-YXz4fMU6WqG1E9_oAxUjk_-Qczwr1JSq39Rd46prLBr-30soAhL8SCZl1EEeiYgQaanIZI0Rt7uVVZz/s1600/arrow.png);  
   border:0px;  
   margin:13px 0 0 2px;  
   cursor:pointer;  
   float:left;  
   }  

5. Now Go to Design >>page Element

6.Click Add gadget  and Select HTML/JavaScript 

7. Now paste paste below code

<div id='subsfeed'>
<form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=Feedburner URL&apos;, 
&apos;popupwindow&apos;, &apos;scrollbars=yes,width=500,height=520&apos;);return true' target='popupwindow'><input class='subsfeed_field' name='q' onblur='if (this.value == "")
 {this.value = "Enter Your E-mail...";}' onfocus='if (this.value == "Enter Your E-mail...") {this.value = "";}' type='text' value='Enter Your E-mail...'/>
<input name='uri' type='hidden' value='Feedburner URL'/><input name='loc' type='hidden' value='en_us'/><input class='subsfeed_button' type='submit' value=''/></form></div>  

Replace Feedburner URL with your Feedburner URL

8.  Now save  HTML/JavaScript. 
you are done.

0 comments:

Post a Comment