Using a Flash Logo in Drupal

Thu, May 28, 2009 by Steve

Sometimes we may want to use Flash rather than an image for the site logo. To achieve this in Drupal, we can make use of the SWFObject javascript library. Modify page.tpl.php, and in the place where an image logo is displayed, replace with the following code:


<div id="my_flash">
   <!-- display an image in case javascript is not enabled -->
   <img src="<?php echo $base_path.path_to_theme(); ?>/images/myflash.jpg" width="200" height="200" alt="Flash">
</div>
<script type="text/javascript">
   var flashvars = false;
   var params = {
         WMode: "transparent",
         quality: "high"
      };
   var attributes = false;
   swfobject.embedSWF("<?php echo $base_path.path_to_theme(); ?>/flash/myflash.swf", "my_flash", "200", "200", "9", "", flashvars, params, attributes);
</script>

Change the Flash settings (e.g,. file path, display size), to suit your needs. Don't forget to include swfobject.js in page.tpl.php. For details about SWFObject (e.g., where to download and how to use the 'embedSWF' method), please check out http://code.google.com/p/swfobject/wiki/documentation and the section, 'How to embed Flash Player content using SWFObject dynamic publishing'.

Anonymous posted on November 25, 2009 8:46 pm

For the performance issues - performance could probably be improved if the scripts were tagged with a "defer='defer'" attribute...and for good measure, add settimeout/object-existence checking to make sure the code will run when it's all loaded properly.

Michelle posted on June 3, 2009 9:10 pm

I love it when Advomaticians show up at our blog. Thanks for the tip!

dalin posted on May 31, 2009 7:56 am

It should be noted that in-line scripts are not good for front-end performance. They block rendering of the page and downloading of additional components. You'd be better off with moving the script to an external file and using jQuery's document.ready or Drupal's Drupal.behaviors

Post new comment

The content of this field is kept private and will not be shown publicly.
  • Web page addresses and e-mail addresses turn into links automatically.
  • Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <img> <h2>
  • Lines and paragraphs break automatically.

More information about formatting options