PRODUCT
Follow

Note

Note: To learn more about Dynamic Creative Optimization (DCO), or to view guides about other authoring tools, see Introduction to Dynamic Creative.

Overview

The following sections describe how to define dynamic elements manually for HTML ads that are hand-coded in a code editor.

The Dynamic Creative feature uses the Sizmek Ad Suite (SAS) creative AdKit for developers. AdKit includes ad-related functionalities that provide quick and easy development of your HTML ads.

Important

Important: Make sure to properly load the AdKit API before building your dynamic creative. For more information, see Load and Initialize the API.

AdKit implements Dynamic Creative with the following dynamic data types:

  • HTML Components: HTML code fragments that are inserted automatically into HTML 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.

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

File

Description

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, and serves as the main configuration file for the creative AdKit.

Configuring Dynamic Elements

Use one or both of the following methods to configure dynamic data types:

  • Method A: Define variables inside your config.js file, and use the AdKit API to access these variables inside your JavaScript code.

  • Method B: Map HTML tag IDs from your index.html file to items in your config.js file, to automatically update the index.html with dynamic adkit-components.

You can use both methods in the same ad.

Example

The following example uses both methods to demonstrate how to convert a div that has the ID BookPrice into a dynamic element.

Procedure
  1. Open your index.html file.

  2. Create a div with the ID BookPrice.

    <div id="BookPrice">
    </div>
  3. Save your file.

Before starting to configure the dynamic elements, create a div, and make sure its ID is defined.

Creating Ad Versions in Sizmek Ad Suite

Once you upload your ad to SAS , the Versions tab is available from the Ad Setup page. The Versions page includes the HTML and variable items that you defined in the config.js file. For more information about versioning, see Work with Versions of a Dynamic Creative Ad.

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

Comments