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.

../../../_images/tab-module.svg

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.)

  1. In the content edit page, open or create the item to which you want to add a tab module.

  2. Under Overrides, expand Module Placement. Drop-down lists Above, Aside, and Below appear for the tab module’s position. (For an illustration of these positions, see the diagram Examples of Module Placement.)

  3. From one of the drop-down lists, select Replace. For an explanation of the possible selections for module placement, see Module Placement.

  4. Click add_circle_outline, and select Tabs. A form appears.

  5. In the Title field, enter a title.

  6. Under Tabs, click add_circle_outline. A Tab Item form appears.

  7. 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 add_circle_outline to add a module. The corresponding form appears.
      2. Fill out the module form.
      3. Repeat steps a–b 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.
  8. Repeat steps 6–7 to add additional tabs.

  9. 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:

    ../../../_images/tabs-form.png
  10. Click Publish.

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