I'm working on a tab layout with two tab items (and corresponding tab panes). The first tab's li element is classed with active by default (and locked) and the corresponding tab pane for the first tab is displayed on the drag-and-drop canvas. I cannot seem to figure out how to display the second tab pane on the drag-and-drop canvas so I can work on it without dragging COMPONENTS in the OVERVIEW hierarchy.
So two questions:
How to make the second tab classed as active
How to display the second tab's tab pane contents on the drag-and-drop canvas?
You can switch the active tab with the Tab Control Bar. Just select the Tab Pane or Tab you wish to activate and press the SHOW button. This will display the contents of the tab and you will be able to drag and drop inside it or edit text elements.
I should add that using the show button does not add the in role to the tab pane therefore the content within the pane does not appear automatically in the canvas. Unless there's something else I'm missing, perhaps as a future product enhancement. A story for your reading pleasure:
As a web designer using bootstrap studio I want to click the show button to have the content of the tab pane appear so I can work on the content within the tab pane without having to manually add the in role to the pane.
The "Show" button might break if the value of the tab link's href doesn't match your tab pane. If you create your tabs with the Add Tab buttons in the toolbar, the ids are set automatically for you. But if you duplicate elements manually or change the default ids, make sure that the selector in the href points to the tab pane.