Templat: Tabbed: Perbedaan antara revisi

Dari GBI Danau Bogor Raya
Lompat ke: navigasi, cari
Leo (bicara | kontrib)
k upd
Leo (bicara | kontrib)
k upd fmt
 
(3 revisi perantara oleh pengguna yang sama tidak ditampilkan)
Baris 16: Baris 16:
_toggler_hide-{{{tabclass|tabb}}}10y _toggler_show-{{{tabclass|tabb}}}10w
_toggler_hide-{{{tabclass|tabb}}}10y _toggler_show-{{{tabclass|tabb}}}10w
"
"
style="padding: .25em .5em .25em .5em; background:{{{offcolor|#fafafa}}}; border:{{{borderstyles|1px #aaa solid}}}; display:none; width:1%; {{{isistyle|}}}">{{{tab1|Tab-1}}}</td>
style="padding: .25em .5em .25em .5em; background:{{{offcolor|#DDDDDD}}}; border:{{{borderstyles|1px #aaa solid}}}; display:none; width:1%; {{{tabstyle|}}}">{{{tab1|Tab-1}}}</td>


<td class="_toggle {{{tabclass|tabb}}}1 {{{tabclass|tabb}}}1y " style="padding: .25em .5em .25em .5em; background:{{{oncolor|white}}}; font-weight:bold; border:{{{borderstyles|1px #aaa solid}}}; border-bottom:none; width:1%; {{{isistyle|}}}">{{{tab1|Tab-1}}}</td>
<td class="_toggle {{{tabclass|tabb}}}1 {{{tabclass|tabb}}}1y " style="padding: .25em .5em .25em .5em; background:{{{oncolor|white}}}; font-weight:bold; border:{{{borderstyles|1px #aaa solid}}}; border-bottom:none; width:1%; {{{tabstyle|}}}">{{{tab1|Tab-1}}}</td>


{{#ifexpr: {{{tabcount|10}}}>=2 |
{{#ifexpr: {{{tabcount|10}}}>=2 |
Baris 34: Baris 34:
_toggler_hide-{{{tabclass|tabb}}}10y _toggler_show-{{{tabclass|tabb}}}10w
_toggler_hide-{{{tabclass|tabb}}}10y _toggler_show-{{{tabclass|tabb}}}10w
"
"
style="padding: .25em .5em .25em .5em; background:{{{offcolor|#fafafa}}}; border:{{{borderstyles|1px #aaa solid}}}; width:1%; {{{isistyle|}}}">{{{tab2|Tab-2}}}</td>
style="padding: .25em .5em .25em .5em; background:{{{offcolor|#DDDDDD}}}; border:{{{borderstyles|1px #aaa solid}}}; width:1%; {{{tabstyle|}}}">{{{tab2|Tab-2}}}</td>
<td class="_toggle {{{tabclass|tabb}}}2 {{{tabclass|tabb}}}2y " style="padding: .25em .5em .25em .5em; background:{{{oncolor|white}}}; font-weight:bold; border:{{{borderstyles|1px #aaa solid}}}; border-bottom:none; display:none; width:1%; {{{isistyle|}}}">{{{tab2|Tab-2}}}</td>
<td class="_toggle {{{tabclass|tabb}}}2 {{{tabclass|tabb}}}2y " style="padding: .25em .5em .25em .5em; background:{{{oncolor|white}}}; font-weight:bold; border:{{{borderstyles|1px #aaa solid}}}; border-bottom:none; display:none; width:1%; {{{tabstyle|}}}">{{{tab2|Tab-2}}}</td>
}}<!--
}}<!--


