Getting Started
HTML5 creatives offer many benefits over standard display including rich media capabilities, enhanced design creativity, and increased ad performance. However, HTML5 creatives do require some extra steps prior to upload to the Choozle platform to ensure clickability and click tracking. Check out the below checklist prior to onboarding your HTML5 assets to help guarantee your campaign launches timely and successfully.
Pre-Upload Checklist
☑️ Add the Choozle clickTAG
- All HTML5 creatives use some form of a click tag that provides clickability for the asset. Choozle's clickTAG enables clickability for the creative, ensures your creative clicks through to the page listed as your "click-through" url, and facilitates click tracking capabilities. Please note that "clickTAG" is case sensitive.
- Paste the Choozle clickTAG into the <head> tag of the html file (as high as possible).
<!DOCTYPE html>
<html>
<head>
...
<script type="text/javascript">
function getParameterByName(name) {
name = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
var regex = new RegExp('[\\?&]' + name + '=([^&#]*)'),
results = regex.exec(location.search);
return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, ' '))
}
var clickTAG = getParameterByName("clickTAG");
</script>
...
</head> - Wrap the contents of the <body> tag with the <a href> below. Don't forget the closing </a> tag before the closing </body> tag.
<body>
<a href="javascript:window.open(window.clickTAG);void(0);">
...
</a>
</body>
Some creatives contain a click tag by default that is already compatible with Choozle's requirements. If your HTML5 assets were created using a product that is already compatible or if you were given specific instructions by your account manager, please refer to those steps.
☑️ Test the creative functionality
- We encourage all of our advertisers to verify the functionality of their assets prior to uploading to them to the Choozle platform. Since HTML is the language used by internet browsers, your browser offers an easy way to test your HTML assets. Double clicking the HTML file should open it in your default browser. If not, right click the file and select "Open with" and open the file with your browser of choice.
- Now that you've opened your HMTL creative in the browser, you can verify 3 important things:
-
☑️ Does my creative render correctly?
- Ensure your creative is appearing as intended. Verify it's the correct size and if there are any animations check that they are working as expected.
-
☑️ Is my creative clickable?
- Click on the creative and confirm it has proper click functionality. We recommend making the entire creative clickable rather than just a portion or a button.
-
☑️ Does my creative click through to a blank page or the actual landing page?
- When clicking on your creative in the browser, it should click through to a blank page. If your creative is clicking through to the actual landing page while testing it in the browser, this may suggest that your landing page URL has been hardcoded into the creative file. Hardcoding the landing page URL is not recommended and could compromise your creative's ability to track clicks.
-
- Now that you've opened your HMTL creative in the browser, you can verify 3 important things:
.gif?width=688&height=387&name=Screen%20Recording%202023-11-13%20at%203.38.38%20PM%20(2).gif)
☑️ Compress the files into a .zip and upload
- The last step is to compress the files into a zip folder and upload to your creative library. When zipping the files, DO NOT include the root folder. Select the contents of the root folder, right click, and select "compress". Rename the file something unique and upload.
NOTE: Choozle does have certain recommendations and requirements for file names. For your .html file, we recommend naming this file "index.html". This is the default file name our system will key on. Our system also prevents the use of duplicate names for the .html file. The only exception being using "index.html" so you'll want to avoid reusing file names for the .html file. We also do not allow any spaces in your file names for ANY files contained in your creative zip. So be sure to remove any spaces and opt for using a dash ( - ) or an underscore ( _ ) instead.
