Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

The simplest way to create a Visual Theme is starting from one of the already available themes in the gallery.

Let's assume say you want to create a new theme called vt_mytheme and have selected vt_multiflex as a starting template.

  • Download the vt_multiflex.zip file from the Gallery
  • Unzip it in the OFBiz hot-deploy folder
  • Rename the folder hot-deploy/vt_multiflex to hot-deploy/vt_mytheme
  • Rename the folder hot-deploy/vt_mytheme/webapp/vt_multiflex to hot-deploy/vt_mytheme/webapp/vt_mythememythem
  • Delete all files from the hot-deploy/vt_mytheme/includes folder and add your own header and/of footer files if needed
  • Delete all files from the hot-deploy/vt_mytheme/webapp/vt_mytheme folder and add your own css files and images

    Panel

    Please consider that all images references in your css file must be linked using the "/vt_mytheme" path.
    For example if you have a background.jpg image you should use the following address: url(/vt_multiflex/background.jpg)



  • Edit the file hot-deploy/vt_mytheme/data/ThemeData.xml as follows:
    • change the visualThemeId from "MULTIFLEX" 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
    *

  • Edit the file hot-deploy/vt_mytheme/webapp/vt_mytheme/WEB-INF/web.xml as follows: Change
    • change the <display-name> and <description> with a description of your theme
    *

  • Edit the file hot-deploy/vt_mytheme/ofbiz-component.xml as follows: Change
    • change all "vt_multiflex" occurrences with "vt_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 hot-deploy/vt_mytheme folder and upload to the gallery.

...