leafChat themes

Theme files

A theme is a single file with a name ending in .leafChatTheme.

Installing themes

The easiest way to install a theme is to click the Install... button. You can then select a .leafChatTheme file. The file will be checked to make sure it's a valid theme, and then installed. You should see it appear on the theme list immediately.

Theme locations

You can also install themes manually if you like, although this isn't recommended since your theme won't be checked before it is installed. (If there is an error in the theme, this will of course still be displayed at some point.)

leafChat will recognise a theme if you put it in one of the following locations:

You don't have to restart leafChat to install a new theme, even if you do it manually. Once you put the theme in place, close and reopen the Options window. Your theme should be listed in the Themes page and you can select it for use.

Creating new themes

Intended audience

You need a reasonable degree of technical knowledge to create new themes for leafChat – you don't have to be a programmer, but you must be comfortable with editing text files.

Be careful

Getting started

The first thing you need to know is that themes are actually zip files. In order to create a theme all you need to do is get a collection of files, zip them up, and rename the zip to .leafChatTheme.

The best way to understand themes is to start with an existing one. If you don't already have it, download the Stars and Hearts theme (stars.leafChatTheme). Install the theme as above and select it to see what it does. Then make a copy of the theme and rename the copy to end in .zip. You should now be able to unpack the theme and see what's inside.

Theme contents

Detailed explanation of theme.xml

Here are some sections from the theme.xml in the Stars and Hearts theme.

<theme>
 <meta>
  <name>Stars and hearts</name>
  <description>A night-time theme in yellow and pink.</description>
  <authors>Samuel Marshall</authors>
 </meta>

The theme opens with a <theme> tag. This tag encloses the whole theme.

After that, the <meta> tag contains metadata – information about the theme.

 <connectButton>
  <normal>connect.png</normal>
  <hover>connect.heart.png</hover>
  <pressed>connect.png</pressed>
 </connectButton>

The <connectButton> tag defines images used for the Connect button.

Each image filename refers to a PNG file included within the theme. This theme re-uses the same image for two button states, but you can provide different images if you want.

To ensure the program looks good, it's best to make your images 48 by 48 pixels.

If you don't include this tag, the Connect button will use its default images. If you do include it, you should specify all three images (otherwise one will be left default, which is probably confusing).

So that's the Connect button; all the other toolbar buttons work the same way.

 <toolbar>
  <tilePic>toolbar.png</tilePic>		
 </toolbar>

This defines the image used as a tiled background on the toolbar. The image will be tiled horizontally. It should be 82 pixels high, and can be any width, but something like 100 pixels is probably sensible. (Since this image doesn't need to be transparent, you can use a JPEG file instead of a PNG if you prefer.)

If you don't include a <toolbar> section, leafChat will use your operating system's default background colour.

	
 <channel>
  <topPic>top.png</topPic>
  <topLeftPic>topstar.png</topLeftPic>
 </channel>

This section controls how channel windows appear. You can place images along the four sides of the window (top, left, bottom, right) and in the four corners (topLeft, topRight, bottomLeft, and bottomRight.)

The side images are drawn first. These images are tiled along the edge of the window. After that, the corner images are drawn on top.

Other window definitions, most notably <message>, work in the same way.

</theme>

You've got to include a closing tag to finish off the theme file.

Tips

Zip trouble?

If you're having trouble making a theme work, it could be because you aren't zipping it correctly. Zip programs with graphical interfaces often do things you don't expect, such as putting all the files within a folder in the zip. This means the theme won't work.

The most reliable way to ensure that your theme is zipped correctly is to use a command-line tool. On Linux and OS X, this is already provided; if you use Windows you will have to download the zip command-line tool from Info-ZIP. Once you have the program (zip.exe), put it somewhere on your system's PATH. (If you don't know how to do all this, please ask a friend who knows computers to help.) Then you can use it to compress themes:

  1. Run a command prompt.
  2. Use cd to change into the folder that contains all your theme files. For example, if you type dir, you should see a list of the files including theme.xml.
  3. Type zip ../mytheme.zip *. This will create a zip file called mytheme.zip in the parent folder, containing all the theme files.
  4. Rename the zip file to leafChatTheme, for example with the command: ren ../mytheme.zip ../mytheme.leafChatTheme (the command given is for Windows. On other platforms, use mv instead of ren.)