PRODUCT

Amazon Ad Server will be sunset in Q4 2024, please visit this page (AAS offboarding information) for offboarding support resources and sunset FAQs. Details shared on that page represent the most up to date information in the Help Center, if you find disparate information in other resources please default to the information in the AAS offboarding information page accordingly.

Please note that on October 1, 2024, the ability to create new campaigns, placements and tag managers was disabled.

Follow

Note

Note: To learn more about this format, preview a demo, or to see build guides for other authoring tools, see About interstitial.

Creating an ad using an Amazon Ad Server template

When creating an interstitial in a code editor, it is recommended that you start with our official template.

Files within the bundle:

README.txt

Amz_Interstitial_1_0_1.zip

Amz_Interstitial_1_0_1_DCO.zip

Amz_Interstitial_1_0_1_Video.zip

Amz_Interstitial_1_0_1_Video_DCO.zip

Download the template, and then select the desired folder from the list of available dimensions and options.

You can also customize the dimensions according to your requirements. Everything can be personalized, including media controls of the video.

Included files

The following table describes the list of files that are included in the downloadable template.

File Name

Description

Required

index.html

HTML file for the banner,

Required

config.js

Configuration/Manifest file for the ad. Used for actions such as default ad settings, and dynamic creative.

Optional

scripts/script.js

JavaScript (logic and tracking) for the banner.

Required

images/default.jpg

Fallback image shown in unsupported browsers.

Required

panels/default/index.html

Default panel file.

Required

panels/default/styles/style.css

Style sheet for default panel creative.

Required

panels/default/scripts/script.js

Core script file required for default panel to load and initialize panel creative.

Required

panels/default/images/logo.png

Logo image.

Optional

panels/default/images/background.jpg

Background image.

Optional

Additional files for a video template

The following table describes the additional files that are included in a video template.

File Name

Description

Required

panels/default/images/poster.jpg

Poster image for the video.

Optional

panels/default/images/play_video_button.png

Play button for the video when ad served in MRAID apps (video template only).

Required

panels/default/videos/video.mp4

Ad video file

Optional

Setting up your ad in Amazon Ad Server

After you finish creating your ad, proceed to setting up your ad in AAS. For more information, see Set up an interstitial.

The config.js file includes the manifest ad data. This file contains metadata used to configure the ad in AAS during the upload. For more information about the Manifest files, see Manifest Ad Data.

Additional resources

Shared libraries

If you are developing ads with third-party libraries, we recommend that you call these libraries from a CDN (Content Delivery Network) when possible. This will help improve loading time and caching.

Dynamic Creative Optimization

If you need to add Dynamic Creative Optimization (DCO) elements to your creative, see Add dynamic elements to your HTML ads using a code editor .

Advanced configuration

The following tables provide additional variables and functions that are available for this format. You can use these additional items to fully customize your ad.

Variables

These variables are located in the panels/default/scripts/script.js file.

Variable Name

Description

Type

Editable

  • closeButton

  • userActionButton

  • clickthroughButton

  • video

  • videoContainer

Global variables used to define HTML objects.

Add, edit, or remove these variables as you modify HTML objects.

String

DOC_tick.gif
  • videoTrackingModule

  • SdkData

  • autoCollapseTimer

  • adId

  • rnd

  • uid

These variables store values that are necessary for the ad to run properly after the upload to AAS.

Important

Important: Do not make changes to these variables.

Boolean

DOC_cross_blue.jpg

Functions

These functions are located in the panels/default/scripts/script.js file.

Function Name

Description

Additional Code Allowed

initializeCreative

Initializes the creative.

You can add your own script if you want to run a script when the creative is initialized.

DOC_tick.gif

initializeGlobalVariables

Initializes the global variables for HTML objects. In the template, positionAdElements is also called to position the ad elements.

DOC_tick.gif

initializeCloseButton

Initializes the close button. Whether to display the close button is based on the serving environment and custom variable.

DOC_tick.gif

initializeVideo

Initializes the video based on the serving environment and custom variable. Determines how to serve the video object and add video tracking to the video module when possible.

DOC_tick.gif

addEventListeners

Adds all of the event listeners. In the template, the click event for the click-through and user action counter was added. In addition, the webkitendfullscreen event listener for iOS devices was added in order to handle some positioning issues when exiting the full screen video player.

DOC_tick.gif

creativeContainerReady

Invoked when creative container is ready, and starts the auto collapse timer.

You can add your own function if you want the function to trigger when the creative container is ready.

DOC_tick.gif

handleCloseButtonClick

Invoked to close the panel, and enable the page scrolling before the ad is collapsed. This function also pauses the video.

DOC_tick.gif

handleUserActionButtonClick

Click event handler for user action button. Calls and tracks the user action. This function also pauses the video.

DOC_tick.gif

handleClickthroughButtonClick

Click handler for the click-through button. Calls this function for the default click-through. This function also pauses the video.

DOC_tick.gif

pauseVideo

Pauses the video.

DOC_tick.gif

videoSliderHandler

Handles the event when a user moves the video slider.

DOC_tick.gif

fullscreenChangeHandler

Handles the event when a video enters or exits full screen.

DOC_tick.gif

startCollapseTimer

Starts the auto collapse timer.

DOC_tick.gif

stop timer collapse

Stops the auto collapse timer.

DOC_tick.gif

disablePageScrolling

Blocks page scrolling.

Note

Note: Ads prevent page scrolling by turning off the touchmove event. If your content uses the touchmove event, verify whether to set the custom variable mdLockScrollingWhenExpanded to No in order to allow page scrolling.

DOC_tick.gif

enablePageScrolling

Allows page scrolling.

DOC_tick.gif

preventDefaultEventHandler

Blocks the default behavior from any passing event.

DOC_tick.gif

Demo

Click here to preview a demo of interstitial format.

Was this article helpful?
0 out of 1 found this helpful
Have more questions? Submit a request

Comments