Allow ad-block plugins to block an entire div for visitors, so that the website doesn't look half-complete?

Question

This sounds counter-productive, but it's not: I have a div element which only contains the ad - this basically just gives the ad some padding and surrounds it with a nice border/box.

I know a certain percentage of my potential users will use adblock, so when they will visit the site, they'll see the main content and a weird elongated div below it with seemingly no purpose. Are there any keywords which such ad blockers look for in divs, which I could use to ensure that if ads are blocked, the entire div is invisible?

If not, perhaps there's a way to display a message to let ad blockers know what the div is usually for? I'm avoiding this because it seems a little passive aggressive and if users want to block ads, they should have just as good an experience as the majority of users.

Thanks for any help or advice.

Answer 1

You can use JS to test the height of the ad container. If it is collapsed (as you'd expect if there is no ad in it), then you may hide it.

So use Developer tools to see the height of the container with ad, and height without ad. In the JS, if the height is the same as "without ad" then you know the ad blocker is active.

How to block Adblock has some more information on this. You may not be trying to block it, but the idea is the same.