Loading...
 
Skip to main content

History: Three Ways to Make a New Theme

Source of version: 2

Copy to clipboard
            ''(from http://doc.tikiwiki.org/tiki-index.php?page=Styles and Themes)''
{maketoc}

! Creating 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)

!! File arrangements 
^In Tiki discussions and descriptions, the terms ''style'' and ''theme'' are used pretty interchangeably, though there are places where one word is always used, such as ''styles'' in the file directory.^

First, establish the basic file arrangement of your new theme.

# Pick a name for the theme.  Check the ''styles'' directory to make sure there's not an existing theme (i.e., *.css file) with the same name.  
**For this example, we are creating a theme called ''screensite''.
# Create a new CSS file with the theme name you chose and place it in the ''styles'' directory (like ''styles/screensite.css''). (See ((CSS Overview)) for more details.)
# If your new theme uses customized templates, create a sub-directory in the ''templates/styles'' directory and give it the same name as your theme (like ''templates/styles/screensite'').
# Copy any needed files from the ''templates'' directory or from an existing theme's templates directory to your theme directory. 
** For example, if you are basing your new theme on moreneat, copy the files from ''templates/styles/moreneat'' to ''templates/styles/screensite''. Otherwise use copies of default template files. See ((Template Overview)) for more details.

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: [http://themes.tikiwiki.org/tiki-index.php?page_ref_id=5|Template Overview]
[http://themes.tikiwiki.org/tiki-index.php?page_ref_id=7|CSS Overview]

-=Related Information=-
! 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 [http://doc.tikiwiki.org/tiki-index.php?page=Modules|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
[http://tikiwiki.org/tiki-index.php?page=ThemeControlDoc |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

Advanced
Information Version
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