Skip to content
Spuds edited this page Jan 26, 2023 · 2 revisions

DEVELOPER DOCUMENTATION > Themes

Themes

You can customize the look and feel of the forum by themes. The following steps will create a new theme, called NewTheme:

  1. In admin panel, Themes and Layout, choose 'Create a copy of the default theme named:' and add NewTheme. You will find the new theme in your /themes/NewTheme directory.
    You can also copy manually the default theme, /themes/default, to a new theme. You will then need to install it: choose 'install from a directory on the server' to install your theme.

  2. Start customizing your theme.
    You can change the css files in NewTheme/css directory. ElkArte default theme has two color variants: Light and "Be social". All the structural (i.e. the css that defines the position of the elements on the page) css goes into index.css, and all variants use the css defined here. The css in the variants define the color schemes and the bells and whistles (borders, background images, gradients, etc.). index_light.css is the light variant, the default look and feel of ElkArte. index_besocial.css contains a basic color variant which we recommend to start with: it has all the elements, styled simply, so you can change them on place and add tweaks to.

  3. Customize templates.
    You can change the markup, the sections displayed, by changing the templates files in themes/NewTheme/*.template.php. You can insert code in layers, which are loaded and inserted by ElkArte core in the positions specified by the layer name.

  4. Customize images.
    Images are in themes/NewThemes/images. You can change them to suit. Make sure you keep the file extensions (unless you want to adapt the code to different image file types).

  5. Credit yourself.
    Credits can be added to the package-info.xml with the credits tag, like so:
    <credits url="www.example.com" license="BSD 3" copyright="Example Copyright">Example Copyright</credits>

This page is a stub. Please help improving it.

HOME > TECH GUIDES

Architecture

Functions and Variables

  • About $user_info variable
  • About the createList() function.
  • About [Template Layers](Template layers).
  • About [is_activated](is activated) values.

Customization

  • [Create a theme](Make a new theme)
  • [Create an Addon](Create an Addon)

GitHub

Clone this wiki locally