How to check if Adsense unit is filled

Here's a solution

[csdude55]

I discovered a nifty little trick to see if the Adsense unit actually has an ad! I just saw the attribute tonight for the first time, so I can't swear if this works in every case.

It looks like Adsense adds a data-ad-status attribute to the INS tag that has a value of either "filled" or "unfilled". So I'm using this:

<div id="ad_unit">
<ins whatever></ins>

<script>
var i, m;

var interval = setInterval(() => {
 if (document.readyState === 'complete') {
  clearInterval(interval);

  // make sure the unit exists and isn't hidden
  if (i = document.getElementById('ad_unit') &&
    i.style.display !== 'none' &&
    i.clientWidth > 0) {

   // look at all of the nodes in <div id="ad_unit">...</div>
   for (m in i.childNodes)
    if (
     // look at the INS tag
     i.childNodes[m].nodeName == 'INS' &&

     // data-adsbygoogle-status is inserted, too. I've only ever seen it say
     // "done", but there might be value in double checking it
     i.childNodes[m].dataset.adsbygoogleStatus === 'done' &&

     // now look for the data-ad-status attribute
     (adStatus = i.childNodes[m].dataset.adStatus)
    )
     break;

   // now let's see if the ad is filled
   // if the height is less than 50 or if data-ad-status is 'unfilled', it's empty
   if (i.clientHeight < 50 || adStatus === 'unfilled')
    // do whatever
  }
 }
}, 500);

</script>

[rafraf]

Yes this is in their documentation, and documentations are meant to be read, lol. [support.google.com...]

[csdude55]

Are you saying, RTFM? Oh, the pain! LOL But how would you know to look for it if you didn't already know?

I would have had to build the above anyway, though, since my "do whatever" is an Ajax script that shows direct-sell ads and counts impressions. But if you're just showing a simple image then the docs have an easier option :-)

[csdude55]

Similar but different, it looks like anchor units have these attributes:

<ins id="foo" data-google-query-id="bar"
 data-anchor-status="displayed"
 data-anchor-shown="true"></ins>

And I don't see that in the docs! Ha! :-D

I haven't tested this one yet, but I suspect that means you could show an alternative when it's not filled using something like:

<style>
#homemadeAnchor {
 display: none;
 position: fixed;
 bottom: 0;
}
</style>

<script>
var interval = setInterval(() => {
 if (document.readyState === 'complete') {
  clearInterval(interval);

  if (!document.querySelector('ins[data-anchor-shown="true"]'))
   document.getElementById('homemadeAnchor').style.display = 'block';
 }
}, 500);

<div id="homemadeAnchor"></div>

[Peter_S]

Thank you @csdude55 for sharing this. Very interesting !

[gatormark]

Simple, just put this in your CSS

ins.adsbygoogle[data-ad-status="unfilled"] {
display: none !important;
}

[gatormark]

@rafraf

LOL