The following article contains the overall Creative Requirements that will ensure your Adaptive Creative ad will pass QA and be uploaded to the network seamlessly.
Ensure your main HTML file is named ad.html or index.html
2. complete Event
Always send a complete event in your ad experience.
The complete event is used to define when the primary experience of the ad has been completed (for example, with a playable ad, the final screen displaying the CTA and logo would be a suitable moment to trigger the complete event).
If your creative does not have a clear state where the creative has completed/ended, you can use the complete event after the user has made 5 or more interactions. Ensure you explicitly call complete and not download in this case.
3. Error free code
Ensure your code is error-free and semantically correct.
There should be no errors reported in the console and your ad.html should pass markup validation (use a validator such as W3C, or lint when developing locally).
Check to make sure your creative is compatible in both portrait and landscape orientations.
Use aspect ratio breakpoints to dynamically change the creative experience, so users experience a premium creative irrespective of whether their device is in portrait or landscape.
5. Visible call-to-action
Your creative should always contain a CTA, which can be interacted upon, and is visible throughout the ad experience.
6. Full-screen clickable end screen
Your creative can only provide full-screen clickable element, ensure it can only be actioned at the end of the creative experience.
For example, only use a full-screen clickable element on the end screen, once the primary experience of the ad has been completed. This is the only place you can call the download event when not attached to a CTA element.
7. START_MUTED token
If your creative uses audio or video elements, ensure the audio can be muted/unmuted remotely by including the START_MUTED token.
8. Pausing/resuming content
Use the pause and resume events to toggle audio and video (if used in your creative).
If the user were to pause the ad, any audio/video elements in the creative should also pause, and only resume once the user resumes the ad experience.
9. <5mb file size
Ensure all assets are compressed, and the total file size of the ad should not exceed 5MB.
Please DO NOT:
1. download Event
Do not use the download event without user interaction.
Please follow the instructions on how to implement ASOI to ensure your download event does not cause issues with publisher tokens.
2. Direct calls to App Stores
Do not call directly to AppStore / Play Store from your asset (ad.html)
Please use "complete" / "download" events instead. For more information please refer to the following instructions on how to customize your experience.
3. Nested directory structure
Do not use nested directories.
All files (e.g CSS, JS and other assets) must be kept at the same level as ad.html.
4. vw and vh units
Avoid using vw and vh units in the CSS.
Some devices/platforms render this unit differently and can cause issues with your creative.
Never use document.location.reload.
6. Custom close button
Never use a close button in your creative.
Adaptive Creative automatically generates a close button to control the ad experience. Avoid using additional close iconography, as it can confuse the user.
7. External assets
Do not use assets which are hosted externally. All assets must be referenced locally within the creative.
A user may not be connected to the Internet at the moment they are viewing the ad, and so any externally sourced assets may fail to load.
Some assets may throw CORS (cross-origin) errors. Consider using base64 if necessary.
8. Ad tracking links
Do not use ad tracking links or any external tracking libraries.
9. mraid.js references
Do not include a reference to mraid.js.
Adaptive Creative already uses MRAID, and calling it from the creative may interfere with the ad experience.
10. Platform-specific APIs or experimental features
Avoid using platform-specific properties or experimental features.
Your creative may be served across all Liftoff Monetize SDK platforms (iOS, Android, Windows, Amazon) so ensure cross-compatibility when building your creative.
11. Load Event
Avoid relying on the load event to initialise your ad.
If some resources fail to load, it may prevent the web-view from triggering the load event.
12. Adaptive paths
Avoid using adaptive paths
This approach may cause resource requests to be directed locally.