Navs (Tabs & Pills)
Tabs with DropDown menu
<nav type="tabs"> * [[:start]] * [[:wiki:plugin:bootswrapper:nav|Nav Plugin]] * [[playground:playground]] * DokuWiki * [[:wiki:welcome]] * [[:wiki:syntax]] </nav>
<nav type="tabs">
you can use <tabs>
alias.
Pills with DropDown menu
<nav type="pills"> * [[:start]] * [[:wiki:plugin:bootswrapper:nav|Nav Plugin]] * [[playground:playground]] * DokuWiki * [[:wiki:welcome]] * [[:wiki:syntax]] </nav>
<nav type="pills">
you can use <pills>
alias.
Pills stacked
<nav type="pills" stacked="true"> * [[:start]] * [[:wiki:plugin:bootswrapper:nav|Nav Plugin]] * [[playground:playground]] * DokuWiki * [[:wiki:welcome]] * [[:wiki:syntax]] </nav>
Pills justified
<nav type="pills" justified="true"> * [[:start]] * [[:wiki:plugin:bootswrapper:nav|Nav Plugin]] * [[playground:playground]] * DokuWiki * [[:wiki:welcome]] * [[:wiki:syntax]] </nav>
Tabs justified
<nav type="tabs" justified="true"> * [[:start]] * [[:wiki:plugin:bootswrapper:nav|Nav Plugin]] * [[playground:playground]] * DokuWiki * [[:wiki:welcome]] * [[:wiki:syntax]] </nav>
With Icons Plugin
<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>
Tab Pane
<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.
Tab Pane and Include Plugin
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.
Attributes
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 |