Baris 53: Baris 53:
_toggler_hide-{{{tabclass|tabb}}}10y _toggler_show-{{{tabclass|tabb}}}10w
_toggler_hide-{{{tabclass|tabb}}}10y _toggler_show-{{{tabclass|tabb}}}10w
"
"
style="padding: .25em .5em .25em .5em; background:{{{offcolor|#fafafa}}}; border:{{{borderstyles|1px #aaa solid}}}; width:1%; {{{isistyle|}}}">{{{tab3|Tab-3}}}</td>
style="padding: .25em .5em .25em .5em; background:{{{offcolor|#DDDDDD}}}; border:{{{borderstyles|1px #aaa solid}}}; width:1%; {{{tabstyle|}}}">{{{tab3|Tab-3}}}</td>
<td class="_toggle {{{tabclass|tabb}}}3 {{{tabclass|tabb}}}3y " style="padding: .25em .5em .25em .5em; background:{{{oncolor|white}}}; font-weight:bold; border:{{{borderstyles|1px #aaa solid}}}; border-bottom:none; display:none; width:1%; {{{isistyle|}}}">{{{tab3|Tab-3}}}</td>
<td class="_toggle {{{tabclass|tabb}}}3 {{{tabclass|tabb}}}3y " style="padding: .25em .5em .25em .5em; background:{{{oncolor|white}}}; font-weight:bold; border:{{{borderstyles|1px #aaa solid}}}; border-bottom:none; display:none; width:1%; {{{tabstyle|}}}">{{{tab3|Tab-3}}}</td>
}}<!--
}}<!--


Baris 72: Baris 72:
_toggler_hide-{{{tabclass|tabb}}}10y _toggler_show-{{{tabclass|tabb}}}10w
_toggler_hide-{{{tabclass|tabb}}}10y _toggler_show-{{{tabclass|tabb}}}10w
"
"
style="padding: .25em .5em .25em .5em; background:{{{offcolor|#fafafa}}}; border:{{{borderstyles|1px #aaa solid}}}; width:1%; {{{isistyle|}}}">{{{tab4|Tab-4}}}</td>
style="padding: .25em .5em .25em .5em; background:{{{offcolor|#DDDDDD}}}; border:{{{borderstyles|1px #aaa solid}}}; width:1%; {{{tabstyle|}}}">{{{tab4|Tab-4}}}</td>
<td class="_toggle {{{tabclass|tabb}}}4 {{{tabclass|tabb}}}4y " style="padding: .25em .5em .25em .5em; background:{{{oncolor|white}}}; font-weight:bold; border:{{{borderstyles|1px #aaa solid}}}; border-bottom:none; display:none; width:1%; {{{isistyle|}}}">{{{tab4|Tab-4}}}</td>
<td class="_toggle {{{tabclass|tabb}}}4 {{{tabclass|tabb}}}4y " style="padding: .25em .5em .25em .5em; background:{{{oncolor|white}}}; font-weight:bold; border:{{{borderstyles|1px #aaa solid}}}; border-bottom:none; display:none; width:1%; {{{tabstyle|}}}">{{{tab4|Tab-4}}}</td>
}}<!--
}}<!--


Baris 91: Baris 91:
_toggler_hide-{{{tabclass|tabb}}}10y _toggler_show-{{{tabclass|tabb}}}10w
_toggler_hide-{{{tabclass|tabb}}}10y _toggler_show-{{{tabclass|tabb}}}10w
"
"
style="padding: .25em .5em .25em .5em; background:{{{offcolor|#fafafa}}}; border:{{{borderstyles|1px #aaa solid}}}; width:1%; {{{isistyle|}}}">{{{tab5|Tab-5}}}</td>
style="padding: .25em .5em .25em .5em; background:{{{offcolor|#DDDDDD}}}; border:{{{borderstyles|1px #aaa solid}}}; width:1%; {{{tabstyle|}}}">{{{tab5|Tab-5}}}</td>
<td class="_toggle {{{tabclass|tabb}}}5 {{{tabclass|tabb}}}5y " style="padding: .25em .5em .25em .5em; background:{{{oncolor|white}}}; font-weight:bold; border:{{{borderstyles|1px #aaa solid}}}; border-bottom:none; display:none; width:1%; {{{isistyle|}}}">{{{tab5|Tab-5}}}</td>
<td class="_toggle {{{tabclass|tabb}}}5 {{{tabclass|tabb}}}5y " style="padding: .25em .5em .25em .5em; background:{{{oncolor|white}}}; font-weight:bold; border:{{{borderstyles|1px #aaa solid}}}; border-bottom:none; display:none; width:1%; {{{tabstyle|}}}">{{{tab5|Tab-5}}}</td>
}}<!--
}}<!--


