SJC 2023 - Tabs content type details

ID: 574
Name: SJC 2023 - Tabs
Description: Each tab is a separate piece of content.

Content element details

NameDescriptionSizeTypeRequired
NameThe Name Element80 CharactersPlain TextYes
Show on Secondary pageSelect the checkbox to show the content on the full width secondary page80 CharactersCheck BoxNo
Section Heading (H2)Enter the title for the content80 CharactersPlain TextNo
Section DescriptionEnter the brief description of the content350 CharactersPlain TextNo
Tab TitleTitle for example “How do I apply for a course”150 CharactersPlain TextYes
Tab DescriptionContent for the expanded tab. Supports rich text such as bold, italics.99999 CharactersHTMLYes
Tab CTA TextEnter the text for the Call to Action50 CharactersPlain TextNo
Tab CTA Link (internal)Select a section/content for an internal link80 CharactersSection/Content LinkNo
Tab CTA Link (external)Only enter this if you are NOT entering an internal link999999 CharactersPlain TextNo
Tab CTA Link (PDF)Select the file from the media library80 KilobytesMediaNo
Tab CTA open in new windowSelect to open link in new window80 CharactersCheck BoxNo

How to use

Creates a block of vertical tabs - each tab is a separate content item. The Tab Title is shown when the tab is closed. In the open tab panel, both the Tab Title and the Tab Description and optional call-to-action link are displayed.

For the call-to-action link, select either an Internal link (ignore the Use default link text checkbox), enter an external link or select a PDF from the Media Library (only use one). Select the Open link in new window checkbox to have the link open in a new window.

There is the option to add a section heading and description above the tabs. This should be populated in the first tab item only.

Select the Show on Secondary page checkbox for all tab items when using this on pages with the Secondary page layout to center the tabs.

In sections using a Secondary page layout there are 2 columns with the open tab panel displayed in the right column. In sections using a Tertiary page layout, tabs are displayed in a single column with open tab panel under the Tab Title.

To link directly to a group of tabs, create a content link to the first tab item.

Examples

Section Heading

This is the Section Description text.

Tab Title 1

This is the first Tab Description text.

Tab CTA Text 1 - Internal Link

Tab Title 2

This is the second Tab Description text.

Tab CTA Text 2 (PDF)

Tab Title 3

This is the third Tab Description text. No call to action link.

Tab CTA Text (external - new window)