Total Takeover (Image/Video)

A template for the Total Takeover format, that allows for the easy creation of a full-page takeover campaign. The Total Takeover combines a full-screen Wallpaper behind the publisher page with a Top Banner at the top of the article and one or more Mid Banners further down the page. The wallpaper stays in view as the user scrolls, and remains visible behind both the Top Banner and Mid Banner positions, so all three placements can be designed to feel like a single, connected campaign.

This is the standard image/video version of the format. You can use either an image or a video as the wallpaper background, and use the side-panel overlays to add logos, products, headlines and other branding that stays visible next to the publisher content column. The Top Banner and Mid Banner are then added as separate image, video or HTML5 banners on top of the wallpaper.

Guide to skins

The guide covers:

- The difference between our Seamless Skin & Fluid Skin formats
- The respective templates (i.e. Seamless Image Skin, Seamless Sliding Skin, Fluid Skin Image, Fluid Skin Video, etc.) within our Seamless & Fluid Skin formats
- Tips and best practice for using overlays

Recommended default creative dimensions

Wallpaper background

ONE of either:

  • Image: 2560x1440px (JPG, PNG or WEBP)
  • Video: 1920x1080px (MP4)

Wallpaper overlays
  • Main overlays - Max size of 800x1440px (PNG or WEBP with transparent background), one asset for each side of the wallpaper.
  • Top/Bottom overlays - additional optional overlay elements that will be top/bottom aligned within the overlay container. Max size of 800x500px (PNG or WEBP with transparent background).
  • For best results, export the overlay PNG assets without any excess empty space - the size and position of the overlay is configurable within the wallpaper settings.
Top Banner
  • Image, video or HTML5 banner that sits at the top of the page, centered above the publisher content column. Sizes vary by country (see list below).
  • Can use a fully opaque background to look like a traditional billboard banner, or a transparent / semi-transparent background so the wallpaper continues to show through behind it.
Mid Banner
  • Image, video or HTML5 banner that replaces matching publisher ad slots further down the page. The same Mid Banner creative may appear in more than one position on the same page.
  • Centered in the publisher content column. Width matches the content column, height is set per campaign and typically sits around 30% of the screen height (up to a maximum of around 60%).
  • Like the Top Banner, the Mid Banner sits on top of the wallpaper, so it can use a transparent background to let the wallpaper show through, or a fully opaque design with its own background.

Format description and guidance

The Total Takeover is best thought of as three connected layers that the user sees at the same time:

  • The Wallpaper - a full-screen background image or video, with side-panel overlays for branding. It sits behind the publisher page and stays in view as the user scrolls.
  • The Top Banner - the main banner at the top of the article. This is the most prominent placement and usually carries the headline, logo and call-to-action.
  • The Mid Banner - one or more in-article banners that appear further down the page, extending the campaign as the user keeps reading.

Because the wallpaper is visible behind both the Top Banner and Mid Banner, the three placements can be designed to feel like one continuous experience. For example, the wallpaper can carry a scenic background and side-panel branding, while the Top Banner and Mid Banner use transparent backgrounds to drop a logo, product shot or video on top of that same scene. Alternatively, the Top Banner and Mid Banner can use their own fully opaque designs, and the wallpaper acts as a frame around them.

The middle of the wallpaper sits behind the publisher article for most of the page, but is partially revealed each time a Mid Banner scrolls into view (Mid Banners can use transparent areas to expose the wallpaper behind them). The left and right side panels are the parts of the wallpaper that stay visible at all times - this is where you should place logos, products, taglines, CTAs and any other branding that must always be seen. The centre of the wallpaper can be used for additional artwork that ties in with the Mid Banners as they appear. The side panel overlays are designed to scale responsively across different screen sizes.

The wallpaper background image or video should be treated as scene-setting only - it provides colour, atmosphere and mood, but should not carry logos, headlines or CTAs of its own, as those elements may get covered up on narrower screens.

