Search
Clear search
Close search
Google apps
Main menu

HTML5 banner build guide

Set up a polite load in HTML5 (optional)

What is polite loading?

Polite loading delays the loading of creative assets (like images) until the parent page has finished loading.

3-part polite load image: a) website partly loaded b) website fully loaded c) full ad appears including video
blue letter A Page is 20% loaded: initial content displays.
green letter b Page is 50% loaded: initial content remains, no additional action occurs.
red letter c Page is 100% loaded: additional content and actions display.

Studio doesn't require that your files use polite load, but your publisher specifications may require it.

When you use this feature, you can load in a placeholder image or <div> tag, wait for the page to finish loading, and then control how the creative loads.

Set up a polite load

After waiting for the Enabler to initialize, check if the page is loaded using the Enabler’s isPageLoaded method, which returns true or false. If true, call a custom function that loads your creative, in this example, politeInit. If false, listen for the Enabler’s PAGE_LOADED event before calling politeInit.

if (Enabler.isInitialized()) {
  init();
} else {
  Enabler.addEventListener(studio.events.StudioEvent.INIT, init);
}

// Runs when Enabler is ready.
function init() {
  if (Enabler.isPageLoaded()) {
    politeInit();
  } else {
    Enabler.addEventListener(studio.events.StudioEvent.PAGE_LOADED, politeInit);
  }
};

// Runs when the page is completely loaded.		
function politeInit(){		
  // Add your code to load creative assets or begin creative animation.
};
Was this article helpful?