Hi friends,in this post I am sharing free blogger subscription form for blogger.Default subscription form not look attractive.And I am now providing subscription form which looks simple and neat.If you want place subscription form at the center of header or footer ,this subscription form will be good choice.
A sample subscription form given in above demo link.Kindly see the sample at the footer side.
Note: Make a backup of your template.If anything gone wrong,this backup will be helpful
And in above code just replace “Techinfoweb” with your feedburner name.If you like this share it and enjoy.
A sample subscription form given in above demo link.Kindly see the sample at the footer side.
Note: Make a backup of your template.If anything gone wrong,this backup will be helpful
- Now goto Blogger >> Dashboard >>Template >>Edit Html.
- Click “format template” and find ]]> </b:skin> Just above ]]> </b:skin> add the following code.
| #fullwidth{ margin-left:170px; width:960px; height:460px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhPPat1lnkybol0yCGlTCLidFJTrIZZoo-7PNtmBRuFGhFW3w5EGWpU3y3I6WkoZg8SP54ZBeLDGDHRaljhCYWm6k-2Dp93vHyo-uIlTG45mfytKwFfOYxFtxEE9kjZLaQi3SZiAwSMcnb/s1600/subform.png); background-repeat:repeat; } #fullwidth .rightside{ margin-top:160px; margin-right:30px; float:right; width:300px; height:150px; } .signupbutton { margin-left:25px; margin-bottom:10px; background-color:#212121; -moz-border-radius:28px; -webkit-border-radius:28px; border-radius:28px; border:1px solid #000000; display:inline-block; cursor:pointer; color:#ffffff; font-family:Georgia; font-size:20px; padding:16px 76px; text-decoration:none; text-shadow:0px 1px 0px #000000; } .signupbutton:hover { margin-left:25px; margin-bottom:10px; background-color:#000000; } .signupbuttonactive { margin-left:25px; margin-bottom:10px; position:relative; top:1px; } .whitebutton { margin-bottom:10px; -moz-box-shadow:inset 0px 1px 0px 0px #ffffff; -webkit-box-shadow:inset 0px 1px 0px 0px #ffffff; box-shadow:inset 0px 1px 0px 0px #ffffff; background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffffff), color-stop(1, #f6f6f6)); background:-moz-linear-gradient(top, #ffffff 5%, #f6f6f6 100%); background:-webkit-linear-gradient(top, #ffffff 5%, #f6f6f6 100%); background:-o-linear-gradient(top, #ffffff 5%, #f6f6f6 100%); background:-ms-linear-gradient(top, #ffffff 5%, #f6f6f6 100%); background:linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0); background-color:#ffffff; -moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px; border:1px solid #dcdcdc; display:inline-block; cursor:pointer; color:#666666; font-family:arial; font-size:20px; font-weight:bold; padding:16px 38px; text-decoration:none; text-shadow:0px 1px 0px #ffffff; } .whitebutton:hover { background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f6f6f6), color-stop(1, #ffffff)); background:-moz-linear-gradient(top, #f6f6f6 5%, #ffffff 100%); background:-webkit-linear-gradient(top, #f6f6f6 5%, #ffffff 100%); background:-o-linear-gradient(top, #f6f6f6 5%, #ffffff 100%); background:-ms-linear-gradient(top, #f6f6f6 5%, #ffffff 100%); background:linear-gradient(to bottom, #f6f6f6 5%, #ffffff 100%); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#ffffff',GradientType=0); background-color:#f6f6f6; } .whitebutton:active { position:relative; top:1px; } |
- Now just below body(if you want to add form above header) or just above </html>(if you want to add subscription form below footer) add the following code,
| <div id='fullwidth'> <form class='rightside' action='http://feedburner.google.com/fb/a/mailverify' method='post'target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=Techinfoweb', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"> <div > <input class="whitebutton" type='text' name='name' placeholder='Your Name' /></div> <div> <input class="whitebutton" type='text' name='email' placeholder='Your Email' /></div> <input type="hidden" value="Techinfoweb" name="uri"/> <input type="hidden" name="loc" value="en_US"/> <div> <input value="Sign Up Now!" class="signupbutton" type="submit" /></div> </form> </div> |
Hi. I am interested in blogging.And sometimes play with webdesign,web development,domain sale,designing logo and more.
0 comments :
Post a Comment