Template:Itemlist/doc
Jump to navigation
Jump to search
Create a responsive items list.
You can use {{itemlist/options}} to change the default value for option parameters.
Usage
Parameters:
- All unnamed parameters: contents of every list item.
- optional width: item width, accepts any css width, default is 10em.
- optional class: css class(es).
- optional css or style: custom css rules applied to list items.
- optional boxcss or boxstyle: custom css rules applied to wrapper box.
Example
{{itemlist
|{{item|Grand Piano}}
|{{item|Sorcerer's Mirror}}
|{{item|Grim Pointer}}
|{{item|Bubble Magnet}}
|{{item|Greedy Magnet}}
|{{item|Mage Hand}}
|{{item|Theseus' Thread}}
|{{item|Queen's Glowstick}}
|{{item|Time Warp}}
}}
will result:
{{itemlist|width=18em|class=terraria
|{{item|Grand Piano}}
|{{item|Sorcerer's Mirror}}
|{{item|Grim Pointer}}
|{{item|Bubble Magnet}}
|{{item|Greedy Magnet}}
|{{item|Mage Hand}}
|{{item|Theseus' Thread}}
|{{item|Queen's Glowstick}}
|{{item|Time Warp}}
}}
will result:
{{itemlist|width=30em
|{{item|Grand Piano}}
|{{item|Sorcerer's Mirror}}
|{{item|Grim Pointer}}
|{{item|Bubble Magnet}}
|{{item|Greedy Magnet}}
|{{item|Mage Hand}}
|{{item|Theseus' Thread}}
|{{item|Queen's Glowstick}}
|{{item|Time Warp}}
}}
will result:
{{itemlist|width=15em|boxcss=line-height: 3
|{{item|Grand Piano}}
|{{item|Sorcerer's Mirror}}
|{{item|Grim Pointer}}
|{{item|Bubble Magnet}}
|{{item|Greedy Magnet}}
|{{item|Mage Hand}}
|{{item|Theseus' Thread}}
|{{item|Queen's Glowstick}}
|{{item|Time Warp}}
}}
will result:
There is another API style, it is more easier to use with DPL/cargo:
{{itemlist/start|width=20em}}
{{itemlist/item|{{item|Grand Piano}} }}
{{itemlist/item|{{item|Sorcerer's Mirror}} }}
{{itemlist/item|{{item|Grim Pointer}} }}
{{itemlist/item|{{item|Bubble Magnet}} }}
{{itemlist/end}}
will result:
All parameters of {{itemlist}} are available on {{itemlist/start}}, and every list item can also define their own CSS:
{{itemlist/start}}
{{itemlist/item|{{item|Grand Piano}}|css=border:1px solid red}}
{{itemlist/item|{{item|Sorcerer's Mirror}} }}
{{itemlist/item|{{item|Grim Pointer}} }}
{{itemlist/item|{{item|Bubble Magnet}}|css=border:2px dotted cyan}}
{{itemlist/end}}
will result in: