From September, Flash will no longer be supported by Chrome. Prepare for the shift towards HTML5 by visiting our Flash to HTML5 help page

Check it out!

Google Swiffy Banners

Google Swiffy is a web-based tool that converts SWF files to HTML5. In order to make such banners be compatible with Adform system creative should follow specifications below. 

 Note: don't use automatic Adform Studio "Add Global clickTAG". Curently, clickTAG modification needs to be done manually according specs below.

 

Adding the clickTAG via Adform Studio

1. Upload Swiffy banner to Adform Studio: http://studio.adform.com

Thumbnail

 

2. After the upload of a ZIP, the HTML5 Toolkit presents same categories and formats that are available in the Adform Platform; selecting the right format can help rendering an exact preview with the specific behavior that is enabled for each category or format. 

Html 5toolkit _select _cat _n _format _2014-11-10

3. After selecting a category and a format you will be redirected to the Banner Workspace screen.

4. If there is no Adform DHTML library added, Studio will ask you if you want to add Default ClickTAG, click "Cancel" because you need to add clickTAG manually according Google Swiffy specs:



5. Then window instantly presents banner settings on the left side of the screen. Add clickTAG, banner name and correct banner dimensions. Clicking on the Save button instantly refreshes the preview of a banner.

6.  Select html file in "Adform Studio":

Thumbnail

 

7. It is important to know that Adform.DHTML.js library should be added in document's header in all cases.

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

Please note that we are setting our clickTAG URL to the Swiffy Banner clickTAG variable - this variable (case-sensitive) must be already implemented in the banner. Otherwise the banner will be unclickable.

clickTAGvalue = dhtml.getVar('clickTAG', 'http://www.example.com'); //Adform clickTAG
....
stage.setFlashVars("clickTAG=" + encodeURIComponent(clickTAGvalue)+""); //setting clickTAG for swiffy banner

Please check attached screenshot to see how and where exactly these lines should be added.

 

9. Export your "Toolkit Ad"

Thumbnail

 

10. Banner is ready for Adform platform!