New video tutorial on using SWFAddress

I just uploaded a new tutorial that shows you how to enable direct and deep linking using the SWFAddress library. Deep linking is just another name for making the back button work. This tutorial also goes over a couple of potential gotchas that you need to avoid in order to get SWFAddress working properly. Adding this functionality will make your users very happy and, in the end, that’s what it is all about.

Lee


Commentary

  1. Shaun says:

    Wow Lee, your on fire this week with the tutorials :)

  2. Clemente G says:

    Woot Go lee with he tutorial marathon.

  3. kaiserkingkaiser says:

    hey lee, what happen to you man?
    did you eat or drink something?
    take it easy lee, im learning them one at a time, you are giving me a hectic learning schedule here… hehe…

    kidding aside, thank you lee for sharing your knowledge to the adobe community, really really really appreciate it…

    God bless always and keep them coming…

  4. soyek says:

    At last! This is the one I was waiting for a long time now.
    Thank You so much Lee!

  5. vitaLee says:

    Lee, you should consider reducing your ‘ReD Bull+Chocolate’ portions. :D
    you get 10 points for the great shot with this video. :)
    thanks man.

  6. david says:

    Hi, great tut.
    i find really hard to implement the swfaddress listener when using subsections or inner elements in the page that are dynamic (ie the structure of the site comes from an xml) and mostly when i’ve got plenty of transitions between sections.
    Using the back button (fast) seems to crash all the transitions because i couldn’t get to manage all the timings and intervals..
    any ideas?
    thanx

  7. Wauwwww Leeee,

    Thank you so much for these tutorials. Its really the best tutorials!!
    Hope you will give them for a really long time.

  8. Nick Brown says:

    Great stuff Lee – the last 4 tutorials you’ve done have been so relevant to what we’re going through and need at the moment. Can’t praise you enough!

  9. Yogesh says:

    This is helpful. Thank you for sharing this.
    Are there any kind of limitations in using this? I mean, the example you used was kind of ‘basic’, I am wondering if it works with complex applications also.

  10. Riley says:

    Hi Lee, thanks for the tutorial. I setup swfaddress for a flex site last week and it’s a little more tricky. What is the difference between swfaddress and flex’s history manager?

  11. hicham says:

    Hi everyone,
    thanks so much Lee,

  12. Mike says:

    Great tutorial Lee!

  13. Stephen says:

    Has anyone successfully implemented this in Safari 4 beta? I can paste a deeplink into the browser and it recognizes it however clicking around in the app isn’t setting the address bar.

    I believe in the tutorial Lee is using Safari 3?

    Thanks.
    /s

  14. adrian says:

    Grate tutorial Lee, can you also make on of search engines best practices?

  15. adrian says:

    Grate tutorial Lee, can you make one for search engines best practices?

  16. samBrown says:

    great tut – thanks for the post!

  17. Thanks for the tutorial, I was wrestling with this last week for a site I’m working on, but it was great to hear you give a clear example on how it works and what to watch out for.
    Thanks.
    -Chris

  18. Stephen says:

    Guess there’s a flaw in my project structure because the example files provided are working in Safari 4.

    /s

  19. vi54 says:

    you are so! on a roll Lee, i love these new tutorials, covering facts & stuff where other tutorials end.

    keep this level up

  20. Mathias says:

    Hello Lee!

    I thought this was going to be native in the flash player, and all you would have to do it call a function and it would deep link for you depending on the string you pass.

    -Mathias

  21. hicham says:

    Hi everyone
    he just uploaded a new tutorial with this title :Custom Flex Preloader
    check it in gotoandlearn
    haha lee GOTCHA !!!

  22. Cool stuff, I’ve been using this for ages both in Flash sites and Javascript. It’s cool to see you do a tutorial on it though, it’s a pretty essential part to any flash site.

  23. Amit Dhamu says:

    Great series of tutorials Lee. Really needed this one.

    Also did the custom Flex preloader tutorial as well. That was pretty cool. Most of the RIAs I’ve seen are still using the built-in preloader for Flex so this was a worthwhile tutorial.

    I’m still making the transition to AS3 but since I’ve been using Flex, I’ve found my learning curve for AS3 become easier. I’m primarily a Flash developer but Flex has widened the boundaries and I’m finding it easier to learn.

    What would be cool is how to make a blog or guestbook in Flex powered by AMFPHP.

  24. Tim says:

    This one is great lee!

    I was on vacation but i’m back now and i got some work to do:P

    My appreciation for this one!

    Grtzz

  25. Ian says:

    Thanks for the tutorial! Yet one more reason for me to familiarize myself with SWFAddress.

  26. royalpropaganda says:

    Hmm,
    After some time I realised the SWFAddress only works in the site’s root.

  27. cicit says:

    Hi Lee

    Great Tuts btw, I have one question how is the best way to solve this, my case is :
    lets say your URL is
    http://www.yoursite.com/#/Biography
    but some people will put the address on the browser
    http://www.yoursite.com/#/Biography/ –> with the “slash” or vice versa
    you know, we pass the URL now and then and people may not pay attention to slashes

    so, the best way is to put more logic in the
    switch (e.value){
    case “/Biography” : dosomethingA
    case “/Biography/” : dosomethingA
    }

    can somebody enlight me?

  28. steve says:

    Does the # in the url stop Google indexing the content (from a seo point of view)

  29. plastik says:

    Thanks for the tutorial!

    I have implemented it in my personal website, take a look here http://www.plastikaweb.com/index_eng.htm and I think works perfect!

  30. Simon says:

    i would love to know how to do this same functionality in as 2!
    any ideas people?

  31. Kevin Rommen says:

    @Steve,
    yes, Google doesn’t index this. Check out the SEO Sample @ the Asual website, a solution is offered there.

    @Simon,
    On the Asual website AS2 examples can be found.

  32. Odrakir says:

    Hi Lee,

    I have a question, wouldn’t the code inside the CLICK handler be called twice when the users clicks a button? One time when it’s clicked and a second time when the onChange event calls it again.

    It is not a problem in your example, as you don’t have any intro animations or so, but it could be a problem in some other structures. Wouldn’t it?

  33. Andy M says:

    I keep getting this message when I try to open the downloaded file in my browser (tried it with Safari 3, 4 and Firefox):

    SecurityError: Error #2060: Security sandbox violation: ExternalInterface caller file:///Users/andymarlow/Desktop/bea-1/bea.swf cannot access file:///Users/andymarlow/Desktop/bea-1/bea.html.
    at flash.external::ExternalInterface$/_initJS()
    at flash.external::ExternalInterface$/addCallback()
    at com.asual.swfaddress::SWFAddress$/_initialize()
    at com.asual.swfaddress::SWFAddress$cinit()
    at global$init()
    at bea_fla::MainTimeline/frame1()

    Any ideas how to stop this? It displays the SWF from the examples but with all the layers showing (on top of each other).
    Any advice would be much appreciated.
    Thanks,

  34. Andy M says:

    Re the above post: i´ve got rid of the security message by installing the latest debug version of Flash. However, whereas the SWF displays fine in the stand alone flash player, it doesn´t display correctly in the browser (it still shows all the layers on top of each other…

    Any ideas? this is driving me nuts..

  35. alex says:

    hi Lee

    could you tell me why the downloaded file bea.fla will not open for me in CS3?
    I really want to look at the source.

    cheers
    Alex

  36. Darryl Snow says:

    @alex

    It’s because it’s a CS4 file. It’s definitely worth upgrading, if not for the smart new interface and cool features, but then to check out Lee’s tutorial files.

  37. Naresh says:

    Hi Lee,

    It is great tutorial. But I don’t see how can I disable back button if it is possible using swfaddress OR if I need a functionality like if user clicks on back button then how can I prevent user from going to previous site which is different from current site?

    Thanks,

  38. TMK says:

    Great tutorial! But I’ve got a small problem = my page is dynamicly loaded (all in one frame) by varieble _State. I need to send that var in my address, how to make it? ex. _State = 2?

    Thanx!
    TMK

  39. dominik says:

    super cool but it doesnt work
    bea.html
    i get all clips visible and on top of each other.
    anyone solved it?

    thanks :)

  40. dominik says:

    well, i sort of fixed it but tha url isn’t responding…
    do i have to put it on-line ?
    i’m really confused pls help

  41. sean says:

    there may be an error in your files:
    when viewing bea.html, i’m also getting all the MCs visible and ontop of eachother. Clicking the links is non-responsive. Note this is just when viewing within a browser window (safari, firefox on osx). viewing the swf directly seems to work (or course then you can’t see the swfaddress in action).

  42. uk says:

    Yeah.. I have exactly the same problem. Anyone can help? Lee? :)

  43. Andy M says:

    Re Dominik / Sean:

    copy the ‘com’ folder from the SWFAddress files and paste it into the same folder as Brimelow´s files…

  44. navanath says:

    hey lee,

    The tutorial is very nice explained. thanks but, I have one question that i could not understand the “var attributes = {id:”bea”}” that u written in bea.html file. I know that u have explained it to see the swfobject reference but i want to know that what is this attribute variable is holding? Is the value is same every time that is “bea” or is it change dynamically? please explain in more details.

    Thanks,
    Navanath

  45. Just a quick note for anyone frustrated out there if slightly more complicated swfaddress applications seem to be not preloading. There is a problem with accessing a deep link with a large swf, the swf must be loaded prior to ANYTHING being visible, which is a pain. The solution to this is to have a main preloader (very tiny) which will always load the main content. You pass the swfaddress into the preloader and activate the onChange. This will then allow you to preload the main content seperately. Once main content is in, pass the previously recorded SWFAddress details into main via a function, disable the existing onChange event and then .. make sure that SWFAddress is also inside the main content with its own onChange event.

  46. nagarajan says:

    wonderful tutorial lee,

  47. wiyono says:

    I have flash pro 8, can i make with swfaddress?
    please help me!
    i try to download your source, but don’t go…

    Pleaseee help me…

    Thanksss..

  48. Ody says:

    Greetings,

    I think the information you have on Adobe on how awfaddress is cool. However I have questions:

    1. How can I add buttons just like the one on the tutorial that could activate video so it will play when a visitor clicks on the thumbnails to play video on my site? When I mention buttons, I meant buttons like you have on the tutorial or if I may add, like the ones you find on “You Tube”

    I also will like to add uploader so visitors could upload their own videos as well to my site that could also generate clickable thumbnails.

    2. How can I create this uploader to achieve this goal and what else will it take or what plug-in software do I need to succeed?

    Thanks for your help.

    Ody.

  49. Stef says:

    @ Odrakir post 34:

    You’re right, it is indeed a problem. If you try to trace the onClick handler, it will fire twice. This is actually quite a big of an issue, so even though im a big fan of all the tuts here, I think the good Mr. Lee was a bit quick on this one.

    And like Andy M mentions; to all of you who cant get this to work, download and copy/paste the “com” folder into the default application folder, then it works.

  50. Jack Murphy says:

    @ Odrakir & @ Stef

    I just spent an hour trying to figure out why i was doubling up all my data….

    Did anyone figure out a better example?

  51. Thank you Lee, that tutorial was brilliant! Unfortunately, my site uses AS2 at the moment, but with a little bit of tweaking if works perfectly.
    I even wrote a tutorial on it for AS2, it’s at http://bit.ly/aI5QnW

    Cheers and keep up the good work!

  52. Jloa says:

    Hi, Lee.
    I wondered if u could make a tutorial for the SWFSize lib?
    Yeap, i can manage to do it myself, but, god, i like the way u do the tutorial ^_^

  53. Seth says:

    I can’t get it to work. I have checked (via trace) and everything inside Flash works properly, and it is tracing back the information it should just before SWFAddress.setTitle(e.value.substring(1)); , but it still isn’t doing anything.

    I downloaded your files and all movieclips were on top of each other, so I copied com and re exported it, that fixed the overlap, but it didn’t deep link like it should. I have no clue why. My only guess is that this method doesn’t work on version 2.4 maybe? I’ve tried it in multiple browsers and even uploaded to try it server-side. Still no luck.

    Any help would be greatly appreciated.

  54. Shiva says:

    @ Odrakir & @ Stef
    I think you have to change the [x]click methods, and let them only call the SWFaddress.setValue([section]).
    Then elaborate your onChange() handling to handle the full section changing process.
    IE : you have to make ANY navigation (by url/back/forth or inside the flash ui) the user make go through the swfaddress process.

    @Lee
    great starter though, thaks for the time you give for us all!

  55. Peter D says:

    @Seth

    The same here! I tried everything you did and deep linking doesn’t work.
    It seems at first, maybe version 2.4 is not compatible with tutorials version, but I tried several samples from Asual’s sample folder, and they don’t register any deep links.
    They all work when it comes to flash stuff, but with no deep linking in browser.
    I use Firefox and IE.
    Is it possible that some browser settings might cause this problem?

  56. Ryan says:

    OK… PROBLEM:

    SWFAddress is working fine while navigating through the flash file…
    Browser buttons also work fine when navigating through the flash file.

    Lets say you navigate to another URL, then go BACK to your flash file… well if your using IE-8, everything is broken, meaning none of the MovieClip Array’s are being referenced to be visible.

    How do you “listen” for the back button after the site has been left? It seems to cause trouble in the entire app if you repeat these steps… which a LOT of people will be doing while on the internet!

  57. Daniel D says:

    I have the same problem as Seth and Peter D. I could not make this work using the tutorial or the examples from asual. I even downloaded swfaddress 2.2 (suspecting that 2.4 might be different), but deep linking, back and forward, and title setting never worked.

    If anyone has any tips, I would really appreciate it.

    Thanks you.

  58. Daniel D says:

    To answer my own question:

    Turns out that everything works on my web server, but it doesn’t on my local machine. Is this a normal behavior or I have my settings wrong?

    Thank you

  59. Joe says:

    Hey all, as Daniel and Seth i cant get this to work. i didnt try it my web server but the examples from Asual in AS2 are working fine locally. so if anyone made it work or knows how to fix it please do let us know

    Thanks

  60. Sheila House says:

    Thanks so much! I was so happy that my Google search for a fix to my lack of understanding on this topic turned up a great tutorial. Aweeee-some

  1. [... I just uploaded a new tutorial that shows you how to enable direct and deep linking using the SWFAddress library. Deep linking is just another name for making the back ...]

  2. [... I just uploaded a new tutorial that shows you how to enable direct and deep linking using the SWFAddress library. Deep linking is just another name for making the back ...]

Leave a Comment