You can change the scaling mode of the wallpaper background to control how it behaves on different screen sizes:

  • cover - The asset is scaled to cover the entire screen, without leaving any empty space. May appear cropped at the edges on some screens.
  • contain - The asset is scaled to fit fully within the screen, without any cropping, possibly leaving empty space where a background colour will be visible.
  • none - The image is not scaled, and appears at 100% its original size.

Use the overlays on the wallpaper to add your static branding and messaging elements on top of the background. The overlays automatically scale to fit within the available side-panel space, and their position can be fine-tuned in the wallpaper settings.

The Top Banner and Mid Banner are each added as separate banners, with their own click URL and tracking. They can be supplied as image, video, HTML5 or third-party tag, and the same campaign can mix and match - for example, a video Top Banner with an image Mid Banner.

Top Banner sizes vary across publishers and between countries, so please read carefully to ensure your assets are produced correctly.

Billboard placement sizes by country:

  • ๐Ÿ‡ฆ๐Ÿ‡น AT: 1000x250px
  • ๐Ÿ‡จ๐Ÿ‡ญ CH: 1000x250px
  • ๐Ÿ‡ฉ๐Ÿ‡ช DE: 1000x250px
  • ๐Ÿ‡ฉ๐Ÿ‡ฐ DK: 930x180px
  • ๐Ÿ‡ซ๐Ÿ‡ฎ FI: 1000x400px
  • ๐Ÿ‡ซ๐Ÿ‡ท FR: 970x250px
  • ๐Ÿ‡ณ๐Ÿ‡ฑ NL: 970x250px
  • ๐Ÿ‡ณ๐Ÿ‡ด NO: 980x300px
  • ๐Ÿ‡ต๐Ÿ‡ฑ PL: 970x250px
  • ๐Ÿ‡ธ๐Ÿ‡ช SE: 1000x240px
  • ๐Ÿ‡ฌ๐Ÿ‡ง UK: 970x250px

Top Banner dimensions can also vary from publisher to publisher. Always confirm the exact sizes with the publishers on your plan before creating assets.

The Mid Banner sits inside the publisher content column, so its width matches the page content width on that publisher. Mid Banner heights are configurable per campaign, with a default of roughly 30% of the screen height and a maximum of around 60%. Design Mid Banner creative so it still looks good if the height is adjusted within that range.

Max total file weight

3.5MB.

Videos: Files up to 50 MB are accepted, with a recommended maximum length of 20 seconds.
Images: Maximum 200kb each.

For best performance, all assets should be compressed and optimised to the lowest possible file weight. We recommend using tinypng.com to compress PNGs.

Click tags and tracking

The Total Takeover format supports three separate clickURLs & trackers - one for the Wallpaper, one for the Top Banner and one for the Mid Banner. This means each placement can lead to its own landing page if needed.

Audio

Muted by default, user initiated.

Template Details

Seamless Image & Video Skin

Warning: Seamless Image & Video Skin is archived and no longer actively maintained. Recommended alternative: Seamless Image & Streaming Video Skin.

