La Trobe Design System
Goals of the La Trobe Design system
- Improve the consistency of design
- Improve the scalability of design
- Improve the maintainability of design
- Improve usability and accessibility
How to use the Design sytem
To apply the design system to a page requires the following three settings:
a. Settings page:
Change System Defined Frontend Design to Main Site (1099240)
Use Change? to apply to page and its children. Use Override? to apply to this page only.

b. Paint layouts page:
Change Paint layout to La Trobe Design System - paint layout (1068988)
Use Paint Layout to apply to page and its children. Use Override Paint Layout to apply to this page only.

c. Metadata schemas page:
Change Metadata schema to La Trobe Design System - metadata schema (1094469)
Select Cascade? to apply to page and its children. Un-select Cascade? to apply to this page only.
You can now use the design system components on the pages these settings have been applied to.

2. Use DS Components
Note: only WYSIWYG containers and DS components can be used on these pages.
Legacy code and components will not render correctly:
- do not try and use legacy components and code.
- do not use raw hand coding
The DS components are available as Content Templates.
All DS components are prefixed DS:
Here are the available components.
Note: only WYSIWYG containers and DS components can be used on these pages.
Legacy code and components will not render correctly:
- do not try and use legacy components and code.
- do not use raw hand coding
The DS components are avaiable as Content Templates.
All DS components are prefixed DS:
Here are the available components: