Predefinição:Botão

Botão Bootstrap 4 compatível com MediaWiki (sem HTML bloqueado).

Parâmetros: - name = texto - link = página interna ou URL externa - color = primary, secondary, success, danger, warning, info, light, dark - outline = 1 - size = sm, lg - block = 1 (btn-block) - icon = classes (ex: fa fa-user) - iconpos = left/right (default: left) - disabled = 1 - tooltip = texto do tooltip - title = título (fallback acessível) - class = classes extras

Exemplos:

{{#vardefine:color|success}} {{#vardefine:style|btn-{{#var:color}}}} {{#vardefine:size|}} {{#vardefine:block|}} {{#vardefine:disabled|}}

{{#vardefine:tooltip|

}}

{{#vardefine:titleAttr|

}}

{{#vardefine:iconLeft| }}

{{#vardefine:iconRight|

}}

{{#vardefine:content| {{#var:iconLeft}}Salvar{{#var:iconRight}} }}

{{#vardefine:classes| btn {{#var:style}} {{#var:size}} {{#var:block}} {{#var:disabled}}

}}

   {{#var:content}}
 

{{#vardefine:color|danger}} {{#vardefine:style|btn-outline-{{#var:color}}}} {{#vardefine:size|}} {{#vardefine:block|}} {{#vardefine:disabled|}}

{{#vardefine:tooltip|

}}

{{#vardefine:titleAttr|

}}

{{#vardefine:iconLeft|

}}

{{#vardefine:iconRight|

}}

{{#vardefine:content| {{#var:iconLeft}}Excluir{{#var:iconRight}} }}

{{#vardefine:classes| btn {{#var:style}} {{#var:size}} {{#var:block}} {{#var:disabled}}

}}

   {{#var:content}}
 

{{#vardefine:color|primary}} {{#vardefine:style|btn-{{#var:color}}}} {{#vardefine:size|}} {{#vardefine:block|}} {{#vardefine:disabled|}}

{{#vardefine:tooltip| data-toggle="tooltip" title="Mais info" }}

{{#vardefine:titleAttr|

}}

{{#vardefine:iconLeft|

}}

{{#vardefine:iconRight|

}}

{{#vardefine:content| {{#var:iconLeft}}Ajuda{{#var:iconRight}} }}

{{#vardefine:classes| btn {{#var:style}} {{#var:size}} {{#var:block}} {{#var:disabled}}

}}

   {{#var:content}}
 

Botão estilizado com Bootstrap 4 compatível com MediaWiki. Detecta automaticamente links internos e externos. Suporta cores, outline, tamanho, largura total, ícones e tooltip.

Parâmetros da predefinição[Editar dados da predefinição]

Esta predefinição prefere a formatação em linha dos parâmetros.

Parâmetro		Descrição	Tipo	Estado
Texto do botão	name	Texto exibido dentro do botão Padrão Texto Exemplo Clique aqui	String	opcional
Link	link	Página interna (ex: Brasil) ou URL externa (ex: https://google.com). Se vazio, o botão não será clicável. Exemplo Brasil	String	opcional
Cor	color	Cor do botão (Bootstrap 4) Valores sugeridos primary secondary success danger warning info light dark Padrão primary	String	opcional
Outline	outline	Usa estilo com borda (btn-outline-*)	Booleano	opcional
Tamanho	size	Define o tamanho do botão Valores sugeridos sm lg Exemplo lg	String	opcional
Largura total	block	Ocupa toda a largura disponível (btn-block)	Booleano	opcional
Ícone	icon	Classes do ícone (ex: fa fa-user) Exemplo fa fa-check	String	opcional
Posição do ícone	iconpos	Define a posição do ícone em relação ao texto Valores sugeridos left right Padrão left	String	opcional
Tooltip	tooltip	Texto exibido ao passar o mouse (requer Bootstrap JS ativo) Exemplo Mais informações	String	opcional
Título	title	Texto alternativo (acessibilidade) Exemplo Clique para abrir	String	opcional
Desabilitado	disabled	Aplica estilo de botão desabilitado (visual)	Booleano	opcional
Classes extras	class	Classes CSS adicionais Exemplo mt-2 mb-2	String	opcional

anterior

[[{{{link}}}|Texto do botão]]

Como Usar

Utilizando o Editor Visual

Selecione inserir Predefinição no Editor Visual e informe os parâmetros:

color: define a cor do botão predefinida nos estilos. Escolha uma das seguintes opções: red, green, white, ou blue.

Texto do botão red Texto do botão green Texto do botão white Texto do botão blue

link: Informe o link da página cujo botão acionará.

name: Informe o texto que aparecerá no botão.

Utilizando o editor de código

Basta chamar a predefinição na página que deseja-se utilizar e inserir três parâmetros como no exemplo abaixo:

{{Botão
|link=Dicionário de Favelas Marielle Franco
|color=red
|name=Página Inicial
}}

Resultado:

{{#vardefine:color|red}} {{#vardefine:style|btn-{{#var:color}}}} {{#vardefine:size|}} {{#vardefine:block|}} {{#vardefine:disabled|}}

{{#vardefine:tooltip|

}}

{{#vardefine:titleAttr|

}}

{{#vardefine:iconLeft|

}}

{{#vardefine:iconRight|

}}

{{#vardefine:content| {{#var:iconLeft}}Página Inicial{{#var:iconRight}} }}

{{#vardefine:classes| btn {{#var:style}} {{#var:size}} {{#var:block}} {{#var:disabled}}

}}

[Dicionário de Favelas Marielle Franco {{#var:content}}]

Código

[[{{{link}}}|<span class="btn {{#switch: {{{color|red}}} | red = btn-primary  | green = btn-secondary | white = btn-warning | blue = btn-info}}" role="button" aria-disabled="false">{{{name|Texto do botão}}}</span>]]