As a skin author, you're free to structure your skin however you see fit. Through much trial and error though, we've found a structure like the one described below to be the most flexible way to approach building a Nova skin.
Root folder
_global
- files used across multiple sections of the skin; you can name this directory whatever you want, but we've found_global
to be the best optionadmin
– files specific to the admin section of Nova; this directory cannot be renamedlogin
– files specific to the login section of Nova; this directory cannot be renamedmain
– files specific to the main section of Nova; this directory cannot be renamedwiki
– files specific to Nova's wiki; this directory cannot be renamedpreview-admin.jpg
– a preview image of the admin section (only used when selecting a skin); this image must be in the root directory of your skin and cannot be renamed or Nova will not be able to show a preview of the skin section to userspreview-login.jpg
– a preview image of the login section (only used when selecting a skin); this image must be in the root directory of your skin and cannot be renamed or Nova will not be able to show a preview of the skin section to userspreview-main.jpg
– a preview image of the main section (only used when selecting a skin); this image must be in the root directory of your skin and cannot be renamed or Nova will not be able to show a preview of the skin section to userspreview-wiki.jpg
– a preview image of the wiki section (only used when selecting a skin); this image must be in the root directory of your skin and cannot be renamed or Nova will not be able to show a preview of the skin section to usersskin.yml
– the QuickInstall file used by Nova to install the skintemplate_admin.php
– the base HTML structure of the admin section (this file must be in the root directory of your skin and cannot be renamed or your skin will not work); see here for more information about skin templatestemplate_login.php
– the base HTML structure of the login section (this file must be in the root directory of your skin and cannot be renamed or your skin will not work); see here for more information about skin templatestemplate_main.php
– the base HTML structure of the main section (this file must be in the root directory of your skin and cannot be renamed or your skin will not work); see here for more information about skin templatestemplate_wiki.php
– the base HTML structure of the wiki section (this file must be in the root directory of your skin and cannot be renamed or your skin will not work); see here for more information about skin templates
Section folders
ajax
- files that should be used to replace system Ajax files for your skin only; this is part of the seamless substitution systemcss
- CSS files used for the changing the look of the skin sectionimages
- any images used for the skin sectionjs
- files that should be used to replace system JavaScript files for your skin only; this is part of the seamless substitution systempages
- files that should be used to replace system view files for your skin only; this is part of the seamless substitution system
Overriding pages from a skin
While the best way to override a specific page is using the _base_override
folder, you can also override pages from your skin as well. This is helpful if you want your skin to make specific changes to a page that are only unique to your skin. See the seamless substitution documentation for more information about this process.
Images
The best practice to follow when adding images to your skin will depend on how you plan to use the image.
Generally speaking, if the image is going to be accessed by multiple sections of the skin, we recommend using the _global
directory. This can include a skin's header image, a logo, or any other asset(s) you'll use throughout the user interface. If you'll only use the image in a specific section of the skin, it's probably best to place it in the relevant section's images
directory.
A tip about images
Images can take up a lot of space on your web host's server, using up resources and slowing down a page's load time. To provide a better experience for your users and to save resources on your hosting plan, consider resizing images to fit your skin and optimizing them for use on the web.