Load and Initialize the API – Sizmek Help Center

Overview

Sizmek provides several ways, including AdKit and EBLoader, to load and initialize your ads using the Sizmek HTML5 API. You must wait for the load and initialize processes to finish before you use the Sizmek HTML5 API. We recommend using AdKit as it is the most advanced and offers additional functionality.

Comparing EBLoader and AdKit

A loader script must be included in the index.html file when creating your own HTML5 ads using the HTML5 Workspace API. Previously, EBLoader was the only loader used when creating Workspaces; however, Sizmek has recently substituted EBLoader with the AdKit loader.

Important

Important: Although EBLoader is still supported, we recommend using the AdKit loader.

If building with AdKit in Sizmek Ad Suite, only the non-secure (http) call is required. Sizmek Ad Suite will automatically recode any https AdKit calls to http. This is because Sizmek Ad Suite adjusts this call based on the tag settings (secure vs. non-secure).

The difference between the two loaders is described in the following table.

Feature	AdKit	EBLoader	Comments
Script Syntax	`<script src="http://ds.serving-sys.com/BurstingScript/adKit/adkit.js"> </script>`	`<script src="https://secure-ds.serving-sys.com/BurstingScript/EBLoader.js"></script>`
Loader Size	Heavier	Lighter
Automatically Detects Type of Site - HTTP or HTTPS	Yes	No	Requires adding the specific site type for each ad. EBLoader is recommended if the site type is known in advance.
Loads AdBuilder Components	Loads components.	Does not load components.

AdKit

AdKit is a JavaScript framework that loads EB and other Sizmek modules. It contains a server integration that determines which protocol to use during runtime, regardless of whether you use http or https in the HTML of your ad.

Procedure

To use AdKit, add the following lines to the <head> section of your index.html file within your Workspace:

            <script src="http://ds.serving-sys.com/BurstingScript/adKit/adkit.js"></script>
            <script>
  adkit.onReady(function(){
        //  Place your code to start the ad flow here
   });
</script>

EBLoader

You can Load EB directly using the EBLoader. Advantages to EBLoader include:

You already know on which pages your ad will run.
You already know which protocol is needed for that page (HTTP or HTTPS).
You want to save a few kilobytes of size from your ad download.

Note

Note: In most cases the end-user's browser will already have the adkit.js file cached, so there is very little to be gained by using the EBLoader directly. It may be useful in case a publisher is particularly strict with their ad download sizes requirements.

To do this use either:

                <script src="https://secure-ds.serving-sys.com/BurstingScript/EBLoader.js"></script>

                <script src="http://ds.serving-sys.com/BurstingScript/EBLoader.js"></script>

Procedure

To initialize the API, add an EBLoader.js reference in the head section of your Workspace.
Add the following code as early as possible to the body element in the ad's HTML file.

isInitialized checks whether the EB object is fully initialized and available for API calls.

            
<script src="https://secure-ds.serving-sys.com/BurstingScript/EBLoader.js"></script>
<script type="text/javascript"> 
    function checkInit() {
        if (!EB.isInitialized()) {
            EB.addEventListener(EBG.EventName.EB_INITIALIZED, onInit); 
            // This code checks whether the EB object is initialized, if the object is initialized, it launches the function "onInit", otherwise "EB_INITIALIZED" event. 
        }
        else {
            onInit();
        }   
        function onInit() {
            // Place your code to start the ad flow here
        }
    }
    window.addEventListener('load', checkInit);
</script>

Modules

When loading EB and/or AdKit, you may also want to load some other Sizmek modules, depending on the functionality needed in your ad.

For example, if your ad contains video, and you want video metrics to be tracked, you would include the “Video” module. To do this, add the following line of code before your AdKit/EBLoader script tag:

            <script>EBModulesToLoad = ['Video'];</script>

EBModulesToLoad is an array which should contain the names of all the modules you wish to load. The full list of modules are:

Video: Video tracking. For more information, see HOW TO: Work with the Video Module.
EBCMD: Required for mobile-device in-app serving using the IAB’s MRAID framework. For more information, see HOW TO: Work with the EBCMD Module.
MRAID: An alias for the EBCMD module.
EBAPI: Extra functionality for Rich Media ads. Mostly only used by Custom Formats. For more information, see API Extension Module.
Comm: A module that enables communication between the various panels of a multi-panel ad, or between multiple Sizmek as on the same page. For more information, see HOW TO: Work with the Comm Module.

For example, if you ad uses video, and needs to run in mobile in-apps, you would include the following in the <head> of your HTML:

            <script>EBModulesToLoad = ['Video', 'EBCMD'];</script>
            <script src="http://ds.serving-sys.com/BurstingScript/adKit/adkit.js"></script>
<script>
  adkit.onReady(function(){
        //  Place your code to start the ad flow here
   });
</script>