Adding an email subscription box is very important for every blog or site, without an email subscription box or link the site or blog is useless, if i may use the word; useless, adding it on your website will double your blog visits. If you truly want get more blog reader, i'll advise and suggest you get an email subscription widget on your blog because gets the attention of the reader,most especially when carefully placed and styled properly below your every blog post, it gets there attention more.
How can i add this to my Blog ?
One.) Quickly login to your blogger dashboard, Locate ''
TEMPLATE''
TWO.) USE "Ctrl+F" to search for
]]></b:skin> .
Just before
]]></b:skin> , you can paste the codes below
#nrt-box{background: -webkit-gradient(linear, left top, left bottom, from(#00aeef), to(#00aeef));;border:1px
solid #00aeef;border-radius:10px; margin-bottom:10px;padding:10px;text-align:center;background: -moz-linear-gradient(top, #333, #00aeef)}
#nrt-box h1{margin-top:5px; color:#FFF;font-family:georgia;font-size:25px;margin-bottom:5px;padding:0;text-shadow:0 2px 3px #000;line-height:35px}
#nrt-box input{background: -moz-linear-gradient(center top , #FFFFFF, #EFEFEF) repeat scroll 0 0 transparent;border:medium none;border-radius:10px 10px 10px 10px;font-size:14px;padding:10px;text-shadow:1px 1px 0 #FFF;width:280px; color:#666; font-family:georgia; margin-bottom:5px;}
#nrt-box .submit{background: -webkit-gradient(linear, left top, left bottom, from(#369a18), to(#205f0d));background: -moz-linear-gradient(center top , #ff00ff, #ec008c) repeat scroll 0 0 transparent;color:#FFF;cursor:pointer;font-weight:bold;margin-left:20px;text-shadow:0 1px 2px #000;width:120px; font-family:georgia; margin-left:5px;}
#nrt-box .submit:hover{background: -moz-linear-gradient(center top , #9e005d, #9e005d) repeat scroll 0 0 transparent}
#nrt-box .submit:active{background: -moz-linear-gradient(center top , #46B725, #205F0D) repeat scroll 0 0 transparent}
4. USE "Ctrl+F" to locate
<data:post.body/> . Just after it, you can paste the below code:
<b:if cond='data:blog.pageType == "item"'>
<div id='nrt-box'><h1>Subscribe To Get FREE Tutorials</h1><form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open('http://feedburner.google.com/fb/a/mailverify?uri=nairotech', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true' target='popupwindow'><center> <input name='email' onblur='if (this.value == "") {this.value = "Enter Your Email Address...";}' onfocus='if (this.value == "Enter Your Email Address...") {this.value = ""}' size='30' type='text' value='Enter Your Email Address...'/> <input name='uri' type='hidden' value='nairotech'/> <input name='loc' type='hidden' value='en_US'/> <input class='submit' type='submit' value='Subscribe'/></center></form></div>
</b:if>
- Now, you can Replace nairotech with yours.
|
SCREENSHOT OF THE SUBSCRIPTION BOX |
If you liked this Tutorial on how to add a stylish email subscriotion box below post, then don't forget to comment and use the share buttons, you may as well like us on
Facebook and Follow us On
TWITTER
It's quite unfortunate I'm not on blogger!
ReplyDeleteLol. Emmanuel, you can always join the team of bloggers.. I am always available to guide you through. Thanks for visiting
Delete