Test & Support Center

Google Web Designer is a tool to build HTML5 banners. In order to make such banners be compatible with Adform system creative should follow specifications below. 

Tip: Use Adform‘s HTML5 Studio to automatically add required scripts and to auto apply Global ClickTAG. Please make sure to test your banner if this Global ClickTAG solution is working properly, especially on Mobile devices.

 

 Note: this describes the usage of external non Adform related systems and please check respective documentation for most up to date information.

 

Adding the clickTAG via Google Web Designer tool

1. Open Code view, insert DHTML library to head section:

<script>
document.write('<script src="'+ (window.API_URL || 'https://s1.adform.net/banners/scripts/rmb/Adform.DHTML.js?bv='+ Math.random()) +'"><\/script>');
</script>

 

 

2. Create tap area from Google Web Designer components:

 

3. Click right mouse button and select "Add event..."

 

4. Select "Tap Area" and then "Touch/Click":

 

5. Choose "Add custom action":

 

6. Define function name,e.g. “clickTag” and add this code snippet:

clickTAGvalue = dhtml.getVar('clickTAG', 'http://www.example.com');
landingpagetarget = dhtml.getVar('landingPageTarget', '_blank');

window.open(clickTAGvalue, landingpagetarget);

7. Click "Save" and banner is almost ready to run on Adform! It is missing Adform-specific file - manifest.json, where banner's details are stored.

Testing GoogleWebDesigner banner in Adform Studio

Export the banner using these example settings:

Upload the ZIP file to our Studio and define banner settings (category, type, dimensions, clickTAG).

Check if it's clickable (both on Desktop and Mobile devices using different OSes and browsers), being displayed properly, all the functions are working and when finished, just click on Export and you will have a banner that is ready to go on Adform!