Responsive Advertising

There’s been a lot written about the problem of advertising on responsive devices. Quite a bit less has been written about potential solutions. Virtually nothing has been written about solutions that take into account the way things currently are.

Thing is, I need that solution. So, I’m defining my problem here as a way of thinking through it. If I figure out a non-compromising solution, I’ll post it later.


  • Advertising cannot simply be “display:none” on smaller screens since that will count as an impression, and for CPM we don’t want to bill people for times their ads weren’t actually displayed.
  • Advertising code sucks, it comes in iframes, and javascript, and flash, and does it’s very best to be it’s own entity on your page without any regard for anything.
  • Responsive design uses media queries to resize the page, but media queries can’t turn on and off advertising (see the display:none thing). We’re also going to ignore UA sniffing server side because that defeats the purpose of responsive.

Because of all this, my basic approach will mimic what I picked up from this article: In essence, we set break-points in javascript that correspond with ad locations being turned on and off. Then, on page load, the javascript will put ads in the locations where ads are visible.

Additional difficulties

  • I have one theme being used for several sites, each of which have different advertising tracking/placement codes. Those codes need to be set in the WordPress administration panels somewhere
  • Codes differ for mobile and non-mobile ads.
  • Ads are being served from two sources (not just one ad network), so the embed code varies in structure.

Leave a comment

Your email address will not be published. Required fields are marked *