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 API: | 5 |
General API: | 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: