Sunday 5 July 2015

Custom skin configuration in ADF Application


This blog we will see how to configuration in ADF application.
While creating the ADF application in JDeveloper 11.1.1.7, the default CSS or ADF Skin file will not create. If we will create a CSS file then the CSS file changes does not reflect, so it should be configured in application level.

For reflecting the CSS changes needs to follow the below steps.
1. Create trinidad-skins.xml file inside WEB-INF folder.
2. Create a CSS file like the below screen.
3. We need to mention the CSS file location path into the trinidad-skin.xml file.


<?xml version="1.0" encoding="UTF-8" ?>
<skins xmlns="http://myfaces.apache.org/trinidad/skin">
  <skin>
    <id>custom.desktop</id>
    <family>myCustomCSSSkin</family>
    <extends>fusionFx-v1.1.desktop</extends>      
    <style-sheet-name>css/myCustom.css</style-sheet-name>
  </skin>
</skins>
  4. Add the skin family name in trinidad-config.xml file like below


<?xml version="1.0" encoding="windows-1252"?>
<trinidad-config xmlns="http://myfaces.apache.org/trinidad/config">
  <skin-family>myCustomCSSSkin</skin-family>
  <skin-version>v1</skin-version>
</trinidad-config>

5. NOTE: the skin-family name of Trinidad-config.xml file should match the family name of trinidad-skin.xml.
Now run your application it will reflect the CSS change.
Thanks..

No comments:

Post a Comment