Pixaria Software
Pixaria Gallery includes support for customising the look and feel of the script with interface themes.
Themes are directories of images, HTML templates and JavaScript files located in the 'resources/themes/' directory of your installation. HTML template support is provided by the inclusion of the Smarty template engine in Pixaria Gallery. All HTML pages and e-mail messages are based on Smarty templates which makes it easy to modify your installation by creating your own versions of built in template files.
The structure of a theme directory is as follows:
| Directory | Description |
|---|---|
| css/ | Cascading style-sheets (CSS) files |
| images/ | Directory where images must be stored |
| javascript/ | Directory where JavaScript files must be stored |
| templates/ | Directory where template files (*.html) are stored |
Theme support in Pixaria only allows you to customise any aspect of the front end of the Pixaria Gallery software. The back-end themes, located in '/resources/templates_admin/', should NOT be edited as this is likely to break the script and such changes are not supported.
Theme support differs from many other PHP scripts, because the script template system is based on default templates located in resources/templates_default which are always used unless the user has provided any custom HTML template files in a custom theme directory.
As an example, the default theme that comes with Pixaria (which is called Charcoal) doesn't include any template files. This means that the script defaults to using the built in 'default' template files instead.
The reason for this approach is so that a working theme directory only needs to contain template files that you want to be different from the defaults. Thus if you only want to change the site's CSS files, you will only need to include CSS template files in the template. This makes upgrading easier because you always know which of your custom theme templates are different from the defaults.
To make a custom theme, all you need to do is to make a copy of the either the default 'Charcoal', 'Obsidian' or 'Snowflake' themes (give the directory a new name e.g. 'mytheme') and then select it from the drop down menu in the appearance control panel.
You can then customise any of the front end pages by simply making a copy of the relevant template file from the templates_default directory and putting it into the corresponding location in your customised theme directory.
For example, to make a customised version of the default homepage template file 'welcome/index.html', simply make a copy of the file and put it into your custom theme directory 'mytheme/templates/welcome/index.html':
.../resources/templates_defult/welcome/index.html
And put this into:
.../resources/themes/mytheme/templates/welcome/index.html
If Smarty template caching is turned on in the Appearance Settings ontrol panel you will need to flush the template cache before you can see changes to your custom theme.
Theme template files in Pixaria (files with names inding in .html) are plain text files containing either HTML or CSS (cascading style sheet) interspersed with Smarty tags which are enclosed in curly braces {}.
Note that in the front end templates, you will see language substitution codes in place of text. This is used to load the correct language text for display to the end user. You can read more about this here.
An example of some Smarty template tags that you might see in a template file are shown here:
{if $image.basic.model_release}
This image has a model release
{else}
This image has no model release
{/if}
The code above checks whether the 'model_release' property of an image is true or false and prints different text when the template is displayed depending on the result of the check.
If you want to create your own theme template files then you will need to use a text editor that won't change or alter the code in such a way that it breaks the template. I recommend using either BBEdit, Coda or Dreamweaver.
Modifying the colour scheme for a theme is a fairly simple process. Inside every theme folder, there is a file called color.css which contains the CSS colour codes for each part of the design and user interface in the front end. There are also several images that need to be customised to match the overall colour scheme of the new theme.
The key files that need to be modified when making a custom theme are (assuming you start with the Charcoal theme):
resources/themes/Charcoal/css/color.css
resources/themes/Charcoal/images/ui/masthead.gif
resources/themes/Charcoal/images/ui/sprite.png
This is likely because template caching is turned on on your installation. Pixaria caches template files to speed up the performance of the script which means that if caching is on and you change a template, you won't be able to see those changes when you try to view them.
Caching can be turned off in the admin control panel or if you just want to clear out the cache for a quick change, you can do this by clicking the link 'Flush Smarty Cache' at the bottom of the admin navigation.
Smarty is a very powerful and easy to use template engine designed for both programmers and non programmers. Full details of how to use Smarty can be found on the Smarty homepage.
The documentation is excellent and provides lots of examples of how to use useful concepts like sections and loops.