Monday, 3 September 2012

Add animated feedburner email widget in blog.

Now add animated feedburner email subscription box below all blog post so that people subscribe those post.
Follow simple and easy step to adding this cool widget box in blog--->>>> * First go to your blogger Dashboard .
* Now click in design tab and edit HTML .

* Click in small box to expand your blogger template.

* Now find this code
]]</b:skin> by CTRL+F key easily.
* Copy below code and paste before
]]</b:skin>
#singlesubscribe {
border: 1px solid #CCC;
padding: 10px 0;
margin: 5px auto 0;
text-align: center;
}
.subscribetitle {
color: #3A5796;
font-family: arial;
font-size: 13px;
font-weight: 700;
padding: 0 4px;
}
.rss-icon {
background: url("http://www.shoutmeloud.com/wp-content/themes/thesis_18/custom/images/arrow_left.gif") no-repeat;
width: 105px;
height: 60px;
float: left;
margin: 5px 0 0 10px;
}
* Now again find this code <div class='post-footer-line post-footer-line-1'>
* Copy below code and paste after 
<div class='post-footer-line post-footer-line-1'>
<div id='singlesubscribe'>

<span class='subscribetitle'><b style='text-decoration:blink; color: #007EC4; font-size:18px;'>&#8594;</b>  Recieve Daily Newsletter By YOUR BLOG NAME <b style='text-decoration:blink; color: #007EC4; font-size:18px; '>&#8592;</b></span>
<a class='rss-icon' href='http://feeds.feedburner.com/welcometospicytricks' target='_blank' title='RSS Feeds'></a>
<form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(\'YOUR FEEDBURNER EMAIL URL HERE\', \'popupwindow\', \'scrollbars=yes,width=550,height=520\');return true' target='popupwindow'>
<input name='uri' type='hidden' value='YOUR BLOG NAME'/>
<input name='loc' type='hidden' value='en_US'/>
<input class='txt' name='email' onblur='if (this.value == " ") {this.value = "Your E-mail Address";}' onfocus='if (this.value == "Your E-mail Address") {this.value =" ";}' type='text' value='Your E-mail Address'/>
<input class='btn' type='submit' value='Subscribe'/>
<div style='clear: both;'></div>
</form>
</div>
Note:- Change Highlighted Text in above code with your own ok.
* Now save your blogger template now you are done.

No comments: