Create a New Skin

Creating New Skins

New skins can easily be made and added to uPortal. Creating a new skin requires the following steps:

Step 1. Create a new skin folder

  • Create a new skin folder structure for the intended theme. For the default uPortal desktop theme, you will need to add a folder to uportal-war/src/main/webapp/media/skins/universality. You may wish to copy the existing uportal3 skin to use as a starting point.

Step 2. Register your skin

  • Add your skin to uportal-war/src/main/webapp/media/skins/universality/skinList.xml

Step 3. Add your skin to the build

  • The uPortal build uses a custom plugin to perform aggregation on UI resources. To properly include your new skin in the build, you'll need to add a new <execution/> block to the uportal-war/pom.xml file. Add something like the following to the existing list of executions for the maven-uportal-plugin (starting around line 159):
<plugin>
    <groupId>org.jasig.portal</groupId>
    <artifactId>maven-uportal-plugin</artifactId>
    <version>1.0.0-M3</version>
    <configuration>
    </configuration>
    <executions>
        . . .
        <execution>

            <id>aggregate-universality-mynewskin-skin</id>
            <phase>compile</phase>
            <goals>
                <goal>aggregate</goal>
            </goals>
            <inherited>false</inherited>
            <configuration>
                <skinConfigurationFile>src/main/webapp/media/skins/universality/mynewskin/skin.xml</skinConfigurationFile>
                <outputRootDirectory>${project.build.directory}/${project.build.finalName}/media/skins/universality/mynewskin/</outputRootDirectory>
            </configuration>
        </execution>
</plugin>

Step 4. Redeploy

New skins can be deployed via the command:

ant deploy-war

Setting the Default Skin

The default skin is defined as part of the theme definition. To update the default skin for the main uPortal theme, edit the file uportal-impl/src/main/resources/properties/db/base_entities/theme/DLM_XHTML-1.theme and re-import the theme to the uPortal database. You may use the import-export portlet or run an import from the command line:

ant crn-import -Ddir=uportal-impl/src/main/resources/properties/db/base_entities/theme -Dpattern=DLM_XHTML-1.theme

Setting the Default Skin for Existing Users

Once a user has changed his or her personal default skin, changes to the theme-wide default will no longer be seen by that user. However, it is possible to force an update to existing skin preferences through a SQL query. To perform this SQL update, first determine the database-assigned unique ID of the theme for which you would like to update the skin.

For example, for the default skin:

select * from up_ss_theme where ss_name='DLM XHTML';

Once you've determined the ID of your theme, run a SQL update against the up_ss_user_parm table. If the ID was "5" and we wanted to update all users to use the skin "mynewskin", we could execute the following SQL:

update up_ss_user_parm set param_val='coal' where param_name='skin' and ss_id=5;


Additional References

Having problems with these instructions?

Please send us feedback at uportal-user@lists.ja-sig.org