Theme Configuration

Added by Gary Thompson, last edited by Gary Thompson on Sep 17, 2009  (view change)

The theme was built to be configured to meet a broad scope of needs and desires.

On this page

Theme

A theme transforms back-end data and layout into user interfaces.

Reference: Theme, Rendering Process, Theme File Location

Notes

The theme is written in XSL. For more information on XSL, refer to http://www.w3.org/Style/XSL/.

Baseline XSL skill is strongly recommended before modifying theme files.

Purpose

The theme was built with two main purposes:

  1. To instruct the portal how to compile and configure the theme.
  2. To provide theme configuration and customization.

As such, the theme file has a mixture of code that should not be modified (what instructs the portal how to compile and configure the theme), and code that exists explicitly to be modified (what provides theme configuration and customization). To help make clear what is what, a RED-YELLOW-GREEN legend has been added to all of the sections of the main theme file (universality.xsl).

Legend

  • RED: Stop! Do not modify.
  • YELLOW: Warning, proceed with caution. Modifications can be made, but should not generally be necessary and may require more advanced skill.
  • GREEN: Go! Modify as desired.

For example:

<!-- ============================= -->
    <!-- ========== IMPORTS ========== -->
    <!-- ============================= -->
    <!--
     | RED
     | Imports are the XSL files that build the theme.
     | Import statments and the XSL files they refer to should not be modified.
     | For customization of the theme, use the Varaiables and Parameters and Templates sections below.
    -->
    <xsl:import href="page.xsl"/>
    <!-- Templates for page structure -->
    <xsl:import href="navigation.xsl"/>
    <!-- Templates for navigation structure -->
    <xsl:import href="components.xsl"/>
    <!-- Templates for UI components (login, web search, etc.) -->
    <xsl:import href="columns.xsl"/>
    <!-- Templates for column structure -->
    <xsl:import href="content.xsl"/>
    <!-- Templates for content structure (i.e. portlets) -->
    <xsl:import href="preferences.xsl"/>
    <!-- Templates for preferences-specific structures -->
    <!-- ============================= -->

Best Practice

A main intent of the theme structure is to provide one place for configuration and customization. All configuration and customization should be done in the universality.xsl file, leaving all other theme files untouched. Following this guideline will minimize impacts to your configuration and customization migration to future releases of uPortal.
RELATED LINKS
User Experience Goals (uPortal)
Design Concepts (uPortal)
User Experience (uPortal)
Markup and CSS Naming Conventions (uPortal)
Accessibility (uPortal)
Rendering Process (uPortal)
Skins (uPortal)
User Interface (uPortal)
Theme (uPortal)
Theme Configuration (uPortal)


REFERENCES

XML/XSLT Resources

HTML Resources

CSS Resources

JavaScript Resources

Labels

theme theme Delete
user_interface user_interface Delete
Enter labels to add to this page:
Please wait 
Looking for a label? Just start typing.