Content Layout system for the content area within the Page component. It divides up the content area into combinations like navigation+content, content+sidebar, etc. Note this component can only be used once per document, within the #content element; and it cannot be nested. If you need generic layouts further down the DOM, use group+item.
| API status: | general |
|---|---|
| Included in AUI core? | Yes. You do not need to explicitly require the web resource key. |
| Web resource key: | com.atlassian.auiplugin:aui-page-layout
|
| AMD Module key: | N/A |
| Experimental since: | 5.0 |
| General API status: | 5.1 |
The core layout requires the page panel, a page panel inner and at least one panel - usually a content panel. The extra elements are used across layout variations so do not omit them.
For a simple content area with no divisions:
Navigation (aui-page-panel-nav), sidebar (aui-page-panel-sidebar) and generic items (aui-page-panel-item) can be added as siblings of content (aui-page-panel-content). By default the items are rendered
as columns.
A three-column layout:
The generic item is relatively unstyled - it allows custom extensions to content layouts where required:
Called with JavaScript:
Server-side Soy: