| clickTag Code in a Flash |
| Wednesday, 02 April 2008 | |||||||||||||||||||||||||||||||
|
Are you having trouble adding clickTag code to your Flash files? If so, you've come to the right place. Here's a run through for people (usually 3rd parties creating Flash ads for companies) to adding the clickTag code to their files. Inserting the Code So which actionscripting version does your file use? clickTag for ActionScript 2.0Before starting any work, make sure to back up your file. :) How it Works
Ahh yes, I know it looks VERY tempting to enter in a full URL into that 'if' statement, but DON'T! If you modify this code, kiss your ad tracking capabilities goodbye. The destination URL will be supplied to the ad trafficker so no worries. I will not go into the detail as to how this code works because I'm sure all you want to do is to get the code working and sent off to your client, right? Well, let's get to it! 1. Open your file and save it as Flash 8 Document. This will allow you to add the on(release) behavior to the invisible button that will sit on the top-most layer of your movie.  Step 1: Save your file as Flash 8 Document 2. After saving your file as a Flash 8 Document, view your file (the snapshot shown below is for sample purposes only).  Step 2: Snapshot of the sample file we'll be working with  Step 3: Add a new layer to the timeline 3. Go to your timeline (located up top) and add a new layer called "clickTag". 4. With your new layer ("clickTag") selected, drag a new quadrilateral (square, rectangle, etc.) over the entire stage. The image below shows the steps to dragging a rectangle starting from the top left to the bottom right. The 4th frame in the image below may vary depending on the color you have selected in your color toolbox.  Creating a quadrilateral that covers the entire stage 5. Once the quadrilateral has been created, double click the box (make sure you include the stroke around the shape you just created, if there is one) and go to "Modify" and then "Convert to Symbol".  Convert the quadrilateral to a button symbol 6. Name the new symbol "clickTag" and make sure that radio button labeled "Button" is selected and click "Ok".  Labeling the new symbol and making sure that it's a Button symbol 7. Once your button has been created, double click (or right click and select "edit in place") the button to edit it in place. You will now see your timeline display the Up, Down, Over, and Hit frames. 8. Now click once on the "Up" state frame and then click and drag it over to the "Hit" frame.  Step 8: Your button frames (Up, Over, Down, Hit) should look like this 9. Once you've completed step 8, go back to the main stage. You'll now notice that your button has taken on a blue-ish tint. For the Flash noobs, this tint denotes the active (aka clickable) area of the movie. Don't worry, there's nothing wrong with your computer. :)  Step 9: Your button is now a blue-ish tint 10. Now click on the blue-ish tinted button and open your Actions panel. To open your Actions panel, click on "Windows" in the upper toolbar and scroll down to Actions.  Step 10: Opening up the Actions panel 11. Once your Actions panel is open, make sure that the blue-ish button on your stage is selected. Now copy and paste the following clickTag code into the Actions panel (Update [11/13/2008]: The "if" statement has been commented out since some have been experiencing problems when exporting their Flash ad.):
 Step 11: Adding the Code to the Actions Panel 12. Ok, you're finally at the home stretch. After adding the code to the button, export the movie and make sure that ActionScript version is set to ActionScript 2.0.  Exporting your movie. Make sure you have ActionScript version set to 2.0. VOILA! You're all done. Now if you are still having trouble, you can either try the steps above again, try the clickTag steps for ActionScript 3.0 (listed below), or post a comment with your concerns. I'll try my best to answer all questions.
clickTag for ActionScript 3.0Updated: 03/24/2009 1. Select the button object on the stage that you wish to use and in the properties panel assign it an instance name (empty by default) 2. Since you can’t directly apply actionscript to an object with 3.0, you must select the first frame of a layer on the main stage (ideally the layer containing your button) and in the actionscript panel insert this code, replacing the variable “myButton” with the button’s instance name you assigned.
var _url:String = ""; The third line of code retrieves the http link from the site the flash is in and creates a url variable, the forth line executes the last when the button is clicked on, and the last line actually sends the browser to the url variable created by the third line.
Other Interesting Links on Tracking FlashHow in the world does clickTag work?! A really good entry explaining the what / why / how of clickTag. A simplified solution for tracking Flash content for everyone, called Google Analytics Tracking For Adobe Flash. You can also reference Google's help section about tracking Flash events.
Powered by !JoomlaComment 3.12 Copyright (C) 2007 Alain Georgette / Copyright (C) 2006 Frantisek Hliva. All rights reserved. |
|||||||||||||||||||||||||||||||