The best way to load javascript based ads

This will only work if your ad code is javascript and not iframe/swf etc.

If you've ever run ads from any network, you've probably experienced times when the ads will load slowly either because the network is slow or down altogether, and if they are javascript based ads, they will stop your whole page from loading until they've either loaded, or timed out.

Example

Even if you've never had this happen with your ads, I'd still recommend doing the following incase it ever does happen (plus your page will load first, which is the most important thing afterall).

Simple put this small div tag exactly where you want your ads to appear:

<div id="ad-0" align="center"></div>

Code (markup):

*Change the align if you need to.
**If you have more than one ad on your page, simply paste the code in the other areas but change the "ad-0" to "ad-1", "ad-2" etc.

Then, right at the bottom of your page, just before the </body>, paste:

<div style="display:none">  <div id="adsource-0">
    <script language="javascript" src="http://www.adnetwork.com/ads12345" type="text/javascript"></script>
  </div>
</div>
<script type="text/javascript">
    source = document.getElementById("adsource-0");
    placeholder = document.getElementById("ad-0");
    placeholder.appendChild(source);
</script>

Code (markup):

*Change the src"" part of the javascript to your ad code.
**Again, if you have more than one ad per page, just paste the code again and rename the "ad-0" to "ad-1" and "adsource-0" to "adsource-1" etc.

All this is doing is simply loading the javascript at the very bottom of your page rather than in the middle or at the top, so it no longer stops your page from loading.

This won't magically make the ads load and your page will still act as if its loading, but at least now your visitors will be able to see all of your page and continue browsing while the ads load.

Here's a final example of the whole thing but in this case, we'll be loading 3 ads on one page:

<div id="ad-0" align="center"></div>

Code (markup):

<div id="ad-1" align="center"></div>

Code (markup):

<div id="ad-2" align="center"></div>

Code (markup):

<div style="display:none">  <div id="adsource-0">
    <script language="javascript" src="http://www.adnetwork.com/ads12345" type="text/javascript"></script>
  </div>
</div>
<script type="text/javascript">
    source = document.getElementById("adsource-0");
    placeholder = document.getElementById("ad-0");
    placeholder.appendChild(source);
</script>

Code (markup):

<div style="display:none">  <div id="adsource-1">
    <script language="javascript" src="http://www.adnetwork.com/ads12345-1" type="text/javascript"></script>
  </div>
</div>
<script type="text/javascript">
    source = document.getElementById("adsource-1");
    placeholder = document.getElementById("ad-1");
    placeholder.appendChild(source);
</script>

Code (markup):

<div style="display:none">  <div id="adsource-2">
    <script language="javascript" src="http://www.adnetwork.com/ads12345-2" type="text/javascript"></script>
  </div>
</div>
<script type="text/javascript">
    source = document.getElementById("adsource-2");
    placeholder = document.getElementById("ad-2");
    placeholder.appendChild(source);
</script>

Code (markup):

- Posted this in the PPC forum since it'll be seen more here by publishers.

 

Thank you very much Aaron, I am using it since you posted it at the first time, in other thread. And I can say that after starting use this codes, my site is loading fast, it doesn't have any loading problems anymore!

 

nice method

 

Thanks for sharing this methods.

 

What is this defer="defer"? How can we use it?

 

I tried "defer" before, and even "async".
None of these will work on most ad links (no ad displayed).
I think maybe it breaks the document.write.

 

/shrug

Seems to work for everyone else.

EDIT: defer has problems with IE apparently, so this way is better as it works in all browsers.

 

If the ad codes are already at the bottom (like infolinks ads), your method can't make a difference in the speed. Isn't it?
Have you noticed any change in your CTR after using your method? Because your visitors may see the ads on the top delayed for about 1 second.
I think that your method might prevent ad blindness and might increase CTR of the ad block(s) above the fold.

 

Correct.

I use a CPM based network so don't have CTR.

Well that depends entirely on how fast your content loads. Most of my pages are fully loaded with a couple of seconds at most, but if your pages have a considerable amount of content then yes, it would possibly delay them longer than they would normally load. However that's a very small sacrifice incase the ad network goes down (like cpmfun.com has and most people are now complaining their pages aren't loading at all). Don't you think?

 

It might be the worked websites are just content displaying pages, not like my sites using ondomready.

-- this is my previous reply in the other thread-----------------------
No offense.
This method do not help when responses slowly.
What this method do is to load ad script in hidden div, and displayed it later.
Just in case I tried this codes before reply.

When there are other codes after cpmfun slow ad links in publisher website pages, those codes will wait for cpmfun ad links.
When there are some actions binded to ondomready, those actions will not be binded until cpmfun ad links ready.
--------------------------------------------------------------------

 

It will be giving all the html codes first then will be giving the javascript codes. Basically it replaces the load order of any page element we want. Even a header image can be loaded as the latest page element. So the ads we select will always be shown delayed regardless of which ad network is used. I agree, if a page is not so heavy we may not notice any delay in seeing the ads above the fold.

This possible delay may not be a sacrifice. Instead, this delay may be an advantage if we display a PPC banner delayed (i.e., 728x90 adsense banner at the top). That's what I wanted to point out. You display CPM ads and you don't need to worry about CTR. That's cool.

 

Guys, sorry for too much questions, but I am not good at coding and I don't understand well - can you explain me a little more explicit, please? The ads will be displayed a little later than my page, and the CTR will decrease? Or the ads will show first, and the page will be displayed a little later?

 

Your page will load before the ad. It helps with slow ads like CPMFUN, which is has been slow lately! Incidentally if you have CPMFUN judging by your sig, your CTR shouldn't matter since it's CPM. But for CTR ads I still think that your site not loading at all would be a bigger problem than loading the ad last.


Thanks to original poster!

 

I think he also uses Adsense, but yeah I'd still do this, you could risk it if you wanted though (being Google they should never be slow/down).

 

Thank you very much, guys! Yes, I am using also Adsense, together with CPMfun, and using this codes provided by Aaron I didn't saw any difference of which ad is loading faster, or if the ads or the site is opening faster, that's why I asked it - for me the codes are working fine, both the site and the ads are loading fast, that's why I can't see any difference between the different ad's loading time!

 

Is there anyway to do this, or something similar, with iframe ads?

 

iframes shouldn't hold up the page, what problem are you having? If you can link to an example I'll take a look.

 

At first I thought my page wasn't loading because of SureCPM, but then I realized I never implemented this on one of my pages and CPMFun was down. I fixed it and am all set now.

Thanks though!

 

Um, my post was removed.

Basically though iframe never slow pages because they are other pages being loaded on your page in a window(frame).

Just be careful with iframe based ads, some advertisers like frame bust, which is a problem I had with a network a few months back, and there's no way to stop frame busting, even after searched countless hours on google for a defense.

 

tried...working awesome