Drupal Flash Menu

So, I was designing and implementing a website at work and wanted to give it a flash menu, but also use Drupal for the CMS. Here is how I did the integration so that the flash menu would pull the menu links from Drupal’s “Primary Links” menu, know which page is currently selected and space the links evenly in the menu space provided. I Googled for a complete example and did not find one, so here is my attempt at a Howto.  Note: I used Drupal 6.2 and Actionscript 2.0, but this could probably be adapted for other versions).

First of all, you will need to create your flash menu. You can download my example flash file to get an idea of how this works. Let’s take a look at the ActionScript code:

Basically, this reads in the “flashvars” that we will be sending from drupal (read on below to see how to do this) and creates the menu from those. Once the menu is created, we see how well it fits in the space given (totalWidth) and adjust the spacing between each item. There is also some code in there to adjust the size of the “background” image for whichever menu item is selected.

Download Flash Menu

Once your flash menu is built, you will need to install the Flash Node module in Drupal. This allows for easily adding flash movies and flashvars variables. This same idea could be used in a template or a PHP page on it’s own, but Flash Node just makes this part a little bit easier.

After Flash Node is installed, you would simply need to add a piece of content that is of type flash (uploading the flash menu SWF file that was created earlier) and then add the following code in the Flashvars section

This just reads in the primary links and passes them off as flashvars

That’s pretty much all there is to it. Now you can have a dynamic flash menu using Drupal’s built-in menu management.

33 thoughts on “Drupal Flash Menu

  1. please let de download of the flash menu.fla be available.. because now I’can’t download it. Please send me it. I’m very curious.

    karel

  2. Hi,

    Sorry about the english, i’m not that good :-)

    i’ve downloaded and installed all the required files/modules.

    But can’t get this to work? Please, would you explain in short lines what i exatly have to do, to get this wonderfull menu to work?

    - Do i have to implement the menu in the template?
    - can i use your menu and my primary links to test your menu?
    - The flashvars: where do i put them? When creating a new flashnode??
    - etc…

    THX in advanced, any help would be great!
    If not, no hard feelings :-)

    greetz
    jack

  3. hello steve, thanks to fix the download..
    the only problem i have now is that I don’t get the menu-items into the flashfile (I’m using the flash node module)
    => is there an other way to try it to work?

    Thanks

  4. For those having trouble getting the flashvars section to pass the menu items to flash, make sure that the PHP evaluator option is enabled for the input format you are using in the flashvars section. You will also need the PHP filter module enabled to get the PHP evaluator option in the first place.

  5. Wow! That was really straightforward!

    Since I’m more familiar with d5, I’ll add this observation to #13 above: Drupal6 apparently provides the same PHP Filter we’re used to seeing but as a core module which is not turned on by default.

    Download the fla, ctrl-enter to compile, upload the swf, paste the php, enable the PHP filter, and voila, a working example!

    Thanks Steve!

  6. Just playing around here, so there may be a better way.. but sticking with Steve’s sample .fla and same php:
    - enable Flash Filter in PHP Evaluator under Input Types
    - Create a block, enable PHP on it, and throw it in the header
    – this block’s body will be a flashnode filter with Steve’s php for primary links:
    [flashnode|nid=1|flashvars=]

    Now you’ve got a live, working sample with the primary links in a header block! :D I guess more elegant would be to theme over the primary links… but what do I know?

  7. I see that this pulls in the primary links. Any thoughts or approaches on pulling in the second level menu items under each primary link?

  8. Any chance on porting this script to AS3? duplicateMovieClip and eval are no longer supported (as well as the scoping for the increment counter in your loops).

    I’d love to try out an AS3 version, but just not at that level with my AS3 yet.

  9. Nice tutorial

    Yet I have a menu with items which have children.
    Any idea about how to have the children displayed as well ?

    My idea would be to have them appear when hovering the parent item ( a classic feature in flash menus )

    thank you in advance

  10. Looks great, but I have a few questions before I implement it:

    How would this affect search engine crawlers that follow links to index the website?

    Also, if someone were looking at the site from, say… and iPad, how could I make the normal menu appear instead? Can I have the template check for flash and then determine whether to print the normal menu or the flash menu?

  11. Hi Steve! I download your .fla and I try it! It looks so great, everything works fine except the “TextLink” MovieClip animations when try to change the textcolor with the onRollOver function. Do you have any idea why it’s doesn’t work for me? I use Drupal 6.20.

    Thanks Steve

    • vic, basically, the idea is that you would need to get an array of the menu items. menu_primary_links(1) was the way to do this in Drupal 5 for the primary menu links. It looks like this thread may at least start you in the right direction for getting a custom menu in a similar fashion to the primary menu http://drupal.org/node/112735

  12. I read a lot of interesting posts here. Probably you spend a lot of time writing,
    i know how to save you a lot of time, there is an online tool that
    creates readable, google friendly posts in seconds, just type in google – laranitas free content source

  13. Huh? Just makes me realize how all my children (not:All My Children) have passed and surpassed the capabilities of at least one of their parents.
    I am in awe……

  14. Excellent tutorial. I have been looking for some help in this area. I implemented it using LoadVars instead. I just had the LoadVars function call a php page containing your above php and loaded the values in that way. Thanks for sharing !!

  15. Thanks, been looking for something like this.
    What version of Flash was your demo made in?
    It wont open in my flash 8.
    If i know what version, i will visit a friend.

    Cheers

  16. Hello! Im trying to have a FLASH menu in my drupal 6.9 site (www.adelacasacuberta.com) with links to all contents (pages, images, etc…) I uploaded your sample falsh file and put the php code in the flash vars section of a new flash node. But I only see a red graphic over a withe boackground, and no links or buttons of any kind. What Am i doing wrong? thanx !

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">