PyroCMS supports themes which allow you to easily change the look and feel of your web-site. The way it works is with a master layout file and multiple partials that share presentation logic between different layouts.

Creating a theme

Like modules, themes are stored in three places: addons/shared_addons/themes (for themes available to all sites) & addons/<site-name>/themes (for themes available to only one specific site),  system/pyrocms/themes (for default themes).

To create your first theme it is a good idea to look at the default theme and see how it works. You might even like to copy it and tweak it to create your own. The default theme is a "core theme" so it is located in system/pyrocms/themes/default. Copy that to addons/shared_addons/themes/custom or whatever name you like. Whenever you rename a theme folder you must rename the class name in theme.php to match the folder name.

Supported Folders

• css
• img
• js
• views
• views/layouts
• views/partials
• views/modules

theme.php

Each theme has it's own information. Author, version, web-site, etc. This file is located in the root of each theme, here:

 addons/shared_addons/themes/my-theme-name/theme.php

or

 addons/<site-ref>/themes/my-theme-name/theme.php

No real PHP experience is required to edit this file, just remember to change the last part of "Theme_Custom" to match your folder. It must always start with "Theme_" and then have the folder name with the first letter capitalized. As mentioned below in the Theme Options section the "public $options" array is optional. If you do not want to add options, simply remove that section.

Theme Options

This feature is optional and may not be necessary for simple themes but for more complex themes it is can be very helpful. The options defined here are accessible in the admin panel via CP > Design > Themes > Options. If you are creating a theme and add another option to theme.php just click the Re-index button in the Options window. This will load the latest options from your theme.php file into the database.

The available form types are:

• radio
• checkbox
• select
• select-multiple
• text
• textarea
• password

If we were to use a tag to access this example it would look like this:

{{ theme:options option="layout" }}

And it would output either "2 column" or "full-width" depending on the selection in the dropdown in the admin panel.

screenshot.png

So you can see a preview of your theme in the CP > Design > Themes area you will need to create a screenshot.png and place it in your theme folder.