Take the 2-minute tour ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.

I know that there is a Asynchronous method of using Google Analytics but is there something similar for adsense? I can't find one from my current searches - I was wondering whether there is a common trick I'm missing?

share|improve this question
add comment

6 Answers

Yes, there is a way - using iframes. We do asynchronous loading of ad content on one of our customer's sites.

You first have to contact Google for support of their ads in iframes (which was not widely available back when we built that site). You can then use JavaScript to trigger the loading of the AdSense iframe content, which is what we do.

The solution is really straight forward once you have Google's iframe support.

Edit: Looks like - from the posts referenced by Virtuosi Media - this practice might not be welcome by Google...

Edit 2: This is the code we use in the iframe. Try it out to see if it works, maybe even without specifically asking Google for support. Removed type="text/javascript" language="JavaScript" for better legibility:

<head runat="server">
    <script src="http://partner.googleadservices.com/gampad/google_service.js">
    </script>

    <script>
        GS_googleAddAdSenseService("ca-pub-YOURKEY");
        GS_googleEnableAllServices();
    </script>

    <!-- For this method, it is not necessary to define the slots in advance 
         and we do not use the FetchAds function -->
    <script>
        GA_googleUseIframeRendering(true);    //<%-- This indicates iframe rendering for all slots --%>
    </script>
</head>
<body>
    <form id="formAd" runat="server">
        <div>
            <script>
                GA_googleFillSlotWithSize("ca-pub-YOURKEY", "AdSlotId",
                                          iframeWidth, iframeHeight);
            </script>
        </div>
    </form>
</body>

We fill all of our slots through adslot ids, so we are not seeing any PSAs.

share|improve this answer
1  
Can you provide more detail on contacting Google about this? I don't see anything about it in my AdSense account. –  Virtuosi Media Aug 24 '10 at 18:26
    
Also, I'd be curious to know if the ad units still deliver relevant ads or just PSA's and how you worked around that problem. –  Virtuosi Media Aug 24 '10 at 18:29
    
Actually, we fill all of our slots through adslot ids, so we are not seeing any PSAs. –  Oliver Aug 25 '10 at 22:55
    
when using this method, I get GA_googleFillSlotWithSize is not defined error –  Timo Huovinen Nov 11 '11 at 11:43
    
@YuriKolovsky: looks like Google's script is not loading properly. See my Edit 2: you might need to apply for this method with Google. –  Oliver Nov 11 '11 at 12:27
show 1 more comment

There is no further need to do this. The Google AdSense's show_ads.js now somewhat asynchronous. You can read more about the gory details on the official blog:

Your Web, Half a Second Sooner

There is no need to change ad code.

share|improve this answer
add comment

this does it:

<script type="text/javascript"><!--
// dynamically Load Ads out-of-band
setTimeout((function ()
{
    // placeholder for ads
        var eleAds = document.createElement("ads");  
        // dynamic script element
        var eleScript = document.createElement("script");  
        // remember the implementation of document.write function
        w = document.write;
        // override and replace with our version
        document.write = (function(params)
        {
        // replace our placeholder with real ads
        eleAds.innerHTML = params;
        // put the old implementation back in place
        // Aristos, add this check because called more than ones
        //  and ends, with this symbol.
        if(params.indexOf("</ins>") != -1)
            document.write=w;
        });
        // setup the ads script element
        eleScript.setAttribute("type", "text/javascript");
        eleScript.setAttribute("src", "http://pagead2.googlesyndication.com/pagead/show_ads.js");
        // add the two elements, causing the ads script to run
        document.body.appendChild(eleAds);              
        document.body.appendChild(eleScript);           
}), 1);
                //-->
        </script> 

see this blog item "Google Ads Async (asynchronous)" basically I've found a way to get the ad code to run truly async..

share|improve this answer
1  
+1 for the smart solution provided in the link. It's very interesting the way it backups the standard document.write function and restores it later. The only downside is that I'm wondering if Google Adsense TOS allow to do this kind of stuff? –  Marco Demaio Aug 12 '11 at 15:52
    
+1 for the idea, I take it and make it work a little better and post it here. I fail to make this GS_googleAddAdSenseService work with the other idea. –  Aristos Jan 25 '12 at 12:10
add comment