General
ParameterPurposeDefault
1.0 Click URLDestination URL triggered when the user interacts with this element. Include https:// and any tracking parameters.
1.1 Background AssetUpload the 1.1 background asset asset (JPG, PNG, or WEBP). Follow safe-zone guidance and stay within the platform file-size limits.
1.1.1 Background scaling modeSelect the 1.1.1 background scaling mode option from the list to control how the template behaves.cover | choices: cover, contain, none
2.0.1 Left panel overlayUpload the overlay asset (JPG, PNG, or WEBP). Overlays render with object-fit: contain, so they will not crop and do not require extra safe-zone padding.
2.0.2 Right panel overlayUpload the overlay asset (JPG, PNG, or WEBP). Overlays render with object-fit: contain, so they will not crop and do not require extra safe-zone padding.
2.1.0 Side Overlay Hover EffectSelect the 2.1.0 side overlay hover effect option from the list to control how the template behaves.scale | choices: disabled, glow, scale, glow & scale
2.1.1 Side Overlay WidthDefine the 2.1.1 side overlay width using responsive CSS units (px, %, vw, vh) so it scales across screens.80%
2.1.2 Side Overlay HeightDefine the 2.1.2 side overlay height using responsive CSS units (px, %, vw, vh) so it scales across screens.100%
2.1.3 Side Overlay Minimum WidthDefine the 2.1.3 side overlay minimum width using responsive CSS units (px, %, vw, vh) so it scales across screens.120px
2.1.4 Side Overlay Maximum WidthDefine the 2.1.4 side overlay maximum width using responsive CSS units (px, %, vw, vh) so it scales across screens.300px
2.1.5 Hide Overlays Below Minimum WidthDefine the 2.1.5 hide overlays below minimum width using responsive CSS units (px, %, vw, vh) so it scales across screens.False | choices: False, True
2.2 Side Overlay X PositionControls how the 2.2 side overlay x position aligns inside the frame. Pick the focal point that keeps the subject in view.center | choices: center, inside, outside
2.2.1 Horizonal Offset (optional)Sets the 2.2.1 horizonal offset (optional) value used in the creative. Supports plain text or CSS units where required.
2.3 Side Overlay Y PositionControls how the 2.3 side overlay y position aligns inside the frame. Pick the focal point that keeps the subject in view.center | choices: top, center, bottom
2.3.1 Vertical Offset (optional)Sets the 2.3.1 vertical offset (optional) value used in the creative. Supports plain text or CSS units where required.
3.1 Sticky Video SideSelect the 3.1 sticky video side option from the list to control how the template behaves.left | choices: left, right, both
3.2 Sticky Video PositionControls how the 3.2 sticky video position aligns inside the frame. Pick the focal point that keeps the subject in view.top | choices: top, middle, bottom
3.3 Sticky Video Vertical OffsetSets the 3.3 sticky video vertical offset value used in the creative. Supports plain text or CSS units where required.0

Seamless Image & Streaming Video Skin

