Tabs

Using Tabs in a KB document

To use the tabs add the following code into your KB document, replacing the title and content of each tab to be what ever you need for the document. Note that you will have to be using the HTML editor for this to work, the WYSIWYG editor will not properly interpret this code

The following code represents a tab module:

<div class="tab-content">
<div tabTitle="Title of Tab 1">
Contents of Tab 1 </div>
<div tabTitle="Title of Tab 2">
Contents of Tab 1 </div>
</div>

Copy and paste the following code into the "JavaScript/CSS" field (under "Additional Fields" at the bottom):

<span class="internal"><a class="includedoc">71773</a></span>

Demo

contents of tab1
contents of tab 2
contents of tab 3


To make the tabs look more appealing, they can be used with a gray background.

The following code represents a tab module:

<div class="grayContainer">
<h4 class="grayHeader">
</h4>
&ltdiv class="tab-content"&gt
<div tabTitle="Title of Tab 1">
Contents of Tab 1 </div>
<div tabTitle="Title of Tab 2">
Contents of Tab 1 </div>
</div>
</div>

Copy and paste the following code into the "JavaScript/CSS" field (under "Additional Fields" at the bottom):

<span class="internal"><a class="includedoc">71773</a></span>

Demo

Title Here

contents of tab1
contents of tab 2
contents of tab 3

Tabs also can be used with a collapsible panel, use the following code to insert a collapsible panel with tabs in your doc.

The following code represents a tab module:

<div class="collapsible installer" title="">
&ltdiv class="tab-content"&gt
<div tabTitle="Title of Tab 1">
Contents of Tab 1 </div>
<div tabTitle="Title of Tab 2">
Contents of Tab 1 </div>
</div>
</div>

Copy and paste the following code into the "JavaScript/CSS" field (under "Additional Fields" at the bottom):

<span class="internal"><a class="includedoc">71773</a></span>
<span class="internal"><a class="includedoc">30876</a></span>
<span class="external"><a class="includedoc">30887</a></span>

Demo

contents of tab1
contents of tab 2
contents of tab 3

Square Collapsible Panels

Content

30876 30887


Keywords:
aardvark 
Doc ID:
71773
Owned by:
Nick R. in DoIT Help Desk
Created:
2017-03-15
Updated:
2024-02-01
Sites:
DoIT Help Desk, DoIT Repair