Monday, 3 September 2012

Add top floating subscription widget in blog.

Now add best top floating subscription widget in your blogger blog easily.
Follow below giving simple and easy step to adding this great widget in your blogger blog---->>> * First go to your blogger Dashboard.
* Click in design tab and edit HTML now.

* Click in small box to expand your blogger template.

* Now find this code
]]</b:skin> by CTRL+F key.
* Copy below code and paste before
]]</b:skin>
#mta_bar { background:#444 url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpuzaVKzZwk6SOZqYf-cFTYy9tBOaaupoToPdf33Es8ZWzBts3p22xGil00xPNFMgR97ycRCNte5UFmLp5Oiw87Ls4ZiMVnAGt4nw64mzhC2holN9wA1FSVAKN4H1bi3pX-wcl1yWzKRMH/s400/wow.gif?imgmax=800') repeat-x; border-bottom: 1px solid #808080; margin: 0 0 3px 0; padding: 4px 0; z-index: 100; top: 0; left: 0; width: 100%; overflow: auto; position: fixed; }* html #mta_bar{ /*IE6 hack*/
position: absolute; width: expression(document.compatMode=="CSS1Compat"? document.documentElement.clientWidth+"px" : body.clientWidth+"px"); } #mta_bar .center{float:left; text-align:center; font-family:Verdana,Arial; font-size:13px; font-weight:bold; font-style:normal; color:#fff; width:65%}
#mta_bar .left{float:left; text-align:left; font-family:Verdana,Arial; font-size:13px; font-weight:normal; font-style:normal; color:#fff; width:20%}
#mta_bar .right{font-family:verdana,Arial,Helvetica,sans-serif; float:right; text-align:center; font-weight:normal; font-size:10px; letter-spacing:0; width:30px; white-space:nowrap}
#mta_bar .right a{font-size:10px; color:#fff; text-decoration:underline}
#mta_bar .right a:hover{font-size:10px; color:#fff; text-decoration:none}
#left_bar a{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9rceSCtp_4CLglbP3k4DZrll7uiXocRCsODZ9fgZLKn-nz9ZYwcfXvAAwy4IaKZj97KmnVV3RebBad_o3x18egRD5UPuug1AQHKl8pdP-M8O0kiqFedGs9qFEjf1RDhyphenhyphenfeOQBGjFD1XDa/s400/stripead-feed.gif') no-repeat; text-decoration:none; color:#fff; padding-left:23px; padding-right:0; padding-top:0; padding-bottom:0}
#left_bar a:hover{text-decoration:underline; color:#fff}
#left_bar2 a{background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFCa1CSU74_xeglAmXffuJ8rLtL9BGKo7XV3fCrq4krDJW6NwuON53LtXPQmgzmroN_bPfm0INfOJRek0wunio8onXEdd8B8qS_jcGgWWXQdLTS2TB6i7xVBTG-jT4L3GXtqc_mMFUf7E//) no-repeat 2px; text-decoration:none; color:#fff; padding-left:21px; padding-right:0; padding-top:0; padding-bottom:0}
#left_bar2 a:hover{text-decoration:underline; color:#fff}
* Now save your blogger template .
* Again go to your blogger Dashboard .

* Click in design tab and you are here--->>> Add new element.

* Click in add Gadget which is your blogger sidebar.

* When open new window click in HTML/javascript from list.

* When open new blank box copy below code and pate in blank box.

<div id='mta_bar'>
<div id='left_bar2'>
<span class='left'><a href='YOUR FACEBOOK URL HERE' target='_blank'>Add Me On Your Facebook</a></span></div>
<div id='left_bar'><span class='center'><a href='YOUR FEEDBURNER EMAIL URL HERE' target='_blank'>Subscribe this blog Via Email, Join Now!!!
</a></span></div>
<span class='right' onmouseout='self.status=\'\'' onmouseover='self.status=\'o-om.com.com\';return true;'>
<img align='absmiddle' border='0' onClick='closeTopAds();return false;' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgr6G3tfwUkBN_Lcz3XVNMJeDNuXPomrICjWZ6QItorKezZ_7Ivs6aZKkBBDGryupUDu-Tfa6ewSAUYse7Q4bh3G2SqPFnDoM7yvMhfEu-4-5rexDZJu8qRw7p85sPSrKu-trF5HJ54cGjr/s400/delete.png' style='cursor:hand;cursor:pointer;'/></span></div>
<script type="text/javascript">
if (window.jstiming) window.jstiming.load.tick('widgetJsBefore');
</script><script type="text/javascript" src="http://www.blogger.com/static/v1/widgets/560535965-widgets.js"></script>
NOTE:- Change Highlighted text in above code with your own ok.
* Now click to save your HTML/javascript .and now you done,

1 comment:

Unknown said...

hey frnd you have to find ]]> not ]]