Template:Clickable button 2/doc: Difference between revisions

Latest revision as of 19:32, 8 June 2022

This is a documentation subpage for Template:Terminate sentence
It may contain usage information, categories and other content that is not part of the original template page.

Shortcuts

{{CLB2}}
{{Click}}

This template uses Lua:

Module:Clickable button 2

This template styles a link like a button, using the mediawiki.ui.button module. This expands the clickable area and tap target for the link. It can be used in the following ways,

Code: {{Clickable button 2|Main Page}}
- Result: Main Page
Code: {{Clickable button 2|Main Page|Cover page}}
- Result: Cover page
Code: {{Clickable button 2|Main Page|url=http://en.wikipedia.org}}
- Result: Main Page
Code: {{Clickable button 2|Main Page|class=mw-ui-destructive}}
- Result: Main Page
Code: {{Clickable button 2|Main Page|class=mw-ui-progressive}}
- Result: Main Page

Note: After the changes outlined in Phabricator task T110555 were implemented, {{Clickable button 2|Main Page|class=mw-ui-constructive}} produces the same output as {{Clickable button 2|Main Page|class=mw-ui-progressive}}.

Template data

Styles a link like a button, using the mediawiki.ui.button module

Template parameters
This template prefers inline formatting of parameters.
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 Example Foobar	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 Example https://www.example.com	URL	optional
class	`class`	Defines the visual type of the button Example mw-ui-progressive, mw-ui-destructive	String	optional
style	`style`	no description	String	optional
category	`category`	no description	Boolean	optional

@@ Line 1: / Line 1: @@
-{{template shortcut|CLB2}}
+{{Documentation subpage}}
-This template generates a clickable button that is styled using the mediawiki.ui.button module. It can be used in the following ways,
+{{template shortcut|CLB2|Click}}
+{{lua|Module:Clickable button 2}}
-*'''Code: '''<code><nowiki>{{Clickable button 2/sandbox|Main Page}}</nowiki></code>
+This template styles a link like a button, using the mediawiki.ui.button module. This expands the clickable area and tap target for the link. It can be used in the following ways,
-**'''Result: '''{{Clickable button 2/sandbox|Main Page}}
-*'''Code: '''<code><nowiki>{{Clickable button 2/sandbox|Main Page|Cover page}}</nowiki></code>
+*'''Code: '''<code><nowiki>{{Clickable button 2|Main Page}}</nowiki></code>
-**'''Result: '''{{Clickable button 2/sandbox|Main Page|Cover page}}
+**'''Result: '''{{Clickable button 2|Main Page}}
-*'''Code: '''<code><nowiki>{{Clickable button 2/sandbox|Home|url=http://en.wikipedia.org}}</nowiki></code>
+*'''Code: '''<code><nowiki>{{Clickable button 2|Main Page|Cover page}}</nowiki></code>
-**'''Result: '''{{Clickable button 2/sandbox|Main Page|url=http://en.wikipedia.org}}
+**'''Result: '''{{Clickable button 2|Main Page|Cover page}}
-*'''Code: '''<code><nowiki>{{Clickable button 2/sandbox|Main Page|class=mw-ui-constructive}}</nowiki></code>
+*'''Code: '''<code><nowiki>{{Clickable button 2|Main Page|url=http://en.wikipedia.org}}</nowiki></code>
-**'''Result: '''{{Clickable button 2/sandbox|Main Page|class=mw-ui-constructive}}
+**'''Result: '''{{Clickable button 2|Main Page|url=http://en.wikipedia.org}}
-*'''Code: '''<code><nowiki>{{Clickable button 2/sandbox|Main Page|class=mw-ui-destructive}}</nowiki></code>
+*'''Code: '''<code><nowiki>{{Clickable button 2|Main Page|class=mw-ui-destructive}}</nowiki></code>
-**'''Result: '''{{Clickable button 2/sandbox|Main Page|class=mw-ui-destructive}}
+**'''Result: '''{{Clickable button 2|Main Page|class=mw-ui-destructive}}
-*'''Code: '''<code><nowiki>{{Clickable button 2/sandbox|Main Page|class=mw-ui-progressive}}</nowiki></code>
+*'''Code: '''<code><nowiki>{{Clickable button 2|Main Page|class=mw-ui-progressive}}</nowiki></code>
-**'''Result: '''{{Clickable button 2/sandbox|Main Page|class=mw-ui-progressive}}
+**'''Result: '''{{Clickable button 2|Main Page|class=mw-ui-progressive}}
+'''Note: '''After the changes outlined in Phabricator task {{Phab|T110555}} were implemented, <code><nowiki>{{Clickable button 2|Main Page|class=mw-ui-constructive}}</nowiki></code> produces the same output as <code><nowiki>{{Clickable button 2|Main Page|class=mw-ui-progressive}}</nowiki></code>.
+=== Template data ===
+<templatedata>
+{
+	"params": {
+		"1": {
+			"required": true,
+			"label": "Link/Label",
+			"description": "Defines the page to link to, and uses that page's title as the text for the button",
+			"example": "Foobar",
+			"type": "wiki-page-name"
+		},
+		"2": {
+			"suggested": true,
+			"label": "Label",
+			"description": "Defines the text that appears on the button"
+		},
+		"url": {
+			"type": "url",
+			"label": "URL",
+			"description": "Defines a web address for the button to link to",
+			"example": "https://www.example.com"
+		},
+		"class": {
+			"type": "string",
+			"description": "Defines the visual type of the button",
+			"example": "mw-ui-progressive, mw-ui-destructive"
+		},
+		"style": {
+			"type": "string"
+		},
+		"category": {
+			"type": "boolean"
+		}
+	},
+	"description": "Styles a link like a button, using the mediawiki.ui.button module",
+	"format": "inline"
+}
+</templatedata>
-Note that if a browser does not have JavaScript enabled then no button is displayed but the text will still be displayed.
 === See also ===
 * [[commons:Template:Clickable button]], corresponding clickable button at Commons.
+* [https://design.wikimedia.org/style-guide/components/buttons.html Wikimedia design style guide advice on buttons]
 {{Button templates}}
-<includeonly>
+<includeonly>{{Sandbox other||
 <!-- Categories and interwikis go here: -->
 [[Category:Wikipedia formatting and function templates]]
 [[Category:Wikipedia button templates]]
-</includeonly>
+}}</includeonly>

v t e Button templates
General button templates	{{Clickable button}} {{Clickable button 2}} {{Branded Button}} {{Button}} (not clickable) {{Blue button}} {{Mw button}}
WikiProject-specific buttons	Article Wizard button button2 button wizard {{Big Blue Button}} {{Big Red Button}} {{Big Cyan Button}} {{Big Green Button}} {{Big Lime Button}} {{Big Orange Button}} {{Big Turquoise Button}} {{Big Fuchsia Button}} {{Big Skyblue Button}} {{Big Purple Button}} {{AFC button}} {{Cleanup Button}}
Category

Template:Clickable button 2/doc: Difference between revisions

Latest revision as of 19:32, 8 June 2022

Template data

See also

Navigation menu

Search