How do you create your own ADF Faces skin?

Question

We are using the default Oracle ADF Faces 10g default skin. It looks super nice, but we want to make tweaks to it (changing the CSS and also how certain components are rendered -- for example the table component will place buttons above and below the table component-- we want them only on the bottom-- this appears to require a programmatic change in order to change this behavior).

Has anyone had success creating their own ADF Faces skin? Please post what you had to do to change component behavior.

Answer 1

Hi,

we followed this documentation for webcenter spaces:

http://www.oracle.com/technology/products/webcenter/pdf/owcs_r11_extend_spaces_wp.pdf

The documentation makes use of an already existing oracle extension (how to download the source is in the document).

Once we add the application, we simply added a new entry in the META-INF\trinidad-skins.xml :

<?xml version="1.0" encoding="ISO-8859-1"?>
<skins xmlns="http://myfaces.apache.org/trinidad/skin"&gt;
  <!-- Previous skins here ... -->
  <skin>
    <id>myskin.custom.desktop</id>
    <family>My Skin</family>
    <render-kit-id>org.apache.myfaces.trinidad.desktop</render-kit-id>
    <style-sheet-name>custom/spaces/skins/myskin/myskin.css</style-sheet-name>
    <extends>default.desktop</extends>
  </skin>
</skins>

and added the css and img files inside the MET-INF directory in the specified paths (e.g. META-INF/custom/spaces/skins/myskin/myskin.css).

For custom applications on ADF the procedure should be the same.