Navs (Tabs & Pills)

<nav type="tabs">
  * [[:start]]
  * [[:wiki:plugin:bootswrapper:nav|Nav Plugin]]
  * [[playground:playground]]
  * DokuWiki
    * [[:wiki:welcome]]
    * [[:wiki:syntax]]
</nav>



Instead of <nav type="tabs"> you can use <tabs> alias.


<nav type="pills">
  * [[:start]]
  * [[:wiki:plugin:bootswrapper:nav|Nav Plugin]]
  * [[playground:playground]]
  * DokuWiki
    * [[:wiki:welcome]]
    * [[:wiki:syntax]]
</nav>



Instead of <nav type="pills"> you can use <pills> alias.


<nav type="pills" stacked="true">
  * [[:start]]
  * [[:wiki:plugin:bootswrapper:nav|Nav Plugin]]
  * [[playground:playground]]
  * DokuWiki
    * [[:wiki:welcome]]
    * [[:wiki:syntax]]
</nav>



<nav type="pills" justified="true">
  * [[:start]]
  * [[:wiki:plugin:bootswrapper:nav|Nav Plugin]]
  * [[playground:playground]]
  * DokuWiki
    * [[:wiki:welcome]]
    * [[:wiki:syntax]]
</nav>



<nav type="tabs" justified="true">
  * [[:start]]
  * [[:wiki:plugin:bootswrapper:nav|Nav Plugin]]
  * [[playground:playground]]
  * DokuWiki
    * [[:wiki:welcome]]
    * [[:wiki:syntax]]
</nav>




<tabs>
  * {{fa>home}} DokuWiki
    * [[wiki:welcome]]
    * [[wiki:syntax]]
</tabs>



<tabs>
  * File
    * {{fa>file-o?fw}} [[#new|New]]
    * {{fa>folder-open?fw}} [[#open|Open]]
    * {{fa>print?fw}} [[#print|Print]]
    * {{fa>close?fw}} [[#close|Close]]
  * ?
    * {{fa>info?fw}} [[#about|About...]]
</tabs>


<tabs>
  * [[#tab-foo|Foo]]
  * [[#tab-bar|Bar]]
 
<pane id="tab-foo">
=== Foo ===
Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</pane>
 
<pane id="tab-bar">
=== Bar ===
Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</pane>
 
</tabs>


Foo

Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Bar

Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.


Use Include Plugin with inline flag to prevent unexpected behavior.

<pane id="tab-bar">
{{page>:wiki:syntax#Tables&inline}}
</pane>

Include plugin Documentation

[…] Don't close/open sections when including a page. This flag should be used when the include syntax is used inside other syntax elements like lists or tables or inside other plugin syntax. […]
(see plugin:include)

Note for TOC

I suggest to add ~~NOTOC~~ because the TOC is displayed between the tab bar and the content.


Attribute Default Value Allowed Values Description
type pills tabs, pills Type of nav
stacked optional true Stacked nav items
justified optional true Justify nav items
fade optional true Enable fade effect on tabs
  • wiki/plugin/bootswrapper/nav.txt
  • Last modified: 4 years ago
  • by Giuseppe Di Terlizzi