ZenPhoto is a pretty robust, but light weight photo gallery software. The front-end is pretty sparse, but the framework is excellent – meaning you can customize the layout in almost any way at the site, album, and image level without needing to hack the core source. One thing I needed to do was to change the CSS of individual galleries at the site level, which unfortunately you can’t do out of the box.
Luckily, I was able to find pretty quickly some functions in the admin-functions back-end that I was able to call in the template and integrate it fairly easily, all with ‘native’ code. So here’s what you would see when looking at a gallery by default:
<div id="albums"> <div class="album">...</div> <div class="album">...</div> </div>
Browse to your theme directory and edit index.php to look like the following:
<div id="albums"> <?php while (next_album()): ?> <div class="album" id="<?php echo seoFriendly(getAlbumTitle()); ?>"> … </div> <?php endwhile; ?> </div>
echo seoFriendly(); function is the key here, and in the end you’ll have something that looks like this:
<div id="albums"> <div class="album" id="escaped-album-title">...</div> <div class="album" id="another-valid-html-title">...</div> </div>
If all of your album titles are safe (no spaces, punctuation, special characters, etc…) then you could just use
getAlbumTitle(); but if they’re not, you won’t pass validation.