Baris 110: Baris 110:
_toggler_hide-{{{tabclass|tabb}}}10y _toggler_show-{{{tabclass|tabb}}}10w
_toggler_hide-{{{tabclass|tabb}}}10y _toggler_show-{{{tabclass|tabb}}}10w
"
"
style="padding: .25em .5em .25em .5em; background:{{{offcolor|#fafafa}}}; border:{{{borderstyles|1px #aaa solid}}}; width:1%; {{{isistyle|}}}">{{{tab6|Tab-6}}}</td>
style="padding: .25em .5em .25em .5em; background:{{{offcolor|#DDDDDD}}}; border:{{{borderstyles|1px #aaa solid}}}; width:1%; {{{tabstyle|}}}">{{{tab6|Tab-6}}}</td>
<td class="_toggle {{{tabclass|tabb}}}6 {{{tabclass|tabb}}}6y " style="padding: .25em .5em .25em .5em; background:{{{oncolor|white}}}; font-weight:bold; border:{{{borderstyles|1px #aaa solid}}}; border-bottom:none; display:none; width:1%; {{{isistyle|}}}">{{{tab6|Tab-6}}}</td>
<td class="_toggle {{{tabclass|tabb}}}6 {{{tabclass|tabb}}}6y " style="padding: .25em .5em .25em .5em; background:{{{oncolor|white}}}; font-weight:bold; border:{{{borderstyles|1px #aaa solid}}}; border-bottom:none; display:none; width:1%; {{{tabstyle|}}}">{{{tab6|Tab-6}}}</td>
}}<!--
}}<!--


Baris 129: Baris 129:
_toggler_hide-{{{tabclass|tabb}}}10y _toggler_show-{{{tabclass|tabb}}}10w
_toggler_hide-{{{tabclass|tabb}}}10y _toggler_show-{{{tabclass|tabb}}}10w
"
"
style="padding: .25em .5em .25em .5em; background:{{{offcolor|#fafafa}}}; border:{{{borderstyles|1px #aaa solid}}}; width:1%; {{{isistyle|}}}">{{{tab7|Tab-7}}}</td>
style="padding: .25em .5em .25em .5em; background:{{{offcolor|#DDDDDD}}}; border:{{{borderstyles|1px #aaa solid}}}; width:1%; {{{tabstyle|}}}">{{{tab7|Tab-7}}}</td>
<td class="_toggle {{{tabclass|tabb}}}7 {{{tabclass|tabb}}}7y " style="padding: .25em .5em .25em .5em; background:{{{oncolor|white}}}; font-weight:bold; border:{{{borderstyles|1px #aaa solid}}}; border-bottom:none; display:none; width:1%; {{{isistyle|}}}">{{{tab7|Tab-7}}}</td>
<td class="_toggle {{{tabclass|tabb}}}7 {{{tabclass|tabb}}}7y " style="padding: .25em .5em .25em .5em; background:{{{oncolor|white}}}; font-weight:bold; border:{{{borderstyles|1px #aaa solid}}}; border-bottom:none; display:none; width:1%; {{{tabstyle|}}}">{{{tab7|Tab-7}}}</td>
}}<!--
}}<!--


