Page Comparison

...

1. Copy the defaultSkin/ (folder) and give it an intitution-specific name (e.g. wolverine)
2. Copy the defaultSkin.less file and give it the same name (e.g. wolverine.less)
3. Edit defaultSkinyour skinName.less file to change the path to skin.less but ADD an import for your variables.less file:
   

   /** DO NOT REMOVE THIS INCLUDE ****************/
   @import "defaultSkin/less/variables.less";
   /**********************************************/

   @import "wolverine/less/variables.less";

   @import "common/common.less";

   @import "wolverine/less/skin.less";

    
4. Edit the skinList.xml file to add your custom skin:
   (Optionally remove the other skins)
   

   <skin>
   <skin-key>wolverine</skin-key>
   <skin-name>Wolverine</skin-name>
   <skin-description>
   Custom, institional branding
   </skin-description>
   </skin>

   
   

5. Edit the respondr.stylesheet-descriptor.xml file with your skin name & re-import it:
   

   <stylesheet-parameter>
   <name>skin</name>
   <default-value>wolverine</default-value>
   <scope>PERSISTENT</scope>
   <description>Skin name</description>
   </stylesheet-parameter>

    

6. Edit the dynamic-respondr-skin.portlet-definition.xml file with your skin name & re-import it:
   

   <!-- NOTE: When using the 'dynamic-respondr-skin' portlet with a custom skin,
   uncomment the following <portlet-preference> element and change the <value>
   to the name of your skin. -->
   <portlet-preference>
   <name>PREFdynamicSkinName</name>
   <readOnly>false</readOnly>
   <value>wolverine</value>
   </portlet-preference>

    
7. Change the contents of the wolverine folder to-taste
   • Override color values and a handful of other things in variables.less
   • Override style rules in skin.less