Template:Clickable button
| This template is used in system messages, and on approximately 1,890,000 pages, or roughly 3% of all pages. Changes to it can cause immediate changes to the Wikipedia user interface. To avoid major disruption and server load, any changes should be tested in the template's /sandbox or /testcases subpages, or in your own user subpage. The tested changes can be added to this page in a single edit. Please discuss changes on the talk page before implementing them. |
| Buttons should not be used in the article namespace. If the desire is to "navigate" a reader to a new page, taking them away from the current page, a link is preferred. Buttons are used within Wikipedia to trigger an "action". |
| This template uses Lua: |
This template styles a link like a button, using the deprecated mediawiki.ui.button module. This expands the clickable area and tap target for the link.
Usage
- All parameters
{{Clickable button|wikilink|display|color=color|url=url|class=class|link=}}- wikilink
- Unnamed first parameter; the title of the page being linked. Brackets are not necessary
- display (optional)
- Optional unnamed second parameter; the text to display. Not needed if the text to display is the wikilink itself
|color=or|class=- Color to display.
|color=acceptsblueandred,|class=acceptsmw-ui-progressiveandmw-ui-destructive |url=- URL to link through the button. If no wikilink/display text is provided, will show the URL, otherwise will show the wikilink/display text
|link=no- Use this parameter set to "no" to display a button without linking to anything
Examples
Wikilinks
{{Clickable button|Main Page}}→{{Clickable button|Main Page|Click here to visit the main page}}→{{Clickable button|Click here|link=no}}→
Colors
{{Clickable button|Main Page}}→ – without defined|color=and|class=, the default is a white button{{Clickable button|Main Page|color=blue}}→{{Clickable button|Main Page|color=red}}→{{Clickable button|Main Page|class=mw-ui-progressive}}→{{Clickable button|Main Page|class=mw-ui-destructive}}→
URLs
{{Clickable button|url=https://example.com}}→{{Clickable button|Example|url=https://example.com}}→{{Clickable button|2=Example|url=https://example.com}}→
Adding an icon
Adding an icon to a button should be avoided. Don't forget to hide the icon from the accessibility DOM by wrapping it in a span that is aria-hidden="true" so that a screen reader doesn't read it out loud.
<span class="mw-ui-button mw-ui-progressive"><span aria-hidden="true">[[File:OOjs UI icon logo-wikimediaCommons-invert.svg|15px|link=|alt=]]</span> More details</span>
Template data
Styles a link like a button, using the mediawiki.ui.button module
| Parameter | Description | Type | Status | |
|---|---|---|---|---|
| Link/Label | 1 | Defines the page to link to, and uses that page's title as the text for the button
| Page name | required |
| Label | 2 | Defines the text that appears on the button
| Unknown | suggested |
| URL | url | Defines a web address for the button to link to
| URL | optional |
| class | class | Defines the visual type of the button
| String | optional |
| Custom CSS styling | style | Allows custom CSS styling to be applied to the button
| String | optional |
| Category switch | category | Whether or not categories should be on
| Boolean | optional |
| color | color | Defines the visual type of the button
| String | optional |
See also
- commons:Template:Clickable button, corresponding clickable button at Commons.
- phab:T146923, which dropped support for
mw-ui-constructive, the CSS class for green buttons
Content Disclaimer
Informasi ini disarikan dari Wikipedia dan disajikan kembali untuk tujuan edukasi. Konten tersedia di bawah lisensi CC BY-SA 3.0. Kami tidak bertanggung jawab atas ketidakakuratan data yang bersumber dari kontribusi publik tersebut.
- The information displayed on this website is sourced in part or in whole from Wikipedia and has been adapted for the purpose of restating it. We strive to provide accurate and relevant information, however:
- There is no guarantee of absolute accuracy. Wikipedia is an open, collaborative project that can be edited by anyone, so information is subject to change.
- It is not intended to constitute professional advice. The content displayed is for informational and educational purposes only. For important decisions (e.g., medical, legal, or financial), please consult a professional.
- Content copyright. Wikipedia is licensed under the Creative Commons Attribution-ShareAlike License (CC BY-SA). This means that content may be reused with appropriate attribution and shared under a similar license.
- Responsible use. Any risk arising from the use of information from this website is entirely the responsibility of the user.