Baris 148: Baris 148:
_toggler_hide-{{{tabclass|tabb}}}10y _toggler_show-{{{tabclass|tabb}}}10w
_toggler_hide-{{{tabclass|tabb}}}10y _toggler_show-{{{tabclass|tabb}}}10w
"
"
style="padding: .25em .5em .25em .5em; background:{{{offcolor|#fafafa}}}; border:{{{borderstyles|1px #aaa solid}}}; width:1%; {{{isistyle|}}}">{{{tab8|Tab-8}}}</td>
style="padding: .25em .5em .25em .5em; background:{{{offcolor|#DDDDDD}}}; border:{{{borderstyles|1px #aaa solid}}}; width:1%; {{{tabstyle|}}}">{{{tab8|Tab-8}}}</td>
<td class="_toggle {{{tabclass|tabb}}}8 {{{tabclass|tabb}}}8y " style="padding: .25em .5em .25em .5em; background:{{{oncolor|white}}}; font-weight:bold; border:{{{borderstyles|1px #aaa solid}}}; border-bottom:none; display:none; width:1%; {{{isistyle|}}}">{{{tab8|Tab-8}}}</td>
<td class="_toggle {{{tabclass|tabb}}}8 {{{tabclass|tabb}}}8y " style="padding: .25em .5em .25em .5em; background:{{{oncolor|white}}}; font-weight:bold; border:{{{borderstyles|1px #aaa solid}}}; border-bottom:none; display:none; width:1%; {{{tabstyle|}}}">{{{tab8|Tab-8}}}</td>
}}<!--
}}<!--


Baris 167: Baris 167:
_toggler_hide-{{{tabclass|tabb}}}10y _toggler_show-{{{tabclass|tabb}}}10w
_toggler_hide-{{{tabclass|tabb}}}10y _toggler_show-{{{tabclass|tabb}}}10w
"
"
style="padding: .25em .5em .25em .5em; background:{{{offcolor|#fafafa}}}; border:{{{borderstyles|1px #aaa solid}}}; width:1%; {{{isistyle|}}}">{{{tab9|Tab-9}}}</td>
style="padding: .25em .5em .25em .5em; background:{{{offcolor|#DDDDDD}}}; border:{{{borderstyles|1px #aaa solid}}}; width:1%; {{{tabstyle|}}}">{{{tab9|Tab-9}}}</td>
<td class="_toggle {{{tabclass|tabb}}}9 {{{tabclass|tabb}}}9y " style="padding: .25em .5em .25em .5em; background:{{{oncolor|white}}}; font-weight:bold; border:{{{borderstyles|1px #aaa solid}}}; border-bottom:none; display:none; width:1%; {{{isistyle|}}}">{{{tab9|Tab-9}}}</td>
<td class="_toggle {{{tabclass|tabb}}}9 {{{tabclass|tabb}}}9y " style="padding: .25em .5em .25em .5em; background:{{{oncolor|white}}}; font-weight:bold; border:{{{borderstyles|1px #aaa solid}}}; border-bottom:none; display:none; width:1%; {{{tabstyle|}}}">{{{tab9|Tab-9}}}</td>
}}<!--
}}<!--


