Loading...
 
Features / Usability

Features / Usability


Re: would like help understanding how to change tiki's look

posts: 4656 Japan

To be more specific, the basic layout of Tiki's pages are determined by the template files. Tiki's tiki.tpl puts together a page with the top bar at top, a middle section with left, center and right columns, and a bottom bar. You can modify this file by, for example, moving the right column under the left column, etc. (For special purposes, I modified a renamed tiki.tpl to display only the center column, without side columns or top and bottom bar, for example. I load this into iframes for certain uses, etc.) Each of the "sub-templates" can also be modified. You can change the look of the top of the page by modifying tiki-top_bar.tpl, for example. There is a diagram on this site showing how the template files "nest" within a page to make up a Tiki page. Maybe do a search here for theme creation, etc.

(You won't need to alter any php files, if you don't need a change in functionality.)

The various themes' looks are further determined with cascading style sheets. I believe such things as positions and dimensions are meant to be determined as little as possible by the templates themselves, leaving this as much as possible to CSS files. Of course font sizes and styles, background images, box border treatment, and so on are all set by the theme's style sheet.

The standard recommendation is to start with an existing Tiki theme that is closest to what your desired new theme looks like. I think this is especially important in terms of text and background color. It's often hard to track down all the contrast problems when you start changing these colors, so if you start with a theme that uses a contrast scheme you like already, then that's one thing you won't have as many problems with at the fine-tuning stage.

Look at the ./styles/ and ./templates/styles/ directories and their subdirectories to see how the existing themes' files are. Copy and rename a stylesheet file and make a like-named directory for any images you'll need for it. You'll need to add your own new directory under ./templates/ for any modified template files that your theme requires.

-- Gary

There are no comments at this time.