Support and Documentation

Tabs

Tabs are a layout container containing individual tabs, each of which contains one or more modules. This layout provides a compact display of many different modules.

sample layout of tabs

The preceding example illustrates the following components of a tab module:

  • Title for the tabs (Media)

  • Label for an open tab (Videos)

  • Two items appearing under the open tab (Space Shuttle Discovery Liftoff and Space Shuttle Atlantis Liftoff)

  • Label for a closed tab (Images)

(Your version of Brightspot may render tabs differently.)

Procedure. To add tabs:
  1. In the content edit page, open or create the item to which you want to add a tab.

  2. Toward the right of the widget, select |mi-more_horiz| > Overrides. A widget appears.

  3. Expand Layout. Drop-down lists Above, Aside, and Below appear for the module's position. (For an illustration of these positions, see the diagram Examples of module placement.)

  4. From one of the drop-down lists, select Replace. A drop-down list appears. (For an explanation of the possible selections for module placement, see Module placement.)

  5. Click |mi-add_circle_outline|, and select Tabs. A form appears.

  6. In the Title field, enter a title.

  7. Under Tabs, click |mi-add_circle_outline|. A form appears.

  8. In the Tab Item form, do the following:

    1. In the Label field, enter a label for the tab.

    2. In the Title field, enter a title for the tab.

    3. Under Tab Content, do the following:

      1. Click |mi-add_circle_outline| to add a module. The corresponding form appears.

      2. Fill out the module form.

      3. Repeat steps i–ii to add additional items to this tab.

    4. Depending on your current theme, there is an Overrides tab with additional fields you can use to further define the module.

  9. Repeat steps 6–7 to add additional tabs.

  10. Depending on your current theme, there is an Overrides tab with additional fields you can use to further define the module.

    Your Tabs form looks similar to the following:

    tabs-form.png
  11. Click Publish.

For information about adding different types of modules under tabs, see the following: