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]