This wiki uses a JavaScript to automatically load themes. Here's how it works:
Loading CSS[]
Sub-pages of Themes , e.g. Themes/Chalkboard will automatically load a style sheet stored in Themes/Chalkboard/theme.css.
On demand loading[]
The JavaScript creates a button to enable loading the css. This is generated if the page contains the code below.
Syntax[]
To generate the button on any page write the following code:
{{Load theme|page with css}}
- The theme page (with css) must contain the page name, e.g. "Infobox/theme.css"
- The css class must be lower case
A button with the label "Load themes" will then appear.
Example[]
{{Infobox/Theme |title = Chalkboard |theme-source = chalkboard |family = School |authors = [[User:Robcamstone]] |code = [[Themes/Chalkboard/theme.css|CSS]] |type = nocat}}
{{load theme|Themes/Chalkboard/theme.css}}
Page and CSS naming[]
Page Structure[]
Infoboxes[]
- Create a page for the description (e.g. Chalkboard) as a sub-page of the Themes page, e.g Themes/Chalkboard
- Add the Template:Infobox/Theme template (see the template for syntax) to the created page along with theme information
- Store the CSS in the "themes.css" sub-page of the theme, e.g. "Themes/Chalkboard/theme.css"
Naming CSS classes[]
- Make sure they are always lower case, e.g. ".pi-theme-chalkboard"
- Avoid spaces
- Reduce or avoid special characters e.g. "™, $"