[Widget] - Tabtable

How to use a Tabtable in a content page

1.  
2.  
3.  
4.  
5.  
6.  
7.  
8.  
9.  
10.  
11.  
12.  
13.  
14.  

Previous Next

1. From the Project Dashboard, click the Content Node to open it in the editor.
2. Select Widget from the Menu bar drop-down. Widgets are listed on the left panel and on the top bar of the editor.
3. Next, select Tabtable from the drop-down list.
4. Drag and drop the Tabtable Widget in the required section.
5. The tabtable widget allows you to define and edit a new tabtable or reuse an existing tabtable.
6. Next, select Edit to edit a new tabtable or reuse an existing tabtable.
7. On the Edit modal, provide information such as:
   • Alignment – The alignment of the tabs
     • Top (default)
     • Left
   • Label – label title 
   • Label Icon – click on the dropdown to choose an icon
   • Description – Description of the label to be displayed after expanding it
   • Asset – click Select Asset to upload an asset in the label from the project repository or LOR.
     • To upload from the Project Repository:
       • Select a file
       • Click Add Selected
       • To upload a file from your local machine, click the upload button and select the file.
     • To upload from the Learning Object Repository:
       • Select a file (these files have already been saved to the LOR and hence are visible on this tab)
       • You can search or apply filters to find the required image file.
       • On selecting the file, click Add Selected
   • Align – Alignment of the asset
     • Left (default)
     • Right
     • Center
   • Alt Text – for the Asset (not mandatory)
   • Add Label – click the “+” button on the top right to add labels 
8. Click Save to save the changes.
9. To reuse an existing tabtable, click Reuse Existing on the widget.
10. On the Copy Widget modal:
    • Select the Project  from where you want to reuse the widget
    • Select the Node of the project
    • Select the Tabtable to be reused
    • Click Continue to copy the widget
    • After copying the widget, you can click edit to make changes to the widget
11. Finally, click Save on the Editor to save the changes.

Note: In preview mode, clicking on the head of each tab will reveal that particular tab. Only one tab can be opened at a time.

On navigating to Author or Preview mode from the top navigation, users will need to select a node to view its content.