General
ParameterPurpose
Click URLDestination URL triggered when the user interacts with this element. Include https:// and any tracking parameters.
Background
ParameterPurposeDefault
Background (Image)Image asset used as the background. Add only an image or a video, not both.
Background (Video)Streaming video asset used as the background. Add only an image or a video, not both.
Scaling ModeSets the scaling behaviour of the background asset. Cover leaves no empty space but can result in cropping. Contain prevents cropping but can leave empty space.cover | choices: cover, contain, none
Background Anchor PointSets where the background image or video anchors when scaling.top-center | choices: top-left, top-center, top-right, mid-left, mid-center, mid-right, bot-left, bot-center, bot-right
Max Video Stream WeightSets the maximum allowed video stream weight used when selecting available encodes.2.5mb | choices: 3.5mb, 3.0mb, 2.5mb, 2.0mb, 1.5mb, 1.0mb
Background ColourColour displayed wherever the background asset does not cover the canvas.#000000
Left Overlays
ParameterPurposeDefault
Main OverlayMain overlay asset, will use as much space as is available within the overlay container.
Top Overlay (optional)Top-aligned overlay, anchored to the top of the overlay container.
Top Overlay HeightSets the height of the top overlay relative to the overlay container.15%
Bottom Overlay (optional)Bottom-aligned overlay, anchored to the bottom of the overlay container.
Bottom Overlay HeightSets the height of the bottom overlay relative to the overlay container.10%
Right Overlays
ParameterPurposeDefault
Main OverlayMain overlay asset, will use as much space as is available within the overlay container.
Top Overlay (optional)Top-aligned overlay, anchored to the top of the overlay container.
Top Overlay HeightSets the height of the top overlay relative to the overlay container.15%
Bottom Overlay (optional)Bottom-aligned overlay, anchored to the bottom of the overlay container.
Bottom Overlay HeightSets the height of the bottom overlay relative to the overlay container.10%
Overlay Config
ParameterPurposeDefaultNotes
Overlay Container WidthThe overlay container defines the area in which the overlays are contained, this sets the width of that container as a percentage of the side panel width.80%Required
Overlay Container HeightThe overlay container defines the area in which the overlays are contained, this sets the height of that container as a percentage of the total skin height.90%Required
Overlay Container GapThe gap allows you to set a minimum space between overlays.1vh
Overlay Container Minimum WidthSets a minimum width for the overlay container, preventing the overlays from becoming too small on narrow screens.120px
Overlay Container Maximum WidthSets a maximum width for the overlay container, preventing the overlays from becoming too large on big screens.300px
Hide Overlays Below Minimum WidthWhen enabled, if the overlay container width is reduced to below the minimum width, the overlays will be hidden.False | choices: False, True
Hover EffectSets the hover effect when the user hovers over the skin side panel.scale | choices: disabled, glow, scale, glow & scale
Overlay Container Horizontal AlignmentSets the horizontal alignment of the overlay container, and all the overlays within it.center | choices: center, inside, outside
Overlay Container Horizontal Offset (optional)Sets a horizontal offset for the overlays away from the aligned edge.
Overlay Container Vertical AlignmentSets the vertical alignment of the overlay container, and all the overlays within it.center | choices: top, center, bottom
Overlay Container Vertical Offset (optional)Sets a vertical offset for the overlays away from the aligned edge.
Top Overlay - Time In (optional)Video time (seconds) at which the top overlay appears. Only works with background video.
Top Overlay - Time Out (optional)Video time (seconds) at which the top overlay hides. Only works with background video.
Main Overlay - Time In (optional)Video time (seconds) at which the main overlay appears. Only works with background video.
Main Overlay - Time Out (optional)Video time (seconds) at which the main overlay hides. Only works with background video.
Bottom Overlay - Time In (optional)Video time (seconds) at which the bottom overlay appears. Only works with background video.
Bottom Overlay - Time Out (optional)Video time (seconds) at which the bottom overlay hides. Only works with background video.
Sticky Video Player
ParameterPurposeDefault
Video SideSets which side panels display the sticky video player, or disables it.left | choices: left, right, both, disabled
Video TransitionSets the transition animation used when the sticky video player appears.Slide In | choices: Disabled, Slide In
PositionSets the vertical position of the sticky video player within the side panel.top | choices: top, middle, bottom
Max HeightSets the maximum height of the sticky video player.Match Top Banner Height | choices: Match Top Banner Height, 200px, 250px, 300px, 350px, 400px
Vertical OffsetSets an additional vertical offset in pixels from the chosen position.0

Skin Video Top Banner

Warning: Skin Video Top Banner is archived and no longer actively maintained. Recommended alternative: Seamless Image & Streaming Video Skin.

