Q: Is it possible to change the webui, with a different templates, images and configfiles?

A: Yes, OGo is "skinnable". Skins use the language subsystem.

Language resources are "inherited" and OGo uses that for skins. For example if you want to create a "green" skin, you'll basically create a

English_green.lproj

where required. Now if the user selects "Spanish_green" as his language, OGo ends up in a language array like this:

Spanish_green.lproj
Spanish.lproj
English_green.lproj
English.lproj
German.lproj
..

Q: I need to develop html/wod files for every page, if I want to design a new Skin?

A: No, only for the components you want to modify.

So if OGo asks for a template called "LSWSkyrixFrame" (which controls the frame around any page), SOPE will search the above list and use the resource it finds first.

The same procedure like searching WebServerResources (images, css) and Resources (components.cfg).

For example check approach to OGo --> OOo modification:

-->

1. WebServerResources

WebServerResources means especially the stylesheet OGo.css and images.

cp -r ~/WebServerResources/English.lproj \
      ~/WebServerResources/English_OOo.lproj

Edit the copied OGo.css (fonts, colors...) and/or substitude the copied images as you like.

2. Resources

cp -r ~/WOApps/OpenGroupware.woa/Resources/English.lproj \
      ~/WOApps/OpenGroupware.woa/Resources/English_OOo.lproj

Edit the copied components.cfg as you like.

3. Components

cp -r ~/Library/OpenGroupware.org/BaseUI.lso/LSWSkyrixFrame.wo/English.lproj \
      ~/Library/OpenGroupware.org/BaseUI.lso/LSWSkyrixFrame.wo/English_OOo.lproj

Edit the copied masteremplate LSWSkyrixFrame.html' to arrange the following components:

3.1 SkyNavigation (1)

cp -r ~/Library/OpenGroupware.org/BaseUI.lso/SkyNavigation.wo/English.lproj \
      ~/Library/OpenGroupware.org/BaseUI.lso/SkyNavigation.wo/English_OOo.lproj

Edit the copied SkyNavigation.html as you like.

3.2 SkyDock (2)

cp -r ~/Library/OpenGroupware.org/BaseUI.lso/SkyDock.wo/English.lproj \
      ~/Library/OpenGroupware.org/BaseUI.lso/SkyDock.wo/English_OOo.lproj

Edit the copied SkyDock.html as you like.

3.3 SkyDockedProjects (3)

cp -r ~/Library/OpenGroupware.org/OGoProjectInfo.lso/SkyDockedProjects.wo/English.lproj \
      ~/Library/OpenGroupware.org/OGoProjectInfo.lso/SkyDockedProjects.wo/English_OOo.lproj

Edit the copied SkyDockedProjects.html as you like.

3.4 SkyFavorites (4)

cp -r ~/Library/OpenGroupware.org/BaseUI.lso/SkyFavorites.wo/English.lproj \
      ~/Library/OpenGroupware.org/BaseUI.lso/SkyFavorites.wo/English_OOo.lproj

Edit the copied SkyFavorites.html as you like.

3.5 LSWWindowframe (5)

Editable html template and wod files doesn't exist. To modify border, color and alignment of LSWWindowframe use the .wintable, .wintitle an .wincontent classes in OGo.css.

4. Provide new theme in OGo WebUI

Defaults write OpenGroupware SkyLanguages ’(German,German_OOo,German_green,English,English_OOo,English_green)’

After restart OGo, change the language parameter in the user prefrences.

5. Example

The example describes custom link expansion in the menu section of LSWSkyrixFrame.

5.1 LSWSkyrixFrame.html

Creating the necessary changes to
~/Library/opengroupware.org/BaseUI.so/LSWSkyrixFrame.wo/English_<theme>.lproj/LSWSkyrixFrame.html

in the appropriate section (under logout):

 <tr>
    <td valign="middle">
        <#CustomLink><#CustomLabel /></#CustomLink></td>
 </tr>

5.2 LSWSkyrixFrame.wod

To define the dynamic elements CustomLink and CustomLabel you need to add the proper tag definition in the ~/Library/opengroupware.org/BaseUI.so/LSWSkyrixFrame.wo/English_<theme>.lproj/LSWSkyrixFrame.wod file, eg in your case:

   CustomLink: WOHyperlink {
     href   = "http://docs.opengroupware.org/quickintro";
     target = "custom";
   };
   CustomLabel: WOString {
     value = "Help!";
   };

5.3 BaseUI.strings

You can also use of localization using the strings file, in this case, add a new label-key to the .strings file of the BaseUI bundle (which contains the LSWSkyrixFrame), eg:

English.lproj/BaseUI.strings: helpLinkLabel = "Help!"

German.lproj/BaseUI.strings: helpLinkLabel = "Online-Hilfe"

Then change the wod file declaration to:

   CustomLabel: WOString {
     value = labels.helpLinkLabel;
   }

5.4 Note

Actually in above simple case you could just add the plain-HTML instead of dynamic .wod elements, eg:

   <tr>
      <td valign="middle">
        <a href="http://docs.opengroupware.org/quickintro"
           target="docwindow">Help!</a>
      </td>
   </tr>

Note: you should create a patch for such changes! Otherwise your changes will be lost after an OGo WebUI upgrade.