HTML5 Creatives

Background

HTML5 Creatives can be uploaded to campaigns and served on display inventory. The creatives should follow the IAB standards for HTML5 ads. To allow the creatives to be correctly uploaded please ensure the prerequisites are followed.

Requirements for HTML5 creatives

  1. HTML5 creatives should be contained in .zip format, one zip file per creative
  2. The maximum zip file size is 200 KB per file
  3. HTML file should be in the first root folder
  4. Banners are only served secure (https), so all links and libraries within the creative should be secure.
  5. The clickTag variable should be defined in the creative HTML file. This will enable Improve Digital to count clicks and set the correct ad landing page without modifying the creative code itself. The following code can be used to allow external click modification:
    var clickTag = window.location.search.split('clickTAG=')[1].toString();

Uploading creatives

  • Click +New creative
  • Complete Basic Properties: Creative name, Platform Type Web, Creative Type HTML5, Size as needed
  • Complete General Properties:
    • Click Creative has been tested and can track clicks
    • Select the appropriate Click Tracking Macro - either encoded or not encoded
    • Set the Custom Clicktag: this should be what is defined in the creative HTML file and is case sensitive, for example: clickTAG, ClickTag, etc.
    • Enter the Click URL (the advertiser landing page of the creative)
    • Click Browse and select the .zip file, and save

Troubleshooting

  • When clicking on the previewed creative, if an XML error appears, edit the creative and set the Click Tracking Macro to Macro {CLICK_URL}
  • When previewing the creative, if clicking the creative has no action, the clicktag in the HTML file is not correctly implemented. Contact Support for help here.

Examples

The following examples show how the ClickTag should be implemented in different examples of the creative HTML file.

Example 1

Screenshot_2017-08-14_11.33.38.png

No changes are needed in the HTML file here - clickTAG is defined. The Custom Clicktag field in the creative should be set to clickTAG as shown in the file. However, as the PublisherClicksApi library is likely encoded, use the encoded Click Tracking Macro option in the creative {CLICK_URL_ENC}.

Example 2

Screenshot_2017-08-14_11.41.49.png

A change is needed in this HTML file because the landing page is specified in the creative, so the Improve Digital platform click tracking URL cannot be called, preventing clicks being counted. This creative should be amended:

  • add the clicktag variable as described in prerequisites:
    var clickTag = window.location.search.split('clickTAG=')[1].toString();
  • copy the landing page and paste as the Click URL in the creative
  • replace the landing page with the clickTag variable

The new HTML file will now be:

  Screenshot_2017-08-14_11.39.53.png

 

Note: there should not be any spaces or line breaks in the HTML code as this might stop the file working correctly.