This one is for web developers. If you aren’t comfortable with code, just skip this post. You’re not missing anything.
As before, in Create An Ad Unit Test Page, you’re trying to isolate a rogue ad. Maybe it is not loading properly, maybe it is loading way too many resources, maybe it is crashing the page. Maybe you’re just interested in understanding exactly what it’s doing.
In any of these cases, you want to study the ad’s behavior without interfere.
The problem, however, is that the ad won’t load using Creative Preview. Most likely, the advertiser is using domain detection to ensure the correct URL is present in the referrer. Advertisers do this for two primary reasons: to be sure they’re running on the right website, and to be sure they haven’t been iframed.
So what can you do?
You need to install a web server locally on your computer
(more instructions coming soon)
Now, edit your /etc/hosts file (or c:\Windows\System32\Drivers\etc\hosts on Windows)
You’ll see something like this (this is from my Mac, so you might get something slightly different):
## # Host Database # # localhost is used to configure the loopback interface # when the system is booting. Do not change this entry. ## 127.0.0.1 localhost 255.255.255.255 broadcasthost ::1 localhost fe80::1%lo0 localhost
You just need to add one line.
By doing this, you’re overriding the normal DNS lookup process and explicitly telling your computer that the IP address of example.com is 127.0.0.1 (your computer). Obviously, don’t type example.com, but the name of your website here.
## # Host Database # # localhost is used to configure the loopback interface # when the system is booting. Do not change this entry. ## 127.0.0.1 localhost 255.255.255.255 broadcasthost ::1 localhost fe80::1%lo0 localhost 127.0.0.1 example.com
Save and exit. You may need to restart your browser or even restart your networking for this change to take effect.
Step 3 (profit)
Now navigate to http://example.com. You should get a blank page.
Head back over to your web server and create a blank HTML page containing nothing but the target creative:
<html> <head></head> <body> <!-- PASTE THE CREATIVE HERE --> </body> </html>
Save this file as index.html. Reload your browser, and you should see the ad.
Remember to undo the /etc/hosts when you’re done. You will be very confused in the future if you forget to do this.
Why is this awesome?
The really cool thing about this is that you don’t need access to a website’s source code to debug the ads. Instead, you can setup an artificial environment and apply any special targeting in a completely repeatable way. This technique works for any website. Just create a new entry in /etc/hosts and setup a corresponding site in your web server.
What could go wrong?
Web server configuration errors
Sorry! Can’t help you here. There are loads of tutorials, but setting up a web server can be tricky. We will try to put up better instructions on this soon.
Watch out for www
example.com and www.example.com are totally different websites as far as your browser is concerned. So if things don’t appear to be working, make sure you’ve got the right one (or just do both)
The creative loads, but it’s still blank
Certain creatives, especially native ads that insert themselves into the middle of a post will be tricky to test in this kind of setup. Those ads are looking for particular patterns in the HTML. For example, you might have a video ad that appears after the 5th paragraph on article pages. If you’re testing on a blank page, and there aren’t 5 paragraphs, this isn’t gonna work because the CSS Selector will fail to match.