KB User's Guide - Documents Tab - Show/Hide Toggles
This document explains and demonstrates the Show/Hide Toggle functionality. This functionality allows document authors (in HTML editor) to create expandable and collapsible sections in KB documents.
Show/Hide Toggle sections in action
Click the plus signs below to expand the example sections below. Once expanded, click the minus sign and the section will collapse.
- Paragraph (with class attribute)
- Paragraph (without class attribute)
-
Note the little bullet here because the class attribute was not used. This is a paragraph of text that can be shown or hidden by clicking the plus sign.
Here is the source code needed to accomplish this in your own document:
<ul id="toggle5">
<li><strong> Paragraph (without class attribute)</strong>
<ul>
<li>
<p>Note the little bullet here because the class attribute was not used. This is a paragraph of text that can be shown or hidden by clicking the plus sign.</p>
</li>
</ul>
</li>
</ul>
- Unordered List of links to other documents
- No Bullet List of links to other documents
Caveats and Cautions
- The id="toggle#" attribute must have a unique number (from 0-80) for the Show/Hide Toggling to work correctly. See source code examples in this document.
- Show/Hide Toggles available only in HTML editor mode (not WYSIWYG).
- The JavaScript that controls the Show/Hide Toggle is limited to 81 Show/Hide Toggles per document and can be increased further if needed.
- The class attribute controls the display of bullets. Show/Hide Toggle sections are created by wrapping section content in a couple <ul> tags. The first <ul> tag will have the following attributes: id="toggle" and class="toggle". This triggers the javascript to render the Show/Hide Toggles. The 'class' attribute is optional. If not used bullets will be displayed. See links in the Show/Hide examples below for samples of the code needed to generate Show/Hide Toggles with and without bullets.
- Cannot preview Show/Hide Toggles in the Preview popup. Use the Review screen to test the show/hide functionality. This popup will remind document authors of this:
Please note that show/hide toggles do not work in this preview window as they do on review or live pages.
See Also: