Creating Themes in Vanilla 1
What is a Theme?
A theme is a set of template files that Vanilla uses when rendering xhtml to the screen. The “template” files are really just plain php files that contain a mixture of php and xhtml. Different template files are used in different places in Vanilla. To see the template files in Vanilla’s default theme, navigate to your vanilla’s installation folder and look in the /themes/vanilla directory.
Creating a new Theme
How do I create a new Theme?
You may be tempted to edit the template files in the /themes/vanilla directory. Do not edit those files! Even if the change you want to make is tiny, do not alter the default template files. Regardless of the scale of your desired changes, you should always create an entirely new theme. Here is how you do it:
Copy the “Vanilla” folder within the root “themes” folder and paste it with your new name, like /themes/your_new_theme_name/. Once this is complete, you have a skeleton of the folder structure, images, and css required for a theme.
Copy the template file(s) you want to change into this new directory. Then change the file(s) as much as you want. Only copy the template files you need to alter.
Finally, change the css and image files in the styles/default folder as necessary to work with your new templates.
Why can't I alter the root template files?
The default template files will be overwritten as upgrades are made to Vanilla, and any changes you’ve made will be overwritten.
Why should I only copy the template files I want to alter?
We strongly advise that you ONLY copy the template files that you need to alter. This will make upgrading easier later on since you will easily see which of your templates may need updating in order to work with newer versions of Vanilla.
How do I apply my new theme?
Go to the settings tab and clicking on the “Themes and Styles” link. Select the new theme you want to use from the first dropdown and then select the style you want to use from the second (it will likely be the default style). Check the “Apply to all users” box and click save.
I don't get it. How does Vanilla know which template file to include?
Once you’ve configured your THEME_PATH, Vanilla will always look in that folder for a template file *first*. If Vanilla can’t find your custom template file, it will include the base template file in the root themes folder.
What are each of these template files for? I can't figure out which one to change.
We’ve done our best to give each of the template files descriptive names. Here are some pointers which may help you out in finding your way around:
Any templates beginning with “account_” are used on the account tab.
Any templates beginning with “people_” are used on the sign in, sign out, register, and password retrieval screens.
Any templates beginning with “search_” are used on the search tab.
Any templates beginning with “settings_” are used on the settings tab.
Any templates ending with “_nopostback” are input forms.
Any templates ending with “_validpostback” are the results of successfully submitting the related “_nopostback” form.
“head.php” is used on every screen and contains everything up to and including the “body” tag.
“menu.php” is used to write the containing structure of Vanilla AND the Vanilla tab menu.
“foot.php” can be considered the closing of everything that was opened in “menu.php”.
“page_end.php” is where the body is closed.
Sharing your Theme
Once you have finished creating your new theme, you can upload it to Lussumo so that other people can use it. Do so by following the Add-on Guidelines to prepare your theme for being added to the Add-on Management application.