Pop Under Code 2020

Updated September 2020

This pop under code is used for running pop under traffic on your own site. It adds an onclick function to every link on the page which opens a new tab with the clicked link and changes the existing window (underneath) to a popped ad URL.

Opening links in new tabs isn’t going away so it’s fairly safe to use in a production environment with minimal risk of browser manufacturers blocking it.

Make sure you change the var puURL from https://google.com to whatever you want to pop.

The number 3600 in the code is number of seconds to wait between the first pop and doing another one.

I tested it on desktop and mobile devices and it works on Chrome, Firefox, Edge & Safari.

If the original link includes a “_blank” field to open in a new tab then two additional tabs will be opened. One for the new link and one for the original url, the pop under will still load in the original window.

It’s coded in vanilla Javascript so can be used anywhere without dependencies.

Demo Here: http://jamesbachini.com/misc/pudemo.html

You can view the code at: http://jamesbachini.com/misc/pu.js

window.onload = function() {
  var puURL = 'http://google.com';
  var puTS = Math.round(+new Date()/1000);
  console.log('T.'+localStorage.puTS+'/'+puTS);
  if (typeof localStorage.puTS == 'undefined' || parseInt(localStorage.puTS) <= (puTS - 3600)) {
    var links = document.getElementsByTagName('a');
    for(var i = 0, len = links.length; i < len; i++) {
      links[i].onclick = function (e) {
        var puHref = this.getAttribute("href");
          var puTarget = this.getAttribute("target");
          if (puHref !== '#' && puHref !== 'javascript:void(0)') {
          e.preventDefault();    
          if (puTarget == '_blank') {
            window.open(window.location.href);
          }
          window.open(puHref);
          window.location.href = puURL;
          localStorage.puTS = puTS;
        }
      }
    }
  }
};

Instructions

1. Copy code to a text editor and save as yourfile.js
2. Edit the var puURL on the second line to make it your affiliate link or any other link
3. Upload the file to your web server or host
4. Add the following to the head of your template file or if using a CMS google how to include external Javascript files

   <script type="text/javascript" src="//yoursite.com/yourfile.js"></script>

5. Click any link somewhere on the page. The puURL will open in the current tab and the link will open in a new tab on top creating a pop under effect.
6. Test all links, menus etc. before deploying.

History of Pop Under Code

Pop under ads were a development of the pop over ad which was first seen on the Tripod hosting site in the 1990’s.

Over the years this form of advertising was abused with torrent and streaming sites often poping up multiple ads whenever a visitor opened their site.

To prevent the ads from being closed before the page had loaded (and affiliate cookie had been tracked) some sites started using pop under code like this:

window.open( URL, windowName[, windowFeatures] ); 
window.focus(); // move new window behind parent window

This was an effective form of advertising with pop unders generating around 10x the revenues of banner ads.

Browsers reacted by blocking pop ups in the early 2000’s. Opera was the first browser to block pop ups and pop unders. Firefox, Safari and eventually Internet Explorer followed suit by 2004.

However there were loop holes. Publishers could circumvent pop under blocking techniques well into the 2010’s. Eventually these got closed off and click event pops became the norm. This meant that a pop would only launch after a click on the page.

Some sites would put a full frame invisible div over the site and use this to capture a click anywhere on the page which would launch a pop under.

Now in the 2020’s pop unders come in two forms. Code similar to the above which launches a pop under on a page interaction. Or like we see on a lot of email capture forms for blogs, a pop over on page type content where a div element can be placed over existing content on the page giving the impression of a pop up.

The following CSS can create this type of effect

.full-page {
  position: fixed;
  top: 3%;
  bottom: 3%;
  left: 3%;
  right: 3%;
  background: rgba(255,255,255,0.8);
}

A floating div can then be added to the page with the class “full-page” at any time with javascript.

Pop over and pop under advertising is intrusive and has a bad reputation. However its a powerful form of digital advertising because of the ability to bypass a click and go straight from publisher > landing page. Love them or hate them, pop under code will still be about in 10 years in one form or another.

Mobile pop unders have become big business for some ad networks and there’s now more volume on mobile than desktop.