A template for the Total Takeover format on mobile, that allows for the easy creation of a full-screen takeover campaign. The mobile Total Takeover combines a portrait 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. 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 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: 1080x1920px (JPG, PNG or WEBP)
- Video: 1080x1920px (MP4)
Top Banner
- Image, video or HTML5 banner that sits at the top of the page, centered above the publisher content column. Sizes vary by publisher (typical mobile billboard sizes are 320x320, 320x250 or 320x480).
- For square video Top Banners, supply a 320x320px MP4 (1:1 ratio) of around 2MB.
- Can use a fully opaque background to look like a traditional mobile billboard, or a transparent / semi-transparent background so the wallpaper continues to show through behind it.
- Optional overlay (for Video Top Banner with overlays): PNG or WEBP with transparent background, recommended size 360x500px.
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.
- Optional overlay (for Image / Video Mid Banner with overlays): PNG or WEBP with transparent background, recommended size 720x500px.
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 portrait background image or video. 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, 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.
On mobile, 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). Because the visible portion of the wallpaper changes as the user scrolls, key branding should be kept near the top of the wallpaper (visible behind the Top Banner) and aligned with where Mid Banners appear, rather than in areas that will be permanently covered by article content.
The wallpaper background image or video should be treated as scene-setting only - it provides colour, atmosphere and mood, but should not carry critical logos, headlines or CTAs of its own, as those elements may get covered up by the publisher content column.
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.
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 and Mid Banner sizes vary across publishers, so always confirm the exact sizes with the publishers on your plan before creating assets.
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
Image
General
| Parameter | Purpose | Notes |
|---|---|---|
| Click Url | Destination URL triggered when the user interacts with this element. Include https:// and any tracking parameters. | |
| Image | Upload the image asset (JPG, PNG, or WEBP). Follow safe-zone guidance and stay within the platform file-size limits. | Required |
Image Settings
| Parameter | Purpose | Default |
|---|---|---|
| Scaling Mode | Sets 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 Point | Controls 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 Colour | Dependant on the scaling mode, this colour will be visible in the behind the if there is any empty space. | #00000000 |
Overlay 1
| Parameter | Purpose | Default |
|---|---|---|
| Asset | Upload 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. | |
| Width | Width 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 |
| Height | Height 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% |
| Position | Position 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
| Parameter | Purpose | Default |
|---|---|---|
| Asset | Upload 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. | |
| Width | Width 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 |
| Height | Height 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 |
| Position | Position 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
| Parameter | Purpose | Default |
|---|---|---|
| Text | Copy displayed in the creative for this field. Keep it concise for readability on smaller screens. | |
| Font Size | Define the font size using responsive CSS units (px, %, vw, vh) so it scales across screens. | 1vw |
| Position | Position 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 Colour | Hex colour (#RRGGBB or #RRGGBBAA) applied to this element. Use it to match brand palettes and overlay blends. | #ffffff |
| Font | Select the font option from the list to control how the template behaves. | sans-serif | choices: sans-serif, serif, monospace, impact |
Overlay Config
| Parameter | Purpose | Default |
|---|---|---|
| Vertical Offset | For 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 Offset | For 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
| Parameter | Purpose |
|---|---|
| Click URL | Destination URL triggered when the user interacts with this element. Include https:// and any tracking parameters. |
| Video Asset | Provide the video asset video in MP4 or WEBM format, encoded for autoplay and kept under the maximum weight. |
Video Settings
| Parameter | Purpose | Default |
|---|---|---|
| Max Video Stream Weight | Sets 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 Mode | Sets 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 Position | Anchor 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 |
| Audio | Enables or disables video audio. | Enabled | choices: Enabled, Disabled |
| Audio Button Position | Sets the position of the audio control button. | top-right | choices: top-left, top-right, bot-left, bot-right |
Background Settings
| Parameter | Purpose | Default |
|---|---|---|
| Background Type | Selects 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 Image | Image used when Background Type is set to Custom Image. | |
| Background Colour | Colour used when Background Type is set to Custom Colour or to fill letterboxed areas. | #FFFFFF |
Endframe (optional)
| Parameter | Purpose | Default |
|---|---|---|
| Endframe Image | Image displayed for the endframe when enabled. | |
| Endframe Settings | Selects 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 Order | Sets 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)
| Parameter | Purpose | Default |
|---|---|---|
| Asset | Image asset for overlay 1. | |
| Width | Width of the overlay. Use responsive units (vw, vh, %) or 'auto'. | auto |
| Height | Height of the overlay. Use responsive units (vw, vh, %) or 'auto'. | 10vh |
| Position | Position 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)
| Parameter | Purpose | Default |
|---|---|---|
| Asset | Image asset for overlay 2. | |
| Width | Width of the overlay. Use responsive units (vw, vh, %) or 'auto'. | auto |
| Height | Height of the overlay. Use responsive units (vw, vh, %) or 'auto'. | 10vh |
| Position | Position 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)
| Parameter | Purpose | Default |
|---|---|---|
| Text | Text content displayed as overlay. | |
| Font Size | Font size of the text overlay (supports responsive units). | 1vw |
| Position | Position 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 Colour | Colour of the text overlay. | #ffffff |
| Font | Font 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
| Parameter | Purpose | Default |
|---|---|---|
| Vertical Offset | Vertical distance from the top or bottom edges for overlays positioned top or bottom. | 12vh |
| Horizontal Offset | Horizontal distance from the left or right edges for overlays positioned left or right. | 6vh |