How to make the WYSIWYG editor show my nested tabs?

I'm working on a project and we're using tabs inside other tab panes. My problem is that the editor never displays the content of the nested tabs. Even is I select tab and click on the 'SHOW' button nothing happens, jut empty space. The other buttons right above the editing screen work well, I can add or delete tabs without any problem. When I drag something from the Components sidebar into the tab pane it stays there and in the browser I can see the dragged component but I'm unable to edit it, since It does not show up and I can't edit the html either. Any idea would be appreciated. Thanks

As a workaround could not drag your nested tab out of the tab is nested in, then make your edits and then once finished drag it back in ?

If you at any time manually configured a tab to be shown by adding the class "active" to a tab-pane, then you need to step through the HTML pane and find / remove any "active" classes in your tabs and nested tabs that are not a "locked" class version of it.

For example:

<div role="tabpanel" class="tab-pane active" id="tab-1">
    <*p>First tab content.</p>

Now here's the kicker :) it can just sometimes get confused and you might have to actually add the "active" class to the tab-pane you want to edit. You will just have to remember to remove the "active" class when your done though.


Thanks, it might work but dragging it out and back every time it needs editing could be a nightmare.

@saj, that's exactly what I wanted to avoid: editing the code manually. I can code the html manually in an editor or IDE it's not why I bought Bootstrap Editor. I did not expect to assemble a complicated page only by drag and drop but even simple tasks seem to be out of its league.

@hastoro33 Some things simply can't be done with drag and drop. Bootstrap Studio tries very hard to make editing entirely visual, but there are corner cases like this that need to be converted into static HTML. This is rarely necessary though, and for 90% of things you will be able to edit visually without writing code.