All ad units supported by Display.io Mobile Web Tag for direct integration are avaialble for Prebid.js/GAM integration as well:
- Interscroller Ad Unit
- Ad Formats: Display Interstitial size (320×480), Vertical Outstream Video (360X640)
- Modes: Reveal / Non-Reveal
- Headline Ad unit
- Ad Formats: Display Mrect size (300×250), Horizontal Outstream Video (360X640)
- Modes: Snap / In-feed only (without headline mode)
- Infeed Ad unit
- Ad Formats: Display Mrect size (320×50), Horizontal Outstream Video (360X640)
- Modes: In-feed only
- Banner Ad unit
- Ad Formats: Display Mrect size (320×50)
- Modes: In-feed / Always shown
All the detailed information about the tag UX customization is available here.
Prebid.js
To set up Header Bidding integration via Prebid.js you need to:
- Add Displayio Bidder Adapter to your Prebid.js library
Select Displayio Bidder Adapter (link) to the list of selected adapters to download a ready to use Prebid.js script for your mobile web Header Bidding (detailed instructions are available on prebid.org). - Configure Displayio Bidder Adapter
Displayio Bidder Adapter tech documenattion is vailable by the link.
A typical Prebid.js ad unit configuration looks like the following (sizes and customizations (custom param) relevant for Interscroller ad unit):
var adUnits = [ { code: 'test-example', mediaTypes: { banner: { sizes: [[320, 480]] }, video: { sizes: [[360, 640]] }, }, bids: [ { bidder: 'displayio', params: { siteId: {site_id}, placementId: {placement_id}, adsSrvDomain: 'appsrv.display.io', cdnDomain: 'cdn.display.io', renderURL: 'https://cdn.display.io/webis/webis-prebid.min.js', pageCategory: 'pageCategory1, pageCategory2', //comma separated keywords: 'keyword1, keyword2, keyword3', //comma separated custom: { headerText: 'ADVERTISEMENT', headerTextColor: '#2196f3', headerBackgroundColor: 'black', adContainerBackgroundColor: 'transparent', fixedHeaderSelector: '.site-header', }, } } ] } ];
where:
- {placement_id} and {placement_id} should be replaced with your Inventory ID (site and placement IDs) on display.io Platform
- mediaTypes and sizes should be set up according to the selected ad units:
– Interscroller: banner: 320×480, video: 360×640;
– Infeed: banner: 300×250, video: 640×360;
– Headline: banner: 300×250, video: 640×360;
– Banner: banner: 320×50. - UX (custom, etc.) & Data (keywords, pageCategory, etc.) customization should be applied according to the specification, provided for display.io Ad Tag direct integration.
As an alternative option you can manually add prebid.js code to the header of you page, inc. Displayio adapter code, how it’s listed in the example above.
Prebid.js/GAM
Displayio Prebid Adapter can be configured along with Google Ad manager as an ad server. A typical configuration should be similar to what is described in the official Prebid.js documentation.