Installing This Gadget On Blogger
You May Follow The Easy Steps Mentioned Below In Instruction To Add The Widget To Your Blogger Blogs.Follow These Easy Steps:
- Go To Blogger > Design > Edit HTML
- Backup Your Template
- Search For This
]]></b:skin>
- Just Above It Paste The Following CSS Code,
/* --Blogger Sticky Bar By Www.Tonyisright.Blogspot.Com-- */
#mbt_bar{
background: #232323;
width:100%;
margin:0px auto 0px auto;
text-align:center;
padding:5px 0 5px 25px;
box-shadow: #666666 0px 1px 3px;
z-index: 9998;
height: 27px;
position:fixed;
line-height: 1.85em;
vertical-align: baseline;
letter-spacing: 1px;
text-decoration:none;
color:#fff;
font-size:13px;
font-weight:bold;
font-family: Helvetica, sans-serif;
line-height: 24px;
border-top:1px solid #000;
border-bottom: 2px solid rgb(255, 255, 255);
}
#mbt_bar a{
text-decoration:underline;
color:#FFFC00;
font-size:12px;
font-weight:bold;
font-family: verdana, arial,"Helvetica",sans-serif;
line-height: 24px;
}
#mbt_bar a:hover{
text-decoration:underline;
}
#mbt_bar p {margin:0; list-style:none;}
#mbt_bar img {vertical-align: middle;
margin-right: 6px;}
#blog-pager, .pagenavi {
clear: both;
text-align: center;
margin: 30px auto 10px;
}
- Next Search For </head> And Paste The Following Javascript Code Just Above It
<script type='text/javascript'>
//<![CDATA[
var mbt_arr = new Array();
var mbt_clear = new Array();
function mbtFloat(mbt) {
mbt_arr[mbt_arr.length] = this;
var mbtpointer = eval(mbt_arr.length-1);
this.pagetop = 0;
this.cmode = (document.compatMode && document.compatMode!="BackCompat") ? document.documentElement : document.body;
this.mbtsrc = document.all? document.all[mbt] : document.getElementById(mbt);
this.mbtsrc.height = this.mbtsrc.offsetHeight;
this.mbtheight = this.cmode.clientHeight;
this.mbtoffset = mbtGetOffsetY(mbt_arr[mbtpointer]);
var mbtbar = 'mbt_clear['+mbtpointer+'] = setInterval("mbtFloatInit(mbt_arr['+mbtpointer+'])",1);';
mbtbar = mbtbar;
eval(mbtbar);
}
function mbtGetOffsetY(mbt) {
var mtaTotOffset = parseInt(mbt.mbtsrc.offsetTop);
var parentOffset = mbt.mbtsrc.offsetParent;
while ( parentOffset != null ) {
mbtTotOffset += parentOffset.offsetTop;
parentOffset = parentOffset.offsetParent;
}
return mbtTotOffset;
}
function mbtFloatInit(mbt) {
mbt.pagetop = mbt.cmode.scrollTop;
mbt.mbtsrc.style.top = mbt.pagetop - mbt.mbtoffset + "px";
}
function closeTopAds() {
document.getElementById("mbt_bar").style.visibility = "hidden";
}
//]]>
</script>
- Finally Search For <body> And Just Below It Paste The Following HTML Code
<div style='z-index:999999; position:absolute; margin-right:20px;'>
<fb:recommendations-bar action='like' max_age='0' num_recommendations='3' read_time='20' side='right' trigger='30%'/></div>
<div id='mbt_bar'><font style='color:#FFFC00;'/><blink> Latest!! </blink>
<a href='http://www.tonyisright.blogspot.com/' rel='nofollow'>Blogger Widgets and plugins</a>
<span style='padding:0px 0px 0px 6px; margin:0px;'>
<img align='absmiddle' border='0' onClick='closeTopAds();return false;' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjg43ralWEB-yH1Fq8K2SxCMN9PI69vXaXyucoKCXHJirLTBKGz2pPrXOHDQv-1tOVu4EQ684pPTBeLcSB8AB548ySqHh1U9dSKpuURYJDmqFaTvdJxsXzvokaNRQH2MP7mKSrqJHk6o955/s400/cancel.png' style='cursor:hand;cursor:pointer;'/></span></div>
<br/><br/>
- Save Your Template
- You Are All Done!
Visit Your Blog To See It Fixed To The Top Just Beautifully With A Close Button Waiting To Be Clicked!
Customizations:
- To Modify The Background Color Of The Bar Then Simply Change This #232323 Use Our Color Code Generator For Doing This.
- Replace http://www.tonyisright.blogspot.com/ With Your Text Link (Can Be Your RSS Link, Important Post Link Etc.)
- Now Replace Blogger Widgets and plugins With Anything You Wish To Write.
If You Face Any Problem Installing This Widget, Submit Your Problem In Comments.
