PRODUCT
Follow

Overview

This article describes how to manually define Dynamic Creative (DCO) for HTML5 ads that are uploaded to Sizmek MDX by using Workspaces. This procedure is performed prior to uploading your HTML5 ad to the platform in your Workspaces.

Ad developers use Dynamic Creative to create ads that contain dynamic content. After a Dynamic Creative ad is uploaded to the platform, the ad's content can be manipulated through the platform to create different versions of the master ad, without changing the original creative files.

The HTML5 Dynamic Creative (DCO) feature uses the Sizmek Creative AdKit Suite for HTML5 ad developers, which contains ad-related functionalities that provide quick and easy development of your HTML5 ads. The Sizmek Creative AdKit Suite implements HTML5 Dynamic Creative with the following dynamic data types, which are part of the Sizmek Creative AdKit Suite:

  • HTML Components (such as adkit-HTML): HTML code fragments that are automatically inserted into tags in the ad’s index.html file.

  • Variables: String variables that are accessible for use by the ad’s javascript code. The AdKit API retrieves values for these variables. An HTML5 ad’s Workspace contains various files: html, script and asset (image, audio, video) files.

Adding Dynamic Creative to HTML5 ad requires configuring and placing the following files in the root folder of the Workspace.

Field

Index.html

The ad’s main creative file. Includes the AdKit script that runs the config.js.

config.js

The config.js file includes the Dynamic Creative ad configuration. This serves as the main configuration file of the Creative AdKit.

Perform the following workflow to add Dynamic Creative items to your HTML5 ad.

Add the Creative Adkit Declaration to the Index.html File

The Creative AdKit declaration replaces the standard EBLoader declaration. This action automatically updates the index.html with dynamic adkit-HTML data when the ad is served.

Configure the Dynamic Creative Elements in Your Ad

The config.js file contains the HTML5 ad Dynamic Creative schema which is configured using dynamic data types. You can either add one or both of the following dynamic data types to the config.js file:

  • Option 1: Map tags from your index.html file to items in your config.js. file, to automatically update the index.html with dynamic adkit-components.

  • Option 2: Define Dynamic Creative Variables inside your config.js file, and use the AdKit API to access these variables inside your Java Script code. This is described in the following Configure and Apply a Dynamic Creative Variable section.

Note

Note You can use both Adkit data and Variables in the same ad.

Upload the Workspace to the Sizmek Platform

Procedure

Verify that the index.html and config.js are located in the root directory.

  1. Place all ad assets, and a default image, into a folder.

  2. Compress your folder to a ZIP file.

  3. Upload the ZIP to Sizmek and create an ad based on that Workspace.

Test Dynamic Creative Functionality in Your HTML5 Ad

The Dynamic Creative tab contains the HTML and variable items that you defined in config.js. After you create an ad based on your uploaded workspace, you can test the Dynamic Creative functionality. Note that an ad is uploaded as a Single Versioning ad by default, but can be converted to a Mass Versioning ad through the platform.

The Dynamic Creative tab should contain the HTML and variable items defined in config.js.

Procedure
  1. Click the Dynamic Creative tab.

  2. Preview the ad and verify that you can create versions for it by using the platform

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

Comments