Info | ||
---|---|---|
| ||
This page documents the usage with the Common Theme, the pre-Common-Theme documentation is here: Visual Themes - How to |
Warning | ||
---|---|---|
| ||
The documentation below is deprecated since R17.12 branch. It's better to refer to themes/README.adoc in source |
The documentation bloc below is the HTML import of the conversion of README.MD into HTML by Pandoc using this command line locally in root folder.
Code Block |
---|
pandoc themes/README.md -s -o tools/wiki-files/themes/README.md.html |
...
Table of Contents |
---|
HTML | ||
---|---|---|
|
How to install a Visual Theme
A Visual Theme is distributed as a single .zip file like for example chrome.zip.
- Download the zip file from the Gallery
- Unzip it in the OFBiz themes folder
- Issue the "ant run-install" command in your OFBiz home folder
From this moment your added Visual Theme is installed and available in the OFBiz framework.
How to change the backoffice default Visual Theme
The Visual Theme that is used as default is defined in the file: /framework/common/data/CommonTypeData.xml
For example, to set the chrome theme as default, replace the line:
Code Block |
---|
<UserPreference userLoginId="NA" userPrefTypeId="VISUAL_THEME" userPrefGroupTypeId="GLOBAL_PREFERENCES" userPrefValue="DEFAULT"/>
|
with the following one:
Code Block |
---|
<UserPreference userLoginId="NA" userPrefTypeId="VISUAL_THEME" userPrefGroupTypeId="GLOBAL_PREFERENCES" userPrefValue="CHROME"/>
|
How to create a Visual Theme
An OFBiz Visual Theme consists of a simple OFBiz component installed, usually, in the themes folder. In the component, all the resources needed by the Visual Theme are defined.
...
Panel |
---|
NOTE: |
...
Panel |
---|
NOTE: |
...
- change the visualThemeId from "BLUELIGHT" to "MYTHEME"
- if your theme is intended to be used for the Ecommerce application set the visualThemeTypeId="ECOMMERCE"
- if your theme is intended to be used for the backoffice applications set the visualThemeTypeId="BACKOFFICE"
- Change all VisualThemeResource lines to include references to you theme files
...
- change the <display-name> and <description> with a description of your theme
...
- change all "bluelight" occurrences with "mytheme"
Your theme is now ready to be installed.
If you want to upload your theme to the Visual Theme Gallery, simply create a mytheme.zip file from the /themes/mytheme folder and upload to the gallery.
...