Create a new theme

From FUDforum Wiki
Jump to: navigation, search

FUDforum has full template support with a FAST template compiler, making it one of the fastest (if not the fastest) PHP forum in existence today. The price to pay for this is that template changes are not immediately visible and must be compiled or rebuilt from the Theme Manager admin control panel. To make it easier for users, an on-line Template Editor is provided that will automatically rebuild themes after users make template changes.

Contents

Create a new theme

Follow these easy steps to create a unique custom theme for your forum:

1. Change to your forum's /data/thm directory.

cd forum/data/thm

2. Create a new folder for your theme, say "mytheme".

mkdir mytheme

3. Copy the files you want to change from the default theme directory (please do not copy everything!). For example, if we only need a different CSS file:

mkdir mytheme/tmpl
cp default/tmpl/forum.css.tmpl mytheme/tmpl/

4. Edit the copied files, and apply your changes. Also, remove all sections ({SECTION:...}) that you haven't changed for your theme.

5. Navigate to your forum's Admin Control Panel-> Theme Manager Enter your theme's name, say "mytheme", select "mytheme" as the "Template Set" and select both "Default" and "Enabled". When done, click "Create".

6. Click "Rebuild all Themes" and return to your forum to see the changes.

Changing colours

Edit forum.css.tmpl file with a text editor or use the admin control panel to edit the forum.css template. This is the forum's style sheet. Look for the hex colour codes, which start with a #xxxxxx. Just plug in different hex codes to change colours of fonts and such. One can use GIMP, a free graphics editor's colour dialogue to pick and test hex codes.

Gradient images

The stripes that go across the screen are actually thin little *.png graphics files that repeat a bunch of times to look like a stripe. They are usually named tableHeaderbg.png and tableHeaderbg2.png.

You can copy these images to your PC and change their colours with a graphics editor like GIMP. Select the "gradient/blend tool", pick two colours and drag it over the image. The net result is an image that starts with the first colour and gradually fades into the next. A simple 1 min job.

This may help if you want to create your own - http://www.tankedup-imaging.com/gradient.html

Also see

Languages
Personal tools