Just recently I did some WordPress development work for a graphic design company. I thought their portfolio section was quite nice and used a few custom NextGen Gallery templates to pull it off. Here’s how I did it (mostly so I can do it again easily, but I hope this might help someone else too!).

Here’s a screenshot of the finished album:

NGG Custom Album

And here’s one of the galleries:

NGG Custom Gallery

(This post assumes you’ll need both Albums and Galleries, if that’s not the case, skip ahead as needed.)

After setting up each of the galleries and the album in NGG with some sample photos, I made two custom templates based off the existing NGG ones: album-clientname.php from album-extend.php, and gallery-clientname.php from gallery-caption.php. To make these, open the NGG plugin and you’ll find the original templates in the /view folder. Copy them and paste them into a new /nggallery  folder in your theme, then change the names as needed. Don’t forget to then go to the album and gallery pages in your site and change the shortcode to match the new template names:

[ album id=1 template=clientname] and [ nggallery id=1 template=clientname]

You’ll remove that extra space between the opening bracket and the first word in your own shortcode.

Here is the code for album-clientname.php:

And the code for gallery-clientname.php:

I didn’t change them too much; in the gallery template I removed some unneeded code and added a container around the alttext (which I’m using for the title on top of the thumbnail). In the album template, I removed the photo number and moved the album title, again adding a container to make it easier to style with CSS.

Here are the styles for the album – pretty simple:

Here’s the styling for the galleries:

For the gallery, I also needed to use a modified page-title on those pages that would show over the header image:

I made a new page template called page-galleries.php to use for the gallery pages so I’d have a body style I could hook into.

All in all this took about an hour to do, start to finish. I think it’s a nice-looking portfolio and I hope you find this useful!

NextGen has been my go-to gallery for WordPress for quite a long time. Very easy to use for my clients, and super-easy to customize. But the included lightbox scripts are not so great-looking.

I recently started using Easy FancyBox to replace those scripts. If you go to Options > Effects under NextGen and select ‘none’ for the JS Thumbnail effect, you can then tweak Easy FancyBox under Settings > Media. It looks great right out of the box (so to speak) and has some nice options for fades and titles.

Here’s an example of NextGen with Easy FancyBox from a recent project.

I’d had a hard time finding a current plugin for WordPress that would give my client an easy to manage slideshow with pan/zoom (Ken Burns) effects. I tried all that were listed with varying degrees of success. The slideshow needed a WordPress plugin so it would be dead simple for my client to edit and add more slides.

Monoslideshow optionsHappily, I found a Flash alternative that’s integrated into NextGen Gallery, one of my long-time favorite plugins. Monoslideshow is not free, it comes out to about $37 right now in US funds, but the NextGen Monoslideshow plugin is free and takes about 1 minute to setup. You only need to FTP the .swf file from the downloaded program to your /wp-content/uploads/folder and it’s ready to use.

The Ken Burns effects available are Random, Pan, Zoom and 3D. Random looks great for my client’s needs.

Once Monoslideshow is set up, all you need to do is create a gallery in NextGen like normal, but when you paste the shortcode change it to look like this:

[monoslideshow id=1]

With a $37 investment and a total of 18 minutes I was able to complete this task and it looks great – here’s the finished slideshow, tested in FF, Chrome, Safari/Win, Opera and IE 7-9.

I just upgraded WP (yes, I know I should have done this a few weeks ago) and my NextGen-driven portfolio disappeared. That scared me for a minute until I discovered it had deactivated during the upgrade.

I’ve added two new projects to the portfolio and hope to be adding another later this week. I was incredibly busy over Thanksgiving working on a WordPress pet project that I hope to launch very soon. Fun, but it seems to be going so slowly.