< Magazine />

This tutorial describes how to create your own customized theme. It is quite simple to create a theme for a web designer.

Login as administrator and follow the Themes/Design link in the Global Administration and click Download small theme in the Page Administration.

Save the archive on your disk. Another possibility is to download complete theme. The small theme contains only the main CSS and HTML files (ca. 80% of the design). The complete theme provides all images, CSS and HTML files of all installed modules. Additionally there are the property files for the language translations.

After downloading the theme, unpack it. You can edit the extracted files with the following rules:

• Do not rename or move files (especially HTML files). Deleting files is allowed.
• When you modify HTML files the nested wicket:id hierarchy must not be changed.
• Do not remove wicket:id attributes and wicket tags.

Here is an example a wicket:id attribute:

<a wicket:id="link"><span wicket:id="linkLabel"/></a>

Do not remove linkLabel or put it outside the <a> tag.

You can delete files from the theme template, which keeps the theme tiny and clean. Files which does not exist in the theme will be taken from the default theme which comes with the Devproof Portal or an appropriate module.

After finishing your customizations you must edit the theme.properties file. It contains meta information about your theme:

portal.version=1.1.0
portal.theme.version=1.1.0
theme.name=Default template
author.name=devproof and others
author.url=http://devproof.org

The next step is to zip everything as you downloaded it.

Now you can upload the theme. Follow the Themes/Design link in the Global Administration and click Install theme.

Select the theme in themes overview:

Congratulation you just created and installed your first theme!