How To Use Google Swiffy to Convert Flash Into HTML5 Skip to main content

How To Use Google Swiffy to Convert Flash Into HTML5

Swiffy is a tool developed by Google to convert Flash into HTML5,
As digital advertising industry is shifting from using Flash creatives to HTML5 built creatives, there are plenty of tools which can help you to do that.

What are the prerequiste ?


As we all know that Flash file contain Clicktag which is variable use to track the clicks and redirection to advertiser page.Read More ClickTag


The clicktag is case sensitive so ClickTag clickTAG and ClickTAG are diffrent ,

So make sure which kind of clicktag is implemented inside the swf file that you are going to convert.


Secondly If we decompile the flash file using various tools such flash docompiler,SWFInvestigator by Adobe, We will be able to see which kind of clicktag is implemented and how it is implemented


And implementaing Click url was not accepted in our old method of trafficking the swf creatives,

But for Flash to HTML5 conversation , you will need the clickurl as direct third party url and addtional impression tracker from third party so that impression will get recorded inside third party adverser.

Once this checks are done its time to upload the swf 


Steps


  • Open the swf file with flash decompiler and check the clickurl implementation


flash_decompiler_clicktag
flash_decompiler_clicktag
google_swiffy


  • Once you saved the converted HTML5 file, Open the file into Notepad++ or Notepad.

     We just need to upload only some code in Adserver,
     If additional trackers are provided then we need to upload the code below the HTML5 Converted code.

notepad++



Now copy highlighted Code from Notepad++ and upload in Adserver,

Since we didn’t append any click macro we need to manually append the code in front of the URL.

Append %c which is universal click macros before click url

  • If you are using DoubleClick tracker then below are the few changes that can help in tracking  

You need to modify the Swiffy code by adding an additional line of code – as below. Make sure you add the add the line exactly before stage.start().

  […]
    <div id=”swiffycontainer_%ecid!” style=”width: %%WIDTH%%px; height: %%HEIGHT%%px”></div>
    <script>
      var stage = new swiffy.Stage(document.getElementById(‘swiffycontainer_%ecid!’),
          swiffyobject, {});
      stage.setFlashVars(“clickTAG=%%CLICK_URL_ESC%%%%DEST_URL%%”);          
      stage.start();
    </script>/
  </body>


Flash variables are case-sensitive. If the Flash creative expects a different clickTAG case format (e.g.clickTag, clicktag, or CLICKTAG), you should change the variable case accordingly. If you don’t define the clickTAG case properly, clicks won’t be tracked correctly, and the creative won’t redirect to the correct destination URL.

Also, if you’re using synchronous Google Publisher Tags, make sure to add _%ecid! in the Swiffy code snippet, as highlighted above. This ensures your Swiffy-generated HTML5 creatives don’t clash if more than one serves at the same time.




Facebook Comments
 
 
   
   
     
   
       
 
   

Admin

My name’s Sachin, and I am Blogger and tech geek, currently working in Digital Advertisement Domain having work experience of more than 3 years.
Ad-Tag Macros is the professional association dedicated exclusively to online advertising operations and technology.
We focus primarily on topics such as ad serving and related technologies, yield management, policies, procedures, and standards.
Experience
Platform
DFP Small Business
Google Analytics
Native Ads
Mgid
WP
ComScore
Blogspot
AdSense
Skills
HTML/CSS
Javascript
Yield optimization
Trafficking
Mobile web ads
Display, video ads
Troubleshooting creative issue
SEO and Blog revenue Optimization
For Any Queries Please Contact Me
Contact@adtagmacros.com