Ads use GPT (Google Publisher Tag) to select and serve targeted ads. GPT is an ad tagging library for DFP (Doubleclick For Publishers) that can dynamically build ad requests. GPT takes key details (targeting parameters) such as ad unit name, ad size, and custom targeting, builds the request, and displays the ad on web pages.
When an advert is still loading or the app is offline, the ad component will show a placeholder image.
DFP is used by the commercial team to set up the campaigns. They use this to configure:
- Ad images of various sizes
- Type of ad (display, sponsored, etc)
- Date range of campaign
- Target number of impressions
- Loading pattern (more impression up front or even spread over time)
- Creatives per page (i.e. whether to repeat ads on page)
- Rotation weighting rules (e.g. optimise to place best performing ad more often)
- Frequency capping
Contact the internal commercial team for a list of targeting keys and their relative descriptions.
These are the parameters which are generic to the page such as the user cookie, page title etc. To list all current targeting keys in the console:
To see the value for a specific key:
These are the params which are specific to each slot on the page. We can have more than on the slot on the page.
Advert Brand Protection
This mechanism helps us to determine if a certain Ad should not be shown on a particular page (e.g. because it contains terror or hate speech related content).
Web - With ADmantx
We use ADmantx as a Times brand safety mechanism. We send a uri to ADmantx, which crawls the page and returns an object of key value pairs they associate with that web page. The object has the follow keys:
This object is then passed to the DFP code via page targeting, which determines whether to show ads or not.
For native we do not use ADmantx. Instead, we pass a string of comma-seperated keywords that typically come from TPA. These keywords are then passed to DFP using page targeting, and DFP determines whether to show the page from this "list".
We have distinct positions on a page where we can display Ads. We refer to them as ad slots with a unique identifiers so that we can request ads for those positions uniquely from DFP. Each ad slot allows for certain fixed ad sizes.
- Header - this is the slot on the top of the article page.
- Inline - this is the ad slot after the 5th paragraph of an article body
- Sponsored ads - TBD
- Pixel - TBD
- Pixelskin - TBD
- Pixelteads - TBD
Testing GPT and ADmantx
To test Ads in general, follow below steps:
- Goto page where you want to test, and open the console.
googletag.openConsole();on the console, this will open a DFP console on the page and will display all the info about the ads on the page.
- To look for all Ad slots on the page use
- On the network panel, filter for ads?, this is the ad request that gpt makes to DFP with all the relevant config.
- In the ads request, the config is sent as query params, the
cust_paramskey has the page level config values and
prev_scphas the slot level config values.
- On the network panel, filter for
euasync01.admantx.comto see the key values that we get from ADmantx.
This is an advanced programmatic technique, wherein publishers request for bids from some ad-exchanges simultaneously before actually making calls to their ad servers. The idea is that by letting multiple bidders bid for the same ad slot at the same time, publishers increase their yield and make more money. The returned bids are then passed to the ad server.
Prebid is a free open source library that helps publishers
implement header bidding. We load a prebid script which adds a
window object. The gpt request waits for prebid request to fulfill.
These are some of the bidders:
- Amazon - has a separate script that does the bidding for amazon.
Note: Test with local.thetimes.co.uk (some of the ads look for the domain from which the request is coming)
- Go to the page and open the console on the browser
pbjs.getBidResponses();on the console, this gets all the bids we have received for all the slots on the page
- For Appnexus, to check if it has sent out request for bidding, filter for adnxs in the network panel
- For Rubicon, to check if it has sent out request for bidding, filter for rubicon in the network panel
- For Criteo, to check if it has sent out request for bidding, filter for criteo in the network panel
- For Pubmatic, to check if it has sent out request for bidding, filter for pubmatic in the network panel
- For indexExchange, to check if it has sent out request for bidding, filter for casale in the network panel
- For Amazon, to check if it has sent out request for bidding, filter for
domain aax.amazon-adsystem in the network panel. On Console, do
apstag.debug('enable');and refresh page [This forces amazon ads to win]
googletag.pubads().getSlots().map(s=>s.getTargetingMap());in the console, the key
hb_bidderis the winner for the slot
Please read CONTRIBUTING.md before contributing to this package
Running the code
Please see our main README.md to get the project running locally
The code can be formatted and linted in accordance with the agreed standards.
yarn fmt yarn lint
Visit the official storybook to see our available ads templates.
Ads do not responsively resize at the moment, which is something we intend to rectify in the near future. Also, brand protection leaves a blank advert on the page at the moment, rather than a placeholder or nothing at all. We intend to improve on this feature soon.