Difference between revisions of "Template:Font color/doc"
imported>Cpiral (→Purpose: better paragraphs, less clutter, more accuracy) |
imported>Cpiral (ce: add spacing, improve examples) |
||
| Line 5: | Line 5: | ||
== Purpose == | == Purpose == | ||
| − | {{tl|Font color}} is how you insert colorized text, such as | + | {{tl | Font color }} is how you insert colorized text, such as |
| − | {{font color|red|red}}, | + | {{ font color | red | red }}, |
| − | {{font color|orange|orange}}, | + | {{ font color | orange | orange }}, |
| − | {{font color|green|green}}, | + | {{ font color | green | green }}, |
| − | {{font color|blue|blue|link=cat}} and | + | {{ font color | blue | blue | link = cat }} and |
| − | {{font color|indigo|indigo}}, | + | {{ font color | indigo | indigo }}, |
and [[Help:Color#Color generation guide|many others]]. | and [[Help:Color#Color generation guide|many others]]. | ||
| − | You can specify its {{font color|bg=yellow|fg=indigo|text=background}} color at the same time. | + | You can specify its {{ font color | bg=yellow | fg=indigo | text=background }} color at the same time. |
| − | {{tl|Font color}} is also how you can color wikilinks | + | {{tl | Font color }} is also how you can color wikilinks |
to something other than blue for when you need to work within background colors. | to something other than blue for when you need to work within background colors. | ||
Normally <kbd>[<nowiki/>[ wikilink ]]</kbd> → [[wikilink]], | Normally <kbd>[<nowiki/>[ wikilink ]]</kbd> → [[wikilink]], | ||
| − | but but here we use a {{tl|font color}} with {{para|link}} to create a black wikilink → | + | but but here we use a {{tl | font color }} with {{para | link }} to create a black wikilink → |
| − | {{font color|black|violet|link=yes| wikilink }} | + | {{ font color | black | violet | link=yes | wikilink }} |
You can make any text link to any page using the {{para|link}} parameter. | You can make any text link to any page using the {{para|link}} parameter. | ||
| Line 28: | Line 28: | ||
== Usage == | == Usage == | ||
| − | {{tlf|Font color}} has a one-color and a two-color form: | + | {{tlf | Font color }} has a one-color and a two-color form: |
| − | : <kbd>{<nowiki/>{font color|''color''|''text''}}</kbd> | + | : <kbd>{<nowiki/>{font color | ''color'' | ''text'' }}</kbd> |
| − | : <kbd>{<nowiki/>{font color|''text color''|''background color''|''text''}}</kbd>. | + | : <kbd>{<nowiki/>{font color | ''text color'' | ''background color'' | ''text'' }}</kbd>. |
Either form has a <kbd>|link=</kbd> option, for colorizing (otherwise blue or red) wikilink text. | Either form has a <kbd>|link=</kbd> option, for colorizing (otherwise blue or red) wikilink text. | ||
| Line 37: | Line 37: | ||
You can also name the other fields. | You can also name the other fields. | ||
| − | : <kbd>{<nowiki/>{font color|fg=''color''|text=''text''}}</kbd> | + | : <kbd>{<nowiki/>{font color | fg=''color'' | text=''text'' }}</kbd> |
| − | : <kbd>{<nowiki/>{font color|fg=''text color''|bg=''background color''|text=''text''}}</kbd> | + | : <kbd>{<nowiki/>{font color | fg=''text color'' | bg=''background color'' | text=''text'' }}</kbd> |
You can name <kbd>|fg=</kbd> or <kbd>|bg=</kbd>, which is nice, but... | You can name <kbd>|fg=</kbd> or <kbd>|bg=</kbd>, which is nice, but... | ||
if you name either of them, you must also name <kbd>|text=</kbd>, which is a compromise. | if you name either of them, you must also name <kbd>|text=</kbd>, which is a compromise. | ||
(See [[Help:Template#Parameters]] for why.) | (See [[Help:Template#Parameters]] for why.) | ||
| − | Spacing is | + | Spacing is of no concern. |
| − | :<code>.</code>{<nowiki/>{ font color | tan | green | | + | :<code>.</code><kbd>{<nowiki/>{font color|tan|green|text with four words}}</kbd><code>.</code> → <code>.</code>{{font color|tan|green|text with four words }}<code>.</code> |
| − | :<code>.</code> {<nowiki/>{ font color | | + | :<code>.</code><kbd> {<nowiki/>{font color|tan|green|text with four words}} </kbd><code>.</code> → <code>.</code> {{font color|tan|green|text with four words }} <code>.</code> |
| + | :<code>.</code><kbd> {<nowiki/>{ font color | tan | green | text with four words }} </kbd><code>.</code> → <code>.</code> {{ font color | tan | green | text with four words }} <code>.</code> | ||
| − | ===Parameters=== | + | === Parameters === |
{{Aligned table | {{Aligned table | ||
|cols=3 |style=padding:0.5em 0;line-height:1.35em;margin-bottom:1.0em; | |cols=3 |style=padding:0.5em 0;line-height:1.35em;margin-bottom:1.0em; | ||
| Line 79: | Line 80: | ||
!Renders as | !Renders as | ||
|- | |- | ||
| − | |<code><nowiki>{{font color|green|green text}}</nowiki></code> | + | | <code><nowiki>{{ font color | green | green text }}</nowiki></code> |
| − | |{{font color|green|green text}} | + | | {{ font color | green | green text }} |
|- | |- | ||
| − | |<code><nowiki>{{font color|blue|do not style text as a link}}</nowiki></code> | + | | <code><nowiki>{{ font color | blue | do not style text as a link }}</nowiki></code> |
| − | |{{font color|blue|do not style text as a link}} | + | | {{ font color | blue | do not style text as a link }} |
|- | |- | ||
| − | |<code><nowiki>{{font color|white|black|white with black background}}</nowiki></code> | + | | <code><nowiki>{{ font color | white | black | white with black background }}</nowiki></code> |
| − | |{{font color|white|black|white with black background}} | + | | {{ font color | white | black | white with black background }} |
|- | |- | ||
| − | ||<code>{<nowiki/>{font color'''{{big|{{!}}<nowiki/>{{!}}}}'''yellow|default text in yellow background}}</code> | + | | | <code>{<nowiki/>{font color'''{{big | {{! }}<nowiki/>{{! }} }}'''yellow | default text in yellow background }}</code> |
| − | |{{font color||yellow|default text in yellow background}} | + | | {{ font color | | yellow | default text in yellow background }} |
|- | |- | ||
| − | ||<code>{<nowiki/>{font color'''{{big|{{!}}}}'''bg=yellow|text=default text in yellow background}}</code> | + | | | <code>{<nowiki/>{font color'''{{big | {{! }} }}'''bg=yellow | text=default text in yellow background }}</code> |
| − | |{{font color|bg=yellow|text=default text in yellow background}} | + | | {{ font color | bg=yellow | text=default text in yellow background }} |
|} | |} | ||
| Line 99: | Line 100: | ||
!Renders as | !Renders as | ||
|- | |- | ||
| − | |<code><nowiki>{{font color|white|blue|Wikipedia:Example|link=yes}}</nowiki></code></code> | + | | <code><nowiki>{{ font color | white | blue | Wikipedia:Example | link = yes }}</nowiki></code></code> |
| − | |{{font color|white|blue|Wikipedia:Example|link=yes}} | + | | {{ font color | white | blue | Wikipedia:Example | link = yes }} |
|- | |- | ||
| − | |<code><nowiki>{{font color|white|blue|Example|link=Wikipedia:Sandbox}}</nowiki></code> | + | | <code><nowiki>{{ font color | white | blue | Wikipedia:Example | link = Wikipedia:Sandbox }}</nowiki></code> |
| − | |{{font color|white|blue|Example|link=Wikipedia:Sandbox}} | + | | {{ font color | white | blue | Wikipedia:Example | link = Wikipedia:Sandbox }} |
|- | |- | ||
| − | |<code><nowiki>{{font color|text=Example|link=Wikipedia:Sandbox|bg=blue|fg=white}}</nowiki></code> | + | | <code><nowiki>{{ font color | text = Wikipedia:Example | link = Wikipedia:Sandbox | bg |
| − | |{{font color|text=Example|link=Wikipedia:Sandbox|bg=blue|fg=white}} | + | = blue | fg = white }}</nowiki></code> |
| + | | {{ font color | text = Wikipedia:Example | link = Wikipedia:Sandbox | bg = blue | fg = white }} | ||
|} | |} | ||
The {{para|link}} parameter is a good way to colorize wikilinks, | The {{para|link}} parameter is a good way to colorize wikilinks, | ||
and it is about as much typing as the [[wp:pipe trick|pipe trick]]. | and it is about as much typing as the [[wp:pipe trick|pipe trick]]. | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | < | + | Although a wikilink's label will accept any template, |
| − | + | <code>{{big|[<nowiki/>[}} Wikipedia:Example | {<nowiki />{font color | white | blue | Wikipedia:Example }} {{big|]]}}</code> → | |
| − | {{ | + | [[Wikipedia:Example | {{ font color | white | blue | Wikipedia:Example }}]] (a font-colored link), |
| − | + | this template does not accept a wiklink, it only provides {{para|link}}: | |
| − | {{ | + | *{{OK }}{<nowiki/>{ font color | black | violet | Wikipedia:Example | link=yes }} → {{ font color | black | violet | Wikipedia:Example | link=yes }} (a linked {{tl | font color }}) |
| + | *{{cross }}{<nowiki/>{ font color | black | violet | [<nowiki/>[Wikipedia:Example]] }} → {{ font color | black | violet | [[Wikipedia:Example]] }} (The wikilink caused the color to fail.) | ||
| + | *{{cross }}{<nowiki/>{ font color | black | violet | [<nowiki/>[Wikipedia:Exammple]] }} → {{ font color | black | violet | [[Wikipedia:Exammple]] }} (The wikilink caused the color to fail.) | ||
<!-- | <!-- | ||
--><includeonly>For more examples see [[/testcases]].</includeonly> | --><includeonly>For more examples see [[/testcases]].</includeonly> | ||
For actual mainspace template usage, here are search links for | For actual mainspace template usage, here are search links for | ||
| − | * {{sl|hastemplate:"font color"|label=all usage}}. | + | * {{sl | hastemplate:"font color" | label=all usage }}. |
| − | * {{template usage|font color|pattern=link=|prefix=:|label=where <code>{{!}}link=</code> is used}}. | + | * {{template usage | font color | pattern=link= | prefix=: | label=where <code>{{! }}link=</code> is used }}. |
| − | * {{sl|hastemplate: "font color" prefix:F}} | + | * {{sl | hastemplate: "font color" prefix:F }} |
==See also== | ==See also== | ||
Revision as of 21:13, 15 December 2015
| File:Edit-copy green.svg | This is a documentation subpage for Template:Font color. It contains usage information, categories and other content that is not part of the original template page. |
| Links should clearly be identifiable as links to readers. Refrain from implementing colored links that may impede user ability to distinguish links from regular text, or color links for purely aesthetic reasons. See the guides to editing articles for accessibility at contrast, accessibility and navbox colors. |
Contents
Purpose
{{ Font color }} is how you insert colorized text, such as red, orange, green, blue and indigo, and many others. You can specify its background color at the same time.
{{ Font color }} is also how you can color wikilinks
to something other than blue for when you need to work within background colors.
Normally [[ wikilink ]] → wikilink,
but but here we use a {{ font color }} with |link = to create a black wikilink →
wikilink
You can make any text link to any page using the |link= parameter.
This template will use the latest Wikipedia:HTML5 recommendations,
inserting the span tags
<span style=color:color>...</span> and
<span style=background-color:color>...</span> for you, so your page increases its readability and usability in both the wikitext and the rendered page.
Usage
{{Font color}} has a one-color and a two-color form:
- {{font color | color | text }}
- {{font color | text color | background color | text }}.
Either form has a |link= option, for colorizing (otherwise blue or red) wikilink text.
- |link=yes →
[[text]] - |link=fullpagename →
[[fullpagename]]
You can also name the other fields.
- {{font color | fg=color | text=text }}
- {{font color | fg=text color | bg=background color | text=text }}
You can name |fg= or |bg=, which is nice, but... if you name either of them, you must also name |text=, which is a compromise. (See Help:Template#Parameters for why.)
Spacing is of no concern.
.{{font color|tan|green|text with four words}}.→.text with four words..{{font color|tan|green|text with four words}}.→.text with four words..{{ font color | tan | green | text with four words }}.→.text with four words.
Parameters
Script error: No such module "aligned table".
- Or
Script error: No such module "aligned table".
Examples
| Markup | Renders as |
|---|---|
{{ font color | green | green text }}
|
green text |
{{ font color | blue | do not style text as a link }}
|
do not style text as a link |
{{ font color | white | black | white with black background }}
|
white with black background |
{{font color || yellow | default text in yellow background }}
|
default text in yellow background |
{{font color | bg=yellow | text=default text in yellow background }}
|
default text in yellow background |
| Markup | Renders as |
|---|---|
{{ font color | white | blue | Wikipedia:Example | link = yes }}
|
Wikipedia:Example |
{{ font color | white | blue | Wikipedia:Example | link = Wikipedia:Sandbox }}
|
Wikipedia:Example |
{{ font color | text = Wikipedia:Example | link = Wikipedia:Sandbox | bg
= blue | fg = white }}
|
Wikipedia:Example |
The |link= parameter is a good way to colorize wikilinks,
and it is about as much typing as the pipe trick.
Although a wikilink's label will accept any template,
[[ Wikipedia:Example | {{font color | white | blue | Wikipedia:Example }} ]] →
Wikipedia:Example (a font-colored link),
this template does not accept a wiklink, it only provides |link=:
- Template:OK{{ font color | black | violet | Wikipedia:Example | link=yes }} → Wikipedia:Example (a linked {{ font color }})
- REDIRECT Template:Xmark
|
{{ font color | black | violet | [[Wikipedia:Example]] }} → Wikipedia:Example (The wikilink caused the color to fail.)
- REDIRECT Template:Xmark
|
{{ font color | black | violet | [[Wikipedia:Exammple]] }} → Wikipedia:Exammple (The wikilink caused the color to fail.)
For actual mainspace template usage, here are search links for
See also
- Important Manual of Style information
- Web colors
- HTML color names
- List of colors
- Help: Link color
- {{color}}
- {{background color}}
- {{color contrast ratio}}
- {{hilite}}
- {{font}}
- {{tq}}
- {{xt}}