Loading...
 
Skip to main content

History: Three Ways to Make a New Theme

View published page Collapse Into Edit Sessions

Preview of version: 1

(from http://doc.tikiwiki.org/tiki-index.php?page=Styles and Themes)

How To Create a Custom Theme


Tiki themes control both the layout or structure of a site and its overall look. You can alter the position of elements on your Web pages (adding/subtracting components) and you can modify stylistic elements like color and font. Thus, by creating or modifying a theme, you can define:

  • The application layout (basic structure)
  • The presentation of elements in the layout (style)

Layout

Within Tiki, the terms style and theme are used pretty interchangeably.

First, you'll need to create the basic layout of your new theme.

  1. Pick a name for the theme. Check the templates/styles directory to make sure there's not a pre-existing theme with the same name.
    • For this example, we're going to create a theme called screensite.
  2. Using your new theme name, create a sub-directory in the templates/styles directory.
    • For example, create templates/styles/screensite.
  3. Copy the files in a pre-existing theme's directory to your theme directory.
    • For example, copy the files from templates/styles/moreneat to templates/styles/screensite.
  4. Using the theme name you chose in the first step, create a .css file in the styles directory and copy the contents of the pre-existing theme's .css file into it.


At this point, your new theme has been created! If you go to User Preferences and check the drop-down menu for Theme, you'll find your theme listed (e.g., screensite). But, without changing the TPL files, your new theme will look just the same as the pre-existing theme you based it on.

See next: Template Overview
CSS Overview

Allow User to Set Theme

Under Admin > Login you can activate "Reg users can change theme".

Once activated users can change their theme in their Preferences page under My Tiki menu.

Under Modules you can also activate the switch_theme module which makes it super easy for users to change themes.

Using multiple Themes / Styles on your Tiki site

ThemeControlDoc on Tikiwiki.org is all about how to assign Themes to

  • A tiki category
  • A tiki section
  • A tiki individual object (i.e. an individual Wiki page, Blog, Gallery, etc.)


If you enable the theme control center you will see a link to Theme Control in the Admin section of the application menu.

History

Information Version
06:17 GMT-0000 System Administrator automatic conversion 19
Mon 13 of Feb, 2023 08:37 GMT-0000 Gary Cunningham-Lee Replaced class card-default with card-primary and removed unnecessary HTML plugin. 18
Mon 13 of Feb, 2023 08:34 GMT-0000 Gary Cunningham-Lee Updated panel class to card class; replaced Less link with SCSS link. 17
Tue 26 of Jan, 2016 08:45 GMT-0000 Gary Cunningham-Lee Added tags. 16
Tue 26 of Jan, 2016 07:48 GMT-0000 Gary Cunningham-Lee Updated for Bootstrap methods 15
Mon 20 of Apr, 2015 14:30 GMT-0000 Gary Cunningham-Lee 14
Mon 20 of Apr, 2015 10:03 GMT-0000 Gary Cunningham-Lee Corrected Bootstrap customize URL. 13
Fri 03 of Apr, 2015 14:35 GMT-0000 Gary Cunningham-Lee More details added. 12
Fri 03 of Apr, 2015 14:29 GMT-0000 Gary Cunningham-Lee Updated with Tiki 14 information. 11
Sat 23 of May, 2009 05:03 GMT-0000 Gary Cunningham-Lee 10
Tue 27 of Jan, 2009 12:18 GMT-0000 Gary Cunningham-Lee Some updating. 9
Thu 12 of Jul, 2007 03:57 GMT-0000 Marc Laporte fix link 8
Mon 23 of Jul, 2007 14:05 GMT-0000 Gary Cunningham-Lee 7
Mon 23 of Jul, 2007 14:01 GMT-0000 Gary Cunningham-Lee 6
Thu 12 of Jul, 2007 03:57 GMT-0000 Marc Laporte fix link 5
Mon 20 of Feb, 2006 03:47 GMT-0000 Gary Cunningham-Lee Minor edits. 4
Mon 20 of Feb, 2006 03:46 GMT-0000 Gary Cunningham-Lee MInor edits. 3
Mon 20 of Feb, 2006 03:13 GMT-0000 Gary Cunningham-Lee Content clarified. 2
Fri 17 of Feb, 2006 07:04 GMT-0000 System Administrator 1