Friday, November 21, 2008

How to use Strips Ad in Blogger

Tips for Bloggers

You can use Stripe-ads to promote something (can be text ads, announcements, Feed or any appropriate information needs) from your Blog. Using Strips-ads is better than using the ads in Popup-Ads (Pop-ups, pop-overs and pop-unders), because using Popup-Ads can be block by Popup Blocker and from some case readers feel annoying with Popup-Ads.

blogging tips

Folow Instruction below to use Strips ads:

1. Upload File javascript below to your storage location, Save the file with the name Stript-ads.js

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";
}

2. Create pic and upload to your storage location, Save the file with the name close.gif

3. Sign In to your Blogger account and go to Layout -> Edit HTML.


4. Find ]]></b:skin> you can use ctrl+f to make you easy to find the code

Copy CSS code below and Paste above ]]></b:skin>


#mta_bar { background: #FFFFE1; 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 .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 { text-decoration: none; color: #0000FF; }
#left_bar a:hover { text-decoration: underline; color: #0000FF; }

5. In your Template Find </head> , and copy-paste below code

<script src='http://www.locationURLwhereyousavethefile.com/Stripe-Ads.js' type='text/javascript'/>

Do not forget to adjust the location of the URL address where you save the JavaScript file

6. In your Template Find <body>, and copy-paste below code

<div id='mta_bar'>
<div id='left_bar'><span class='left'><a href='
http://feeds.feedburner.com/Gokhiel-logs' target='_blank'>Get the latest update from gokhiel Weblog via Email?&lt;/a></span></div>
<span class='right' onmouseout='self.status=&apos;&apos;' onmouseover='self.status=&apos;
gokhiel.com&apos;;return true;'> <img align='absmiddle' border='0' onClick='closeTopAds();return false;' src=' http://www.locationURLwhereyousavethefile.com/close.gif.' style='cursor:hand;cursor:pointer;'/></span></div>

7. Preview your Blog if its ok you can save your Template. :)



Related Topics:
How to Remove Underline below Text Link in Blogspot
How to add a PAYPAL DONATE button to your blog (Blogspot)
How to Make Author Comment Have Different Color in Blogspot
How to Remove the Number of Label in Blogspot
How to use Strips Ad in Blogger
How to Hide / Remove Blogger Navigation bar

3 comments:

  1. Nice blog and good useful tips, nice been here.

    ReplyDelete
  2. Great tutorial! I just released Stripe Ads, which works on any website, not just blogs. It is very powerful and easy to use. All ads are controlled from an admin interface and can be rotated across unlimited websites. Visit www.stripeads.com for details.

    ReplyDelete
  3. More and more good tips here, especialy to monetize a blog.

    ReplyDelete