How to create a MiniGallery theme

Every theme must contain at least the following components:

In reality most themes are likely to contain a lot more, but that's the bare minimum.  Let's look at the most simple example, using only these three files.

A simple example 

Header.php

This contains the first part of your template.  Exactly how much is included in this file is up to you - in theory you could leave this and footer.php completely blank and do it all from index.php - but splitting it up this way ensures your code is easy to understand.  Let's look at an example header.php file:

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3.   <head>
  4.     <meta http-equiv="content-type" content="text/html;charset=utf-8" />
  5.       <title>My MiniGallery</title>
  6.     </head>
  8.     <body>
  9.         <h1>My MiniGallery</h1>

Clearly you can put a lot more information in your html header if you want to, like including stylesheets and meta data, but for now let's stick with this simple example.  You will notice that there doesn't have to be any PHP in there at all yet.  Just make sure it's still called header.php.

Index.php

This is where all the clever stuff happens.  There are two useful functions available to you that determine whether you are viewing an album or an image: isAlbum() and isImage().  The contents of index.php generally follows this pattern:

if !isAlbum() { /* i.e. if we are not looking at any album */
  show home page
} else if !isImage() { /* i.e. we have selected an album but not an image */
  show thumbnails of images in this album
} else { /* i.e. we have selected an album and an image */
  show image preview
}

The exclamation mark means 'NOT', incidentally.

Again, here is a simplified example showing some code for index.php, no frills but should show you how it all fits together:

  1. <?php if (!isAlbum()) { ?>
  2.   <h1>Welcome to my gallery</h1>
  3.   <p>Here is an introduction to my gallery.  All images are protected by copyright.</p>
  4.   <h2>My albums</h2>
  5.   <ul>
  6.     <?php getAlbums(); ?>
  7.   </ul>
  8. <?php } else if (!isImage()) { ?>
  9.   <h1><?php getAlbumName(); ?></h1>
  10.   <p><a href="?">Back to gallery home</a></p>
  11.   <ul>
  12.     <?php getThumbnails(); ?>
  13.   </ul>
  14. <?php } else { ?>
  15.   <h1><?php getImageTitle(); ?>
  16.   <p><a href="?">Back to gallery home</a></p>
  17.   <p><?php getImageDetails(); ?></p>
  18.   <p><?php getPreviewImage(); ?></p>
  19. <?php } ?>

Footer.php

This finishes off the template, putting in the bottom of the page.  Here is an example:

  1.     <p>Powered by <?php getVersion(); ?></p>
  2.   </body>
  3. </html>

This puts a footer on the bottom of the page, showing the version of MiniGallery you are using, and including a link to this web site.  This isn't essential, but it would be nice if you recognised that the theme is using MiniGallery!

Taking your theme further

If you're going to create a more complicated theme than the one shown above (which is recommended, the one above isn't all that nice to look at!), you'll probably want to divide things up a bit to make it easier to manage.  To do this you will need to include those extra files using a php call similar to this one:

  1. <?php include(getThemeDir.'otherfile.php'); ?>

Or, in the case of a stylesheet, something like this:

  1. <link rel="stylesheet" type="text/css" href="<?php echo getThemeDir(); ?>style.css" />

It's entirely up to you how you divide it up, but here is a recommendation:

Take a look at other themes to see how other people have done theirs, or just get creative and work out something that works for you and your theme.  Bear in mind that you can include the thumbnails as many times as you need, in as many places as you like, just by calling getThumbnails().

For further details on what functions are available to you, and their behaviour, take a look at the MiniGallery API.