The Tabs interaction separates your content out into tabs on your page can be an excellent way to split content and information down into manageable sections for the learner to work through.
Adding Tabs
1. Open the page in your course where you would like to add the Tabs.
2. Open Layout.
3. Navigate to the position on the page where you would like to add the Tabs interaction and select the Add here button.
4. Select Interactions:
5. Depending on how you would like your Tabs to be displayed e.g. either above, to the left or to the right of the content, select either the Tabs (Top), Tabs (Left) or Tabs (Right) option:
6. This will add three Tabs title options by default. Click on one of the Tabs to open the content section for that tab:
7. Select Save to save your changes.
Tab Settings
In Layout, the settings for the Tabs can be found by selecting the Variations menu on the top right of the interaction:
Under Variations you have the option to determine at what device screen size the Tabs stack in a column rather than a row:
In Author, more Tabs can be added by selecting the + Add Tab button on the top right of the interaction:
| Tip: Individual Tabs can be deleted in Author, as well as specific parts of a tab that you want to delete for just that tab. For example, if you want an image container for tab 1 but not in tab 2, the image container can be deleted from tab 2 in Author. |
Tab Example
The following example shows a typical example of how a Tabs interaction is often used within a course. The example displays the Elucidat company values and what they mean. In Preview, the contents of the first tab display first:
The learner can then click on the other Tabs titles to access the content: