Skip to end of metadata
Go to start of metadata

Description

A pair of macros allowing the user to add AUI-styled Tabs which provide interactive and categorised information to the page.

Usage

Click Insert > Other Macros.


Select the Tabs Container macro from the provided list.


Complete the desired fields.

ParameterDescriptionType

Default

Required?
Tab Direction

Defines whether the tabs appear either:

  • Horizontal (across the top of the tabs container).
  • Vertically (down the left of the container).

string

none

(tick)

IDSpecifies a CSS ID to be added.stringnone(error)
CSS ClassSpecifies a CSS Class to be added.stringnone(error)
TitleText to display in a tool tip.stringnone(error)


The macro will then appear on the page.


Place the Tabs Page macro inside the Tabs Container macro.

Click Insert > Other Macros, and select the Tabs Page macro.


Complete the desired fields.

ParameterDescriptionType

Default

Required?
TitleThe title being attached to this tab.

string

none

(tick)

IDSpecifies a CSS ID to be added.stringnone(error)
CSS ClassSpecifies a CSS Class to be added.stringnone(error)
Lazy loadingAllows the lazy loading of tabbed content. It gets triggered when the tab is activatedbooleanfalse(error)

Lazy Loading limitations

  • Inline comments in tabbed content do not work with Lazy Loading enabled.
  • Lazy Loading does not work with the Jira Macro.
  • Lazy Loading does not work with MS Word Macro.


The macro will then appear on the page.


Continue adding Tabs Page macros to the Tabs Container macro for each tab required.

When saved, an AUI-styled Horizontal Navigation bar will appear on the page.

Tip

Anchor to tab: Please define individual ID's to your tabs. Once you insert the Tab macro, you should define the ID, which will act as an anchor tag. You don't need to insert the Anchor macro explicitly to the body content of the Tab page macro.

On the page where you are trying to link the TABS page, please click Insert > Link > Advanced > Paste the full link of the page containing TABS followed by "#" and the ID of the tab you want to link.

Style Reference

Horizontal Tabs

Vertical Tabs



Top of page

  • No labels