Baris 186: Baris 186:
_toggler_hide-{{{tabclass|tabb}}}9y _toggler_show-{{{tabclass|tabb}}}9w
_toggler_hide-{{{tabclass|tabb}}}9y _toggler_show-{{{tabclass|tabb}}}9w
"
"
style="padding: .25em .5em .25em .5em; background:{{{offcolor|#fafafa}}}; border:{{{borderstyles|1px #aaa solid}}}; width:1%; {{{isistyle|}}}">{{{tab1|Tab-10}}}</td>
style="padding: .25em .5em .25em .5em; background:{{{offcolor|#DDDDDD}}}; border:{{{borderstyles|1px #aaa solid}}}; width:1%; {{{tabstyle|}}}">{{{tab10|Tab-10}}}</td>
<td class="_toggle {{{tabclass|tabb}}}10 {{{tabclass|tabb}}}10y " style="padding: .25em .5em .25em .5em; background:{{{oncolor|white}}}; font-weight:bold; border:{{{borderstyles|1px #aaa solid}}}; border-bottom:none; display:none; width:1%; {{{isistyle|}}}">{{{tab1|Tab-10}}}</td>
<td class="_toggle {{{tabclass|tabb}}}10 {{{tabclass|tabb}}}10y " style="padding: .25em .5em .25em .5em; background:{{{oncolor|white}}}; font-weight:bold; border:{{{borderstyles|1px #aaa solid}}}; border-bottom:none; display:none; width:1%; {{{tabstyle|}}}">{{{tab10|Tab-10}}}</td>
}}
}}
<td style="border-bottom:{{{borderstyles|1px #aaa solid}}}; width:100%;"></td>
<td style="border-bottom:{{{borderstyles|1px #aaa solid}}}; width:100%;"></td>
Baris 194: Baris 194:
<td colspan="21" style="background:{{{oncolor|white}}}; border:{{{borderstyles|1px #aaa solid}}}; border-top:none; padding: 1em 1em 1em 1em;">
<td colspan="21" style="background:{{{oncolor|white}}}; border:{{{borderstyles|1px #aaa solid}}}; border-top:none; padding: 1em 1em 1em 1em;">


<div class="_toggle {{{tabclass|tabb}}}1 {{{tabclass|tabb}}}1y">
<div class="_toggle {{{tabclass|tabb}}}1 {{{tabclass|tabb}}}1y" style="{{{isistyle|}}}">
{{{isitab1|Ini adalah isi dari Tab pertama}}}</div>
{{{isitab1|Ini adalah isi dari Tab pertama}}}</div>
<div class="_toggle {{{tabclass|tabb}}}2 {{{tabclass|tabb}}}2y" style="display:none;">
<div class="_toggle {{{tabclass|tabb}}}2 {{{tabclass|tabb}}}2y" style="display:none; {{{isistyle|}}}">
{{{isitab2|Ini adalah isi dari Tab kedua}}}</div>
{{{isitab2|Ini adalah isi dari Tab kedua}}}</div>
<div class="_toggle {{{tabclass|tabb}}}3 {{{tabclass|tabb}}}3y" style="display:none;">
<div class="_toggle {{{tabclass|tabb}}}3 {{{tabclass|tabb}}}3y" style="display:none; {{{isistyle|}}}">
{{{isitab3|Ini adalah isi dari Tab ketiga}}}</div>
{{{isitab3|Ini adalah isi dari Tab ketiga}}}</div>
<div class="_toggle {{{tabclass|tabb}}}4 {{{tabclass|tabb}}}4y" style="display:none;">
<div class="_toggle {{{tabclass|tabb}}}4 {{{tabclass|tabb}}}4y" style="display:none; {{{isistyle|}}}">
{{{isitab4|Ini adalah isi dari Tab keempat}}}</div>
{{{isitab4|Ini adalah isi dari Tab keempat}}}</div>
<div class="_toggle {{{tabclass|tabb}}}5 {{{tabclass|tabb}}}5y" style="display:none;">
<div class="_toggle {{{tabclass|tabb}}}5 {{{tabclass|tabb}}}5y" style="display:none; {{{isistyle|}}}">
{{{isitab5|Ini adalah isi dari Tab kelima}}}</div>
{{{isitab5|Ini adalah isi dari Tab kelima}}}</div>
<div class="_toggle {{{tabclass|tabb}}}6 {{{tabclass|tabb}}}6y" style="display:none;">
<div class="_toggle {{{tabclass|tabb}}}6 {{{tabclass|tabb}}}6y" style="display:none; {{{isistyle|}}}">
{{{isitab6|Ini adalah isi dari Tab keenam}}}</div>
{{{isitab6|Ini adalah isi dari Tab keenam}}}</div>
<div class="_toggle {{{tabclass|tabb}}}7 {{{tabclass|tabb}}}7y" style="display:none;">
<div class="_toggle {{{tabclass|tabb}}}7 {{{tabclass|tabb}}}7y" style="display:none; {{{isistyle|}}}">
{{{isitab7|Ini adalah isi dari Tab ketujuh}}}</div>
{{{isitab7|Ini adalah isi dari Tab ketujuh}}}</div>
<div class="_toggle {{{tabclass|tabb}}}8 {{{tabclass|tabb}}}8y" style="display:none;">
<div class="_toggle {{{tabclass|tabb}}}8 {{{tabclass|tabb}}}8y" style="display:none; {{{isistyle|}}}">
{{{isitab8|Ini adalah isi dari Tab kedelapan}}}</div>
{{{isitab8|Ini adalah isi dari Tab kedelapan}}}</div>
<div class="_toggle {{{tabclass|tabb}}}9 {{{tabclass|tabb}}}9y" style="display:none;">
<div class="_toggle {{{tabclass|tabb}}}9 {{{tabclass|tabb}}}9y" style="display:none; {{{isistyle|}}}">
{{{isitab9|Ini adalah isi dari Tab kesembilan}}}</div>
{{{isitab9|Ini adalah isi dari Tab kesembilan}}}</div>
<div class="_toggle {{{tabclass|tabb}}}10 {{{tabclass|tabb}}}10y" style="display:none;">
<div class="_toggle {{{tabclass|tabb}}}10 {{{tabclass|tabb}}}10y" style="display:none; {{{isistyle|}}}">
{{{isitab10|Ini adalah isi dari Tab kesepuluh}}}</div>
{{{isitab10|Ini adalah isi dari Tab kesepuluh}}}</div>



