Toggles
To hide or show text in a retractable panel, use the [toggle]
shortcode. A good example of how the toggles can be used is in createing a Frequently Asked Question section by using multiple toggles. To have the toggle open on page load, set the state option to open
; To have the toggle closed by default, set the state option to closed
open toggle
How can I find happiness?
Believe in yourself! Have faith in your abilities! Without a humble but reasonable confidence in your own powers you cannot be successful or happy.
[toggle state="open" title="Your toggle title here"]Your toggle content here[/toggle]
closed toggle
How can I find happiness?
Believe in yourself! Have faith in your abilities! Without a humble but reasonable confidence in your own powers you cannot be successful or happy.
[toggle state="closed" title="Your toggle title here"]Your toggle content here[/toggle]
Toggle with code
You can also use the toggles to show/hide code snippets by adding the code
state to the toggle
show code
<ul> <li class="uk-nav-header uk-navbar-nav-subtitle">Menu Heading<div>Subtitle possible</div></li> <li><a href="#">[icon style="icon-envelope-o"/] Menu Icon</a></li> <li><a href="#">[icon style="icon-heart-o"/] Another Menu item</a></li> <li class="uk-nav-divider"></li> </ul>
[toggle state="closed code" title="Your toggle title here"]Your toggle code here[/toggle]