06 May 2009

Add Stripe Ad in Blogger


1. Login into blogger with your ID
2. Click Layout
3. Click Edit HTML tab
4. Click Download Full Template and please back up your template first.
5. Copy and Paste the following code right above ]]><b:skin>



#mta_bar { background:#003366; border-top: 3px solid #6699ff; margin: 0; padding: 7px 0; z-index: 100; bottom:0px; right:0px; 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 .left { float: left; text-align: center; font-family: Arial; font-size: 13px; font-weight: bold; font-style: normal; color: #0000FF; width:92%;} #mta_bar .right {font-family: 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: #0000FF; text-decoration: underline;} #mta_bar .right a:hover {font-size: 10px; color: #0000FF; text-decoration: none;} #left_bar a {background: url('http://img229.imageshack.us/img229/3826/icorsstransthumb1bj4.png?imgmax=800') no-repeat; text-decoration: none; color: #fff; padding:5px 0px 5px 30px;} #left_bar a:hover { text-decoration: underline; color: #fff; }
6. Find this code </head> in your template 7. Copy and paste the following code right above </head>
<script type='text/javascript'> //<![CDATA[ var mta_arr = new Array(); var mta_clear = new Array(); function mtaFloat(mta) { mta_arr[mta_arr.length] = this; var mtapointer = eval(mta_arr.length-1); this.pagetop = 0; this.cmode = (document.compatMode && document.compatMode!="BackCompat") ? document.documentElement : document.body; this.mtasrc = document.all? document.all[mta] : document.getElementById(mta); this.mtasrc.height = this.mtasrc.offsetHeight; this.mtaheight = this.cmode.clientHeight; this.mtaoffset = mtaGetOffsetY(mta_arr[mtapointer]); var mtabar = 'mta_clear['+mtapointer+'] = setInterval("mtaFloatInit(mta_arr['+mtapointer+'])",1);'; mtabar = mtabar; eval(mtabar); } function mtaGetOffsetY(mta) { var mtaTotOffset = parseInt(mta.mtasrc.offsetTop); var parentOffset = mta.mtasrc.offsetParent; while ( parentOffset != null ) { mtaTotOffset += parentOffset.offsetTop; parentOffset = parentOffset.offsetParent; } return mtaTotOffset; } function mtaFloatInit(mta) { mta.pagetop = mta.cmode.scrollTop; mta.mtasrc.style.top = mta.pagetop - mta.mtaoffset + "px"; } function closeTopAds() { document.getElementById("mta_bar").style.visibility = "hidden"; } //]]> </script>


8. find this code </body> in your template ( end of template code)
9. Copy and paste the following code right above </body>


<div id='mta_bar'> <div id='left_bar'><span class='left'><a href='http://feeds.feedburner.com/Trik-tipsBlog' target='_blank'>More than 786 have subcribed in readers, have you?</a></span></div> <span class='right' onmouseout='self.status=&apos;&apos;' onmouseover='self.status=&apos;trik-tipsblog.blogspot.com.com&apos;;return true;'> <img align='absmiddle' border='0' onClick='closeTopAds();return false;' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhE5gdIXdh3sK3IA1Nk4-FtqZcxCyF5L7fzYS1gPeO7axA0W6mmETQw6m_4wYfsGrjyudqzcuCXi2kh4SZlJnWWKR2_8wn6UWSwBRDVeKprhphm5udyn8N5zhTkJvKsC-QL2HXm1GvfZEA/?imgmax=800' style='cursor:hand;cursor:pointer;'/></span></div>

10. Click Save template
11. Finish then view your blog.

VIEW DEMO THIS TUTORIAL HERE

No comments:

Post a Comment