Creatives
Working with creatives
Creative technical specs
Viber Format Creatives specs
Advanced Creative settings
Creative billing
UI template: HTML5 Banner
The ad format of a standard banner with a fixed size and page position.
This ad format may be subject to restrictions imposed by Google in cooperation with the Coalition for Better Ads on delivery of ads in Chrome. A list of ad experiences that should be avoided in this ad format according to Initial Better Ads Standards:
· autoplaying video ad with sound.
· autoplaying video ad with sound.
Supported platforms
| Desktop | Tablet | Phone | |||
|---|---|---|---|---|---|
| Windows | Mac | iOS | Android | iOS | Android |
| Chrome, Firefox, Edge, IE11+ | Safari6+, Chrome, Firefox | – | – | – | – |
Known issues
A creative created with Adobe Edge technology can be non-clickable in a Safari Mobile browser.
Format requirements
Main panel
Standard dimensions, WxH, px: 300х250, 240х350, 240х400, 180х150, 320х280, 728х90, 970х90, 970х200, 650х250, 240×500, 300х600, 160х600
Video
- Video player container can be of any size within the expanded panel’s borders
- File type: .mp4
- Duration: 30 sec
- Frame rate: 24 fps
Audio
User-initiated (off by default)
Size
- max 300 KB without video
- max 2 MB with video
Download archive with a template:
Present file structure corresponds the default template only and can be changed by you. The required file in a .zip archive is body.html. All parameters such as dimensions, events, click tracking etc. can be defined in the body.html.
How to work with .zip archive (template)
- Unpack an archive with a creative template.
- For creative preview use the preview page or copy all files to a folder index – banners – banner – body and open a file index.html in a browser using localhost. For that, a web server has to be installed (e.g. IIS for Windows, Apache for Mac OS).
- Open the file body.html with the text editor and edit the code snippet inside tags <body> </body>.
Provide banner sizes, scripts, etc. within <body> </body> tags. Otherwise, the ad won’t show.
- Edit a file body.js.
- Save and archive all banner assets in .zip (you should archive the files, not the folder that contains the files).
File body.html must be in the root directory of the .zip file.
Asset requirements
ZIP archive
The banner with all banner assets should be archived as a .zip file. Use a .zip file with the template.
HTML file
The HTML file must define all used sources (libraries, images, etc). A recommended file name is body.html.
Please note that during validation, the archive is additionally checked for errors in finding deleted / non-existent files such as .jpeg, .png, .xml, .js and others through the Dev Tools (F12) tool. If the server does not find the necessary files when loading, this leads to the formation of a large number of errors, which puts an excessive load on the ad server. Creatives with a similar problem will be rejected with a corresponding comment.
API connection and usage
globalHTML5Api connects automatically, requested the following way:
- Expand the globalHTML5Api code
globalHTML5Api objects and methods should be defined inside a called function. All used modules should be listed as function parameters. In this format the Player module may be used.
A simplified example of the globalHTML5Api.init usage for the Standard format:
- Expand the globalHTML5Api.init example code
globalHTML5Api.init Parameters
| Key | Parameters | Properties | Type | Description | ||
|---|---|---|---|---|---|---|
| resize(options) | – | – | – | globalHTML5Api.resize initialization | ||
| options | – | Array | Array of objects with properties. Each object presents the container state (resizeState) | |||
| name (required) | String | Object (state) name | ||||
| width (required) | String|Number | Banner container width | ||||
| height (required) | String|Number | Banner container height | ||||
globalHTML5Api Methods
| Method | Arguments | Type | Description |
|---|---|---|---|
| click(URL) | – | – | Method to call the clickthrough. Target URL may be set as a parameter or from the user interface. The URL set in the code has a higher priority than the URL set from the UI, which can lead to a conflict. Therefore, it is mandatory to use only one of the available methods. |
| URL (optional) | String | Target URL | |
| src(URL) | – | – | Method returns the absolute path to file |
| URL (optional) | String | Relative path to file |
Video
In case the creative contains video, see the Video player module page.
Images
Supported file types: .jpg, .png, .gif, .svg
Important! To serve ads on secure sites (sites that are served over the HTTPS protocol), make sure that external references to files support only secure HTTPS scenarios.
Event tracking
- View
- Confirmed view
- Click
Chrome will limit the resources a display ad can use before the user interacts with the ad by removing heavy creatives from the page. An ad is considered heavy if the user has not interacted with it (for example, has not tapped or clicked it) and it meets any of the following criteria:
– Uses the main thread for more than 60 seconds in total
– Uses the main thread for more than 15 seconds in any 30-second window
– Uses more than 4 megabytes of network bandwidth
– Uses the main thread for more than 60 seconds in total
– Uses the main thread for more than 15 seconds in any 30-second window
– Uses more than 4 megabytes of network bandwidth
For any questions regarding ad manuals please contact the support manager of your account.
Updated on April 02, 2024