Hi Now add this best css design feedburner subscription box in blogger easily.
* Now click in design tab and edit HTML.
* Now click in small box to expand your blogger template.
* Find this code ]]</b:skin> by CTRL+F key.
* Now copy below code and paste before ]]</b:skin>
Follow simple and easy step to adding this cool box in your blogger blog ----->>>> * First go to your blogger Dashboard.
* Now click in design tab and edit HTML.
* Now click in small box to expand your blogger template.
* Find this code ]]</b:skin> by CTRL+F key.
* Now copy below code and paste before ]]</b:skin>
#subscribe {font-size:14px; color:#999;}
.subscribetext {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNNX8nbKU7HkFzk0ixuSNY6USYvmXm6gn_NAjV9siLMSJMGk8CbCuOchLYyzCSpoXS24YsNqTcs-YDVeRAL4oP2pGsGNQ8djDmiY8ZWFBibj3I0GWISz2BfRNpEbT6FIjZUR0CklIizFjN/s400/bullet.png) left no-repeat; padding-left:20px; margin-bottom:20px;}
.subscriberss {line-height:35px; font-size:18px; border-bottom:1px dotted #CCC; padding-left:5px;}
.subtext { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZSKdfeGPjPyNNMARCMae420tgnFCt_QIwbNqIXJMrhRpFGqGmQKPwksDtpb86eLJOWUebdhng_NuAXZhxifbyEyTN9DlswaAWSCt9rqaSgqU11izgKzpuH5jCCSEbiHSWr6R6tmoLSs_N/s400/feed.png) left center no-repeat; padding-left:37px; padding-bottom:5px;}
.twitter {line-height:35px; margin-bottom:15px; font-size:18px;border-bottom:1px dotted #CCC;}
.twittext { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgO_BNeaU06nTvLVDIUdVClhU6PfD_B1weNrUjMsgFAstv8PdSFs7WdUlR3G-0f6fdVBJSvD-HsiNUtkbj-RggVk0OsT1O6OorQq3TTepnl6LGsNNkJZnQU1irS_zj97DuZ0nYOiVS97q63/s400/twitter.gif) left no-repeat; padding-left:42px;}
.subscribemail {margin-bottom:7px; font-size:11px; font-family:Arial, Helvetica, sans-serif;}
.subscribeinput{border:1px solid #CCC; width:180px; padding:3px;}
.subscribesubmit{ background:#FB9E3D; color:#fff; border:1px solid #FFF; font-family:Arial, Helvetica, sans-serif; padding:3px; width:70px; -moz-border-radius:5px;}
.facebook {line-height:35px;font-size:18px;border-bottom:1px dotted #CCC;margin:-10px 0 15px 0;}
.facetext { background:url(http://www.longislandcateringhalls.com/i/facebook-icon.png) left no-repeat; padding-left:42px;}
* Again go to your blogger Dashboard .
* Click in design tab and you are here--->>> Page element.
* Now click in add gadget which is in sidebar and when open new window click in HTML/javascript from list.
* And when open new blank box copy below code and paste in blank box easily.
<div class='widget-content'>
<div id='subscribe'>
<div class='subscribetext'>Subscribe to our newsletter updates!</div>
<div class='subscriberss'><a class='subtext' href='YOUR FEEDBURNER URL HERE'>Subscribe via RSS feed</a></div>
<div class='twitter'><a class='twittext' href='YOUR TWITTER URL HERE'>Follow us on Twitter!</a></div>
<div class='facebook'><a class='facetext' href='YOUR FACEBOOK URL HERE'>Join Us On Facebook !</a></div>
<div class='subscribemail'>OR, subscribe via Email</div>
<form action='http://www.feedburner.com/fb/a/emailverify' id='subscribeform' method='get' onsubmit='window.open('http://www.feedburner.com', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true' target='popupwindow'>
<input class="subscribeinput" id="sub" name="email" type="text" value="" /><input name="url" type="hidden" value="YOUR FEEDBURNER EMAIL URL HERE" /><input name="title" type="hidden" value="WordPress" /><input name="loc" type="hidden" value="en_US" /> <input class="subscribesubmit" type="submit" value="Sign up" />
</form>
</div>
</div>
NOTE:- Change highlighted text in above code with your own ok.
* Now click to save your HTML/javascript and you are done.
* Now click to save your HTML/javascript and you are done.
No comments:
Post a Comment