YieldFest 2024 – Panel Discussion: Tackling Challenges and Seizing Opportunities in the Future of Digital Advertising
As year was coming to an end, it’s clear that the digital advertising industry has experienced a year of rapid…
Troubleshooting Ad implementation is one of the most important skills of an Ad Operations Manager. Depending on the level of expertise, the issue at hand, and knowledge of the domain, there will be different approaches to troubleshooting a certain problem; but always involving checking on-page integration and confirming findings using reports.
It is worth mentioning that the backgrounds of Ad Operation specialists may be quite different not only because of their scope of work in different organizations but also because of their hands-on nature. In general, an Ad Operations specialist – or simply AdOps – understands the twists and turns of the AdTech ecosystem and knows how to explain the Ad Operation in all its details.
To provide high-level technical support, AdOps experts traffic, configure, manage and optimize online advertising campaigns using Google Ad Manager or different ad server tools. A vital part of the AdOps job also involves proactively identifying setup issues and suggesting solutions – so-called troubleshooting.
Troubleshooting Ad Implementation – where to start when you detect an issue in ad setup?
Troubleshooting Ad implementation is quite a complex topic; so in order to keep things simple, we will start our series with the most basic on-page integration troubleshooting tips using Chrome’s browser developer tools (keep in mind that functionalities in other browsers might differ). Examples are based on Chrome version 94.0.4606.71. You can use other browsers as well, but keep in mind that not all features described below might be available.
1. Open Chrome browser developer console
Here is a handy shortcut to open the browser developer console:
- Command+Option+J (Mac)
- Control+Shift+J (Windows, Linux, Chrome OS)
If that is not enough you can look at other options here.
2. Filter requests – identify key ad-related requests
Each of the ad systems you have plugged in will send requests to their servers. You can find those ad-related requests by reproducing the steps below:
- Navigate to the page
- Open browser developer console
- Click Network tab
- Reload the page to log network activity
By default, you will see a list of all requests made by page, and not only related to ads. In the filter field, you can search keywords that are related to the searched request. For example, if you use Google Ad Manager, search for the Google Ad Manager library (Google Publisher Tag – GPT) and its API you can look for gpt.js and pubads_impl keywords.
A less well-known feature of a filter box is the use of regular expression syntax in order to search for an item. In our simple scenario, we combine multiple keywords by wrapping them with slash symbols.
We then separate them with the pipe symbol like so:
Pattern: /<keyword_1>|<keyword_2>|<keyword..n>/
Example (GPT, GPT API, GPT ad unit ad requests): /gpt.js|pubads_impl|gampad/
We won’t focus on keyword values, because they depend on the ad stack you use, so you have to work off your own list of ad tech providers. Once you get the list you can check their timing, initiators, dependencies by investigating the waterfall, the initiators section and finally the request itself (by clicking on it).
You can highlight requests with colours simply by way of shift + hover mouse over request:
- initiators (green)
- dependencies (red)
3. Search all objects
Sometimes it is quite difficult to find the ad server implementation by way of a simple search, especially if you do not know the website that much. In that case, you can open up a Search tab in the Drawer (The Drawer contains many hidden features) by:
- Command+Option+F (Mac)
- Control+Shift+F (Windows, Linux, Chrome OS)
Now you can search for text across all loaded resources. You can use regular expressions here as well. Just click on the search result. You will be navigated to the occurrence of the text.
4. Snippets
Snippets are a handy tool that will save you a lot of time, especially if you run the same scripts repeatedly in your JavaScript console. To open the Snippets section, you have to navigate to the Sources tab and select Snippets.
To create a snippet, just click New snippet and add a meaningful name. In the bottom right corner, you will find an icon Run snippet, and you can also run it using:
- Command+Enter (Mac).
- Control+Enter (Windows, Linux, Chrome OS)
Another option is to run open a command menu using the shortcut:
- Command+O (Mac).
- Control+O (Windows, Linux, Chrome OS)
And type ! which will list all of your snippets. You can start typing or selecting a snippet from the list and hit enter.
To sum up, we have presented a couple of handy features of the browser developer tools available to everyone. They are simple and yet effective, and they are the best way to begin troubleshooting procedures. But of course, there are more tips to come, featuring file overrides, request blocking, and more. Remember to subscribe to our newsletter so you will never miss a valuable piece of AdOps content!