General
ParameterPurposeDefault
1.0 Click URLDestination URL triggered when the user interacts with this element. Include https:// and any tracking parameters.
1.1 Background Image (optional)Upload the 1.1 background image (optional) asset (JPG, PNG, or WEBP). Follow safe-zone guidance and stay within the platform file-size limits.
2.0 VideoProvide the 2.0 video video in MP4 or WEBM format, encoded for autoplay and kept under the maximum weight.
2.1 Video PositionControls how the 2.1 video position aligns inside the frame. Pick the focal point that keeps the subject in view.Left | choices: Left, Center, Right
2.2 Video ControlsSelect the 2.2 video controls option from the list to control how the template behaves.Enabled | choices: Disabled, Enabled
2.3 Progressbar ColourHex colour (#RRGGBB or #RRGGBBAA) applied to this element. Use it to match brand palettes and overlay blends.#ff0000
2.4 Video PaddingSets the 2.4 video padding value used in the creative. Supports plain text or CSS units where required.0
3.0 OverlayUpload the overlay asset (JPG, PNG, or WEBP). Overlays render with object-fit: contain, so they will not crop and do not require extra safe-zone padding.
3.1 Overlay 2 (only if video position is center)Controls how the 3.1 overlay 2 (only if video position is center) aligns inside the frame. Pick the focal point that keeps the subject in view.
3.2 Overlay PaddingSets the 3.2 overlay padding value used in the creative. Supports plain text or CSS units where required.10vh

Image

General
ParameterPurposeNotes
Click UrlDestination URL triggered when the user interacts with this element. Include https:// and any tracking parameters.
ImageUpload the image asset (JPG, PNG, or WEBP). Follow safe-zone guidance and stay within the platform file-size limits.Required
Image Settings
ParameterPurposeDefault
Scaling ModeSets the scaling behaviour of the image, determining whether it will appear cropped or not.cover | choices: cover, contain, fit to width, fit to height, original size
Image Anchor PointControls how the image anchor point aligns inside the frame. Pick the focal point that keeps the subject in view.mid-center | choices: top-left, top-center, top-right, mid-left, mid-center, mid-right, bot-left, bot-center, bot-right
Background ColourDependant on the scaling mode, this colour will be visible in the behind the if there is any empty space.#00000000
Overlay 1
ParameterPurposeDefault
AssetUpload the overlay asset (JPG, PNG, or WEBP). Overlays render with object-fit: contain, so they will not crop and do not require extra safe-zone padding.
WidthWidth of the overlay, use a responsive unit such as 'vw', 'vh', or '%' to ensure it scales with the banner. To derrive the width from the height, use 'auto'.auto
HeightHeight of the overlay, use a responsive unit such as 'vw', 'vh', or '%' to ensure it scales with the banner. To derrive the height from the width, use 'auto'.10%
PositionPosition of the overlay, relative to the banner. For left & right positions, the horizontal offset can be modify to set the distance from the respective edge. Likewise for top & bottom positions, the vertical offset will be used.top-center | choices: top-left, top-center, top-right, mid-left, mid-center, mid-right, bot-left, bot-center, bot-right
Overlay 2
ParameterPurposeDefault
AssetUpload the overlay asset (JPG, PNG, or WEBP). Overlays render with object-fit: contain, so they will not crop and do not require extra safe-zone padding.
WidthWidth of the overlay, use a responsive unit such as 'vw', 'vh', or '%' to ensure it scales with the banner. To derrive the width from the height, use 'auto'.auto
HeightHeight of the overlay, use a responsive unit such as 'vw', 'vh', or '%' to ensure it scales with the banner. To derrive the height from the width, use 'auto'.10vh
PositionPosition of the overlay, relative to the banner. For left & right positions, the horizontal offset can be modify to set the distance from the respective edge. Likewise for top & bottom positions, the vertical offset will be used.bot-center | choices: top-left, top-center, top-right, mid-left, mid-center, mid-right, bot-left, bot-center, bot-right
Text Overlay
ParameterPurposeDefault
TextCopy displayed in the creative for this field. Keep it concise for readability on smaller screens.
Font SizeDefine the font size using responsive CSS units (px, %, vw, vh) so it scales across screens.1vw
PositionPosition of the overlay, relative to the banner. For left & right positions, the horizontal offset can be modify to set the distance from the respective edge. Likewise for top & bottom positions, the vertical offset will be used.bot-center | choices: top-left, top-center, top-right, mid-left, mid-center, mid-right, bot-left, bot-center, bot-right
Text ColourHex colour (#RRGGBB or #RRGGBBAA) applied to this element. Use it to match brand palettes and overlay blends.#ffffff
FontSelect the font option from the list to control how the template behaves.sans-serif | choices: sans-serif, serif, monospace, impact
Overlay Config
ParameterPurposeDefault
Vertical OffsetFor top & bottom positioned overlays, the vertical offset will be used how far away from the top/bottom edges of the banner the asset will appear.12vh
Horizontal OffsetFor left & right positioned overlays, the horizontal offset will be used how far away from the left/right edges of the banner the asset will appear.5vh

Video Streaming

General
ParameterPurpose
Click URLDestination URL triggered when the user interacts with this element. Include https:// and any tracking parameters.
Video AssetProvide the video asset video in MP4 or WEBM format, encoded for autoplay and kept under the maximum weight.
Video Settings
ParameterPurposeDefault
Max Video Stream WeightSets the maximum allowed video stream weight used when selecting available encodes.3.5mb | choices: 3.5mb, 3.0mb, 2.5mb, 2.0mb, 1.5mb, 1.0mb
Scaling ModeSets the scaling behaviour of the video. Letterbox and Pillarbox add space. Cover may crop. Contain avoids cropping. Original Size keeps intrinsic dimensions.Letterbox | choices: Letterbox, Pillarbox, Cover, Contain, Original Size
Video PositionAnchor Point used to position the video within the banner.mid-center | choices: top-left, top-center, top-right, mid-left, mid-center, mid-right, bot-left, bot-center, bot-right
AudioEnables or disables video audio.Enabled | choices: Enabled, Disabled
Audio Button PositionSets the position of the audio control button.top-right | choices: top-left, top-right, bot-left, bot-right
Background Settings
ParameterPurposeDefault
Background TypeSelects how the background behind the video is generated (auto extraction, custom image, colour fill or blurred video).Auto Background | choices: Auto Background, Custom Image, Custom Colour, Blurred Video
Background ImageImage used when Background Type is set to Custom Image.
Background ColourColour used when Background Type is set to Custom Colour or to fill letterboxed areas.#FFFFFF
Endframe (optional)
ParameterPurposeDefault
Endframe ImageImage displayed for the endframe when enabled.
Endframe SettingsSelects when the endframe appears relative to the video (before, after, both or disabled).Disabled | choices: After Video, Before Video, Before and After video, Disabled
Endframe Display OrderSets layering order: show endframe above overlays or overlays above endframe.Endframe on top of overlays | choices: Endframe on top of overlays, Overlays on top of endframe
Overlay 1 (optional)
ParameterPurposeDefault
AssetImage asset for overlay 1.
WidthWidth of the overlay. Use responsive units (vw, vh, %) or 'auto'.auto
HeightHeight of the overlay. Use responsive units (vw, vh, %) or 'auto'.10vh
PositionPosition of the overlay relative to the banner.top-center | choices: top-left, top-center, top-right, mid-left, mid-center, mid-right, bot-left, bot-center, bot-right
Time - In (optional)Video time (seconds) at which the overlay appears.
Time - Out (optional)Video time (seconds) at which the overlay hides.
Overlay 2 (optional)
ParameterPurposeDefault
AssetImage asset for overlay 2.
WidthWidth of the overlay. Use responsive units (vw, vh, %) or 'auto'.auto
HeightHeight of the overlay. Use responsive units (vw, vh, %) or 'auto'.10vh
PositionPosition of the overlay relative to the banner.bot-center | choices: top-left, top-center, top-right, mid-left, mid-center, mid-right, bot-left, bot-center, bot-right
Time - In (optional)Video time (seconds) at which the overlay appears.
Time - Out (optional)Video time (seconds) at which the overlay hides.
Text Overlay (optional)
ParameterPurposeDefault
TextText content displayed as overlay.
Font SizeFont size of the text overlay (supports responsive units).1vw
PositionPosition of the overlay relative to the banner.bot-center | choices: top-left, top-center, top-right, mid-left, mid-center, mid-right, bot-left, bot-center, bot-right
Text ColourColour of the text overlay.#ffffff
FontFont family used for the text overlay.sans-serif | choices: sans-serif, serif, monospace, impact
Time - In (optional)Video time (seconds) at which the overlay appears.
Time - Out (optional)Video time (seconds) at which the overlay hides.
Overlay Config
ParameterPurposeDefault
Vertical OffsetVertical distance from the top or bottom edges for overlays positioned top or bottom.12vh
Horizontal OffsetHorizontal distance from the left or right edges for overlays positioned left or right.6vh