Because google say "lets make the web faster" I change the above code to load the google ads only when they are visible. The code is work "as is" only for one google place ad, but I think you can easy modify it for more ads. The different with the other code are

  • Load ads only if the are visible to the user
  • Loads ads and place them on a div (not on end of the page)
  • Works with all browsers because I load all items needed (not only the first)

Starting with the div that I place the ads later on.

<div id="adSpot" ></div>

<script type="text/javascript">
    // load the script with cache
    function getScriptCcd(url, callback)
    {
        jQuery.ajax({
                type: "GET",
                url: url,
                success: callback,
                dataType: "script",
                cache: true
        });
    };

    // to unbind the scroll I keep the total binds of scroll
    // in this example I have only one.
    var cPosaScrollExo = 0;
    // bind the scrool to monitor if ads are visible    
    function addThisScroll(RunThisFunction)
    {
        jQuery(window).scroll(RunThisFunction);
        cPosaScrollExo++;
    }
    // unbind all scroll if all they not needed any more
    function unBindScroll()
    {
        cPosaScrollExo--;

        if(cPosaScrollExo <= 0)
        {
            cPosaScrollExo = 0;
            jQuery(window).unbind('scroll');
        }
    }

    // here I check if the element is visible to the user with a 100pixel advanced.
    function isScrolledOnMatia(pioSimio) 
    {
        var SimioPouTheloNaFenete = (jQuery(pioSimio).offset().top - 100 );
        var scrollPosition = jQuery(window).height() + jQuery(window).scrollTop();

        return (scrollPosition >= SimioPouTheloNaFenete );
    }   

    // the ads informations
    google_ad_client = "pub-XXXXXXXXXXXXXXX";
    google_ad_slot = "XXXXX";
    google_ad_width = 468;
    google_ad_height = 60;

    var GoogleIsVisible = false;
    // we call this function on every window scroll
    function CheckAdsVisibility()
    {
        if(!GoogleIsVisible)
        {
            if(isScrolledOnMatia("#adSpot"))
            {
                unBindScroll();
                GoogleIsVisible = true;

                            // finally I go to show the ads
                LoadAdsLater();
            }
        }
    }

    // here is a modification of the function that load the ads
    function LoadAdsLater()
    {
        try
        {
                    // Aristos: nice trick here 
            // remember the implementation of document.write function
            w = document.write;

            // override and replace with our version
            document.write = (function(params)
            {
                jQuery("#adSpot").append(params);

                // put the old implementation back in place when
                            //  all writes are finish
                if(params.indexOf("</ins>") != -1)
                    document.write=w;
            });             

            // loading script
            getScriptCcd("http://pagead2.googlesyndication.com/pagead/show_ads.js");
        }
        catch(e)
        {
            // check for errors on debug
        }
    }

    // and here we setup the hole thin
    jQuery(document).ready(function() 
    {       
            // check if all ready is visible !
        CheckAdsVisibility();
            // bind the scroll
        addThisScroll(CheckAdsVisibility);
    });
</script>

I have test it and working with all browsers, I just use jQuery to be more safe that I am avoid browsers difficult.

ps, I have make similar code to load the google plus, and the facebook and all that items that load with out reason the most of the times.

share|improve this answer
add comment

You can use a placeholder, call the Adsense code and then switch the placeholder with the ad. I'm using something like this on my site:

if ( ad1 = document.getElementById('ad-top') )
{
    ad2 = document.getElementById('banner_tmp468');
    ad1.appendChild(ad2);
    ad2.style.display = 'block';
}

Google even recommends doing this when they say that you should have your most important ad position first in your HTML code. If you want to accomplish that you'll have to use JS or CSS to move less important ad units to the (visual) top of your page.

But as far as I know AdSense already renders ads asynchronously. I've only very rarely seen it block pageloading. Not sure about this though.

share|improve this answer
add comment

They don't currently offer the option, as far as I can see. Your best option, if it was allowed by the Google TOS, would have been to use a placeholder element and replace it dynamically with JavaScript after the page has loaded. However, it appears as if it may be against the TOS. See this thread for more details.

share|improve this answer
add comment

protected by Stephen Ostermiller Nov 1 '13 at 1:54

Thank you for your interest in this question. Because it has attracted low-quality answers, posting an answer now requires 10 reputation on this site.

Would you like to answer one of these unanswered questions instead?

Not the answer you're looking for? Browse other questions tagged or ask your own question.