Templat: BootstrapTabsNavPills: Perbedaan antara revisi

Revisi per 16 Desember 2020 21.36

{{{tab1}}}

Dokumentasi templat

[lihat] [sunting] [riwayat] [hapus singgahan]

Pemakaian

{{ BootstrapTabs 
 | tabcount=

 | containerclass=
 | containerstyle=
 | tabclass=
 | tabstyle=
 | contentclass=
 | contentstyle=

 | tab1=
 | content1=

 | tab2=
 | content2=

 | tab3=
 | content3=

 | tab4=
 | content4=

 | tab5=
 | content5=

 | tab6=
 | content6=

 | tab7=
 | content7=

 | tab8=
 | content8=

 | tab9=
 | content9=

 | tab10=
 | content10=
}}

@@ Baris 1: / Baris 1: @@
 <ul class="nav nav-tabs nav-pills" id="Tabs_ID" role="tablist" style="margin-left: 0;">
    <li class="nav-item">
-     <btn class="nav-link active" id="AFirst-tab" data-toggle="tab" role="tab" aria-controls="ATheFirst" aria-selected="true">#ATheFirst|{{{tab1}}}</btn>
+     <btn class="nav-link active" id="ATab1-tab" data-toggle="tab" role="tab" aria-controls="ATab1" aria-selected="true">#ATab1|{{{tab1}}}</btn>
    </li>
-{{#ifexpr: {{{tabcount|1}}}>1 | <li class="nav-item">
+{{#ifexpr: {{{tabcount|1}}}>=2 | <li class="nav-item">
-     <btn class="nav-link" id="ASecond-tab" data-toggle="tab" role="tab" aria-controls="ATheSecond" aria-selected="true">#ATheSecond|{{{tab2}}}</btn>
+     <btn class="nav-link" id="ATab2-tab" data-toggle="tab" role="tab" aria-controls="ATab2" aria-selected="true">#ATab2|{{{tab2}}}</btn>
    </li> }}
-{{#ifexpr: {{{tabcount|1}}}>2 | <li class="nav-item">
+{{#ifexpr: {{{tabcount|1}}}>=3 | <li class="nav-item">
-     <btn class="nav-link" id="AThird-tab" data-toggle="tab" role="tab" aria-controls="ATheThird" aria-selected="true">#ATheThird|{{{tab3}}}</btn>
+     <btn class="nav-link" id="ATab3-tab" data-toggle="tab" role="tab" aria-controls="ATab3" aria-selected="true">#ATab3|{{{tab3}}}</btn>
    </li> }}
+{{#ifexpr: {{{tabcount|1}}}>=4 | <li class="nav-item">
+    <btn class="nav-link" id="ATab4-tab" data-toggle="tab" role="tab" aria-controls="ATab4" aria-selected="true">#ATab4|{{{tab4}}}</btn>
+  </li> }}
+{{#ifexpr: {{{tabcount|1}}}>=5 | <li class="nav-item">
+    <btn class="nav-link" id="ATab5-tab" data-toggle="tab" role="tab" aria-controls="ATab5" aria-selected="true">#ATab5|{{{tab5}}}</btn>
+  </li> }}
+{{#ifexpr: {{{tabcount|1}}}>=6 | <li class="nav-item">
+    <btn class="nav-link" id="ATab6-tab" data-toggle="tab" role="tab" aria-controls="ATab6" aria-selected="true">#ATab6|{{{tab6}}}</btn>
+  </li> }}
+{{#ifexpr: {{{tabcount|1}}}>=7 | <li class="nav-item">
+    <btn class="nav-link" id="ATab7-tab" data-toggle="tab" role="tab" aria-controls="ATab7" aria-selected="true">#ATab7|{{{tab7}}}</btn>
+  </li> }}
+{{#ifexpr: {{{tabcount|1}}}>=8 | <li class="nav-item">
+    <btn class="nav-link" id="ATab8-tab" data-toggle="tab" role="tab" aria-controls="ATab8" aria-selected="true">#ATab8|{{{tab8}}}</btn>
+  </li> }}
+{{#ifexpr: {{{tabcount|1}}}>=9 | <li class="nav-item">
+    <btn class="nav-link" id="ATab9-tab" data-toggle="tab" role="tab" aria-controls="ATab9" aria-selected="true">#ATab9|{{{tab9}}}</btn>
+  </li> }}
+{{#ifexpr: {{{tabcount|1}}}>=10 | <li class="nav-item">
+    <btn class="nav-link" id="ATab10-tab" data-toggle="tab" role="tab" aria-controls="ATab10" aria-selected="true">#ATab10|{{{tab10}}}</btn>
+  </li> }}
 </ul>
-<div class="tab-content" id="Tabs_Content" style="background: none;">
+<div class="tab-content p-3 {{{contentclass|}}}" id="Tabs_Content" style="background: none; {{{contentstyle|}}}">
+<div class="tab-pane fade show active" id="ATab1" role="tabpanel" aria-labelledby="ATab1-tab">
-<div class="tab-pane fade show active" id="ATheFirst" role="tabpanel" aria-labelledby="AFirst-tab">
 {{{1|}}}
-</div>
+</div><!--
-<div class="tab-pane fade" id="ATheSecond" role="tabpanel" aria-labelledby="ASecond-tab">
+-->{{#ifexpr: {{{tabcount|1}}}>=2 | <div class="tab-pane fade" id="ATab2" role="tabpanel" aria-labelledby="ATab2-tab">
 {{{2|}}}
-</div>
+</div>}}<!--
-<div class="tab-pane fade" id="ATheThird" role="tabpanel" aria-labelledby="AThird-tab">
+-->{{#ifexpr: {{{tabcount|1}}}>=3 | <div class="tab-pane fade" id="ATab3" role="tabpanel" aria-labelledby="ATab3-tab">
 {{{3|}}}
-</div>
+</div>}}<!--
+-->{{#ifexpr: {{{tabcount|1}}}>=4 | <div class="tab-pane fade" id="ATab4" role="tabpanel" aria-labelledby="ATab4-tab">
+{{{4|}}}
+</div>}}<!--
+-->{{#ifexpr: {{{tabcount|1}}}>=5 | <div class="tab-pane fade" id="ATab5" role="tabpanel" aria-labelledby="ATab5-tab">
+{{{5|}}}
+</div>}}<!--
+-->{{#ifexpr: {{{tabcount|1}}}>=6 | <div class="tab-pane fade" id="ATab6" role="tabpanel" aria-labelledby="ATab6-tab">
+{{{6|}}}
+</div>}}<!--
+-->{{#ifexpr: {{{tabcount|1}}}>=7 | <div class="tab-pane fade" id="ATab7" role="tabpanel" aria-labelledby="ATab7-tab">
+{{{7|}}}
+</div>}}<!--
+-->{{#ifexpr: {{{tabcount|1}}}>=8 | <div class="tab-pane fade" id="ATab8" role="tabpanel" aria-labelledby="ATab8-tab">
+{{{8|}}}
+</div>}}<!--
+-->{{#ifexpr: {{{tabcount|1}}}>=9 | <div class="tab-pane fade" id="ATab9" role="tabpanel" aria-labelledby="ATab9-tab">
+{{{9|}}}
+</div>}}<!--
+-->{{#ifexpr: {{{tabcount|1}}}>=10 | <div class="tab-pane fade" id="ATab10" role="tabpanel" aria-labelledby="ATab10-tab">
+{{{10|}}}
+</div>}}
 </div><noinclude>{{documentation}}</noinclude>