Difference between revisions of "DASH Decorators"
Rmortensen (Talk | contribs) (→Layouts) |
Rmortensen (Talk | contribs) (→Editing CSS Styles) |
||
Line 47: | Line 47: | ||
[[Image:css1.jpg]] | [[Image:css1.jpg]] | ||
+ | The styles.css file is the style sheet for the DASH decorator. A review of CSS coding is not appropriate here - but standard conventions are used. Editing this file will allow you to change dashboard width, colors and other behaviors. If you view the page source of a page with a decorator you modified - you should be able to see the div tags used. Modify those tag entries in the sytles.css file. | ||
=== Editing Header.vm === | === Editing Header.vm === |
Revision as of 19:22, 30 January 2007
Contents
Decorations Location
The look and feel of your dashboard pages can be modified by use of decorators. Each page can have a different decorator - but consistency should be used for a group of dashboard pages.
Decorators are editable and exist in the following folder (assuming DASH is the root folder of your install):
/DASH/webapps/jetspeed/decorations - Here is the contents of that folder:
Layouts
The Layouts folder contains decorations for entire pages of content.
Jetspeed provides some good examples of page decorators. You can see how each looks and functions by creating a page in the Portal Site Manager and choosing the desired page decorator. See Adding Panes and Formating Panes for additional information.
Once you find an existing decorator that you wish to modify - simple copy the directory and rename it. The name of the folder corresponds to the name of the decorator in the theme pull down list when you create a page - Formating Panes.
Modifying an Existing Decorator
In the following example - we will take a look at the DASH decorator that is used in the Welcome page and the demo site. You can make these modifications to any decoration. There may be slight differences in the implementation of each - so this is a representable example of the process.
Here is the contents of the DASH decorator folder:
There are several files and folders to note in this directory:
- css folder - This folder contains cascading style sheets for the DASH decorator.
- header.vm - this is the code that is used to format and display the heading of the DASH decorator.
- footer.vm - this is the code that is used to format and display the footer.
- images folder - This folder contains any images (logos, etc) that will be displayed on the decorator.
Editing CSS Styles
The styles.css file is the style sheet for the DASH decorator. A review of CSS coding is not appropriate here - but standard conventions are used. Editing this file will allow you to change dashboard width, colors and other behaviors. If you view the page source of a page with a decorator you modified - you should be able to see the div tags used. Modify those tag entries in the sytles.css file.
Editing Header.vm
Portlets
The Portlets folder contains decorations for single portlets.