You are Here: Reverb Studios | Blog | How to Guides | Using NextGen to Power an Animated WordPress Header

Using NextGen to Power an Animated WordPress Header

I’m annoyed this hadn’t occured to me before today despite having used WordPress and the NextGen Gallery plugin for years now! I was just about to knock together a custom flash header for a wordpress site and client who wanted a few banner images rotating to liven up his site when I realised it might be possible to do it easier with NextGen AND give the client the ability to change images himself directly from the wordpress admin.

Here’s how to do it:

With a recent version of standalone WordPress and the NextGen Gallery plugin both installed and activated and using a HTML editor like Dreamweaver, try to locate the lines/div’s in your WordPress template’s Header.php file or Stylesheet that control the template’s banner image sizing and position. Inside this div replace the existing image code with the following NextGen php hard code and upload to the server:

<?php echo do_shortcode('[Gallery not found]'); ?>

Replace “Gallery not found” with “slideshow id=x” where “x” is the ID of the gallery/slideshow you wish to display.

If you just want to display the slideshow on the home page, use this code:

<?php if ( is_front_page() ) {
echo do_shortcode('[Gallery not found]');
}
?>

This gallery should be created beforehand using images that match precisely the dimensions of the template’s existing banner image.

Next, go to the NextGen options in wordpress and specify slideshow dimensions that match the width and height of the template banner image. You can specify other options here such as order, image display time, next/previous controls, etc..

That’s it! Refresh your front end and hopefully you now have a flash banner!

Here’s an example of it working – www.Gaelink.ie

Leon.

This Article has had 32,244 views so far.

Posted in How to Guides on May 28th, 2010
Tags: flash banner, nextgen gallery, wordpress gallery plugin
Follow responses to this article through the RSS 2.0 feed.
leave a Comment, or Trackback from your own site.

About Reverb Studios Design

Reverb Studios is an affordable Web & Digital Design studio based in Leitrim, Ireland and specialising in Wordpress Website Design, Graphic Design and Photo Editing.

Get in touch..

http://www.kmcgraphics.com Kieran McCarthy

Thank you so much for this article! You have saved me tons of time trying to sort out the NextGen/Wordpress header slide-show. Your solution is simple and works really well.

Cheers

Kieran
Stefan

Thank you very much Leon. The solution worked like a charm and saved me a lot of trouble.

And just one tip for those in need of your solution: do not simply copy-paste Leon`s code, since the ” ` ” (apostrophe) character will be pasted into the source editor as ” ` ” (grave accent character) and the code will fail.

Best!
- Lenka
  
  Thank you Stefan! This saved me, I was about to hard code the whole gallery or something
  And thank you Leon!
  
  You brought happiness to my life again
- http://www.reverbstudios.ie/ Leon Quinn
  
  Fixed the apostrophe issue, you can copy direct now. Also added code for only displaying on the home page..
sirius

Kudos to you sir I really appreciate the tip. Cheers!