Revisi terkini sejak 18 Juni 2010 16.19

Dokumentasi templat

Parameter

{{tabbed
 | tabclass =
 | tabcount = 
 | borderstyles = 
 | offcolor = 
 | oncolor = 

 | tabstyle = 
 | isistyle = 

 | tab1 = 
 | tab2 = 
 | tab3 = 
 | tab4 = 
 | tab5 = 
 | tab6 = 
 | tab7 = 
 | tab8 = 
 | tab9 = 
 | tab10= 

 | isitab1 = 
 | isitab2 = 
 | isitab3 = 
 | isitab4 = 
 | isitab5 = 
 | isitab6 = 
 | isitab7 = 
 | isitab8 = 
 | isitab9 = 
 | isitab10= 

}}

Pemakaian

  • tabclass: identitas spesifik sebagai prefiks kelas tab yang digunakan. Default: tabb. Bisa diisi apa saja.
  • tabcount: jumlah tab yang diinginkan, diisi dengan 1-10. Default: 10.
  • borderstyles: style CSS untuk border
  • offcolor: warna tab/isitab yang tidak aktif
  • oncolor: warna tab/isitab yang sedang aktif
  • tab1-10: nama tab yang bersangkutan
  • isitab1-10: isi dari tab

Contoh

Kode Hasil tampilan
{{tabbed
 | tabcount=3
 | tab1=Kota Bogor
 | tab2=Kabupaten Bogor
 | tab3=Internasional

 | isitab1 = Daftar jemaat di kota Bogor:
* Danau Bogor Raya
* Jalan Sudirman
* Jalan Siliwangi
* Warung Jambu
* Bukit Cimanggu City
* dan lain-lain

 | isitab2 = Daftar jemaat di kabupaten Bogor:
* Cibinong
* Gunung Putri
* Sukabumi
* Cianjur
* dan lain-lain

 | isitab3 = Daftar jemaat di negara lain:
* Groningen, Belanda
* Dordrecht, Belanda
* Kelantan, Malaysia
}}
Kota Bogor Kabupaten Bogor Internasional

Daftar jemaat di kota Bogor:

  • Danau Bogor Raya
  • Jalan Sudirman
  • Jalan Siliwangi
  • Warung Jambu
  • Bukit Cimanggu City
  • dan lain-lain