ADVERTISEMENTS
How to add Stript Ad to Blogs?
If you like blogging with wordpress engine, I believe that you are familiar with a plugin called Stript ad which is created by MaxBlogPress. With this Stript ad plugin, you can deliver the important message for your blog visitors. Now, can we use stript ad plugin in blogger? Don’t’ worry, because we do it because stript ad plugin use JavaScript which means that we can add it in blogger or blogspot.
One of implementation that I have applied is the message to subscribe the feed as you can see at the image below:
One of implementation that I have applied is the message to subscribe the feed as you can see at the image below:
- Login into blogger with your ID
- Click Layout
- Click Edit HTML tab
- Click Download Full Template and please back up your template first.
- 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('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9V4qSr6p_sW85NAmNsjCo_tEo8aE1395eYJuntwidawvhI2goV1KTJ1ffVlVlKlbn5j5DiV2zV00HC0U6CW46gF63e-9EMvECiFvP4fAsKIHfvu7_zYhP3NTDY2ICDTVeblSj5mrcb_Q/?imgmax=800') no-repeat; text-decoration: none; color: #fff; padding:5px 0px 5px 30px;}
#left_bar a:hover { text-decoration: underline; color: #fff; } - Find this code </head> in your template
- 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> - Find this code </body> in your template ( end of template code)
- Copy and paste the following code right above </body>
(change the red mark with your’s)
</body><div id='mta_bar'>
<div id='left_bar'><span class='left'><a href='http://feeds.feedburner.com/wonderfultricks' target='_blank'>More than 300 have subcribed in readers, have you?</a></span></div>
<span class='right' onmouseout='self.status=''' onmouseover='self.status='wonderful-tricks.blogspot.com';return true;'> <img align='absmiddle' border='0' onClick='closeTopAds();return false;' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRrFjcM6PhTSMTLIUHEaj1R9u6Bs5sqk5qzUWAQFNeqM2NjlxfHT3Aa6dSdViukCr5IUk03juDvkw97CNheMA3yOuY8Nxz9dTNkF9cBBVhfZwxGG95FFcO375S7yoJPP1QSo0M8TypbLM/?imgmax=800' style='cursor:hand;cursor:pointer;'/></span></div> - Click Save template
- Finish and see the result.
0 comments