Template:Font color/doc: Difference between revisions

From HIBIKIFORUM
Jump to navigation Jump to search
(Created page with "{{Documentation subpage}} <!-- PLEASE ADD CATEGORIES AND INTERWIKIS AT THE BOTTOM OF THIS PAGE --> == Purpose == {{tl | Font color }} is how you insert colorized text, such a...")
 
mNo edit summary
 
(14 intermediate revisions by the same user not shown)
Line 1: Line 1:
{{Documentation subpage}}
{{Documentation subpage}}
<!-- PLEASE ADD CATEGORIES AND INTERWIKIS AT THE BOTTOM OF THIS PAGE -->
{{tsh|fc}}
__NOTOC__


== Purpose ==
== Purpose ==
{{tl | Font color }} is how you insert colorized text, such as
{{tl|Font color}} or {{tl|Fc}} 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
{{fc|blue|blue|link = cat}} and
{{ font color | indigo | indigo }},
{{fc|indigo|indigo}},
and [[Wikipedia:Help:Color#Color generation guide|many others]].
and [[Wikipedia: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 {{fc|bg=yellow|fg=indigo|text=background}} color at the same time.


{{tl | Font color }} is also how you can color wikilinks  
{{tls|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> &rarr; [[wikilink]],  
Normally <code>[<nowiki/>[ wikilink ]]</code> [[wikilink]],  
but here we use a {{tl | font color }} with <code>| link</code> to create a black wikilink &rarr;  
but here we use a {{tls|font color}} with {{para|link}} to create a black wikilink &rarr;  
{{ font color | black | violet | link=yes | &nbsp;&nbsp;&nbsp;wikilink&nbsp;&nbsp;&nbsp; }}
{{Font color|black|violet|link=yes|&nbsp;&nbsp;&nbsp;wikilink&nbsp;&nbsp;&nbsp;}}
You can make any text link to any page using the <code>|link</code> parameter.
You can make any text link to any page using the {{para|link}} parameter.


This template will use [[Wikipedia:HTML5]] recommendations,  
This template will use [[Wikipedia:HTML5]] recommendations,  
Line 25: Line 26:


== Usage ==
== Usage ==
{{tji|Font color}} has a one-color and a two-color form:
: {{Pre|{{((}}font color | ''color'' | ''text'' {{))}}}}
: {{Pre|{{((}}font color | ''text color'' | ''background color'' | ''text'' {{))}}}}


{{tl | Font color }} has a one-color and a two-color form:
Either form has a {{para|link}} option, for colorizing (otherwise blue or red) wikilink text.
: <kbd>{<nowiki/>{font color | ''color'' | ''text'' }}</kbd>
: {{para|link|yes}} {{Rarr}} <code>{{!(n(}}''text'']]</code>
: <kbd>{<nowiki/>{font color | ''text color'' | ''background color'' | ''text'' }}</kbd>.
: {{para|link|''[[wikipedia:pgn|fullpagename]]''}} {{Rarr}} <code>{{!(n(}}''fullpagename'']]</code>
 
Either form has a <kbd>|link=</kbd> option, for colorizing (otherwise blue or red) wikilink text.
: <kbd>|link{{=}}yes</kbd> &rarr; <code>[<nowiki/>[''text'']]</code>
: <kbd>|link=''[[wp:pgn|fullpagename]]''</kbd> &rarr; <code>[<nowiki/>[''fullpagename'']]</code>


You can also name the other fields.
You can also name the other fields.
: <kbd>{<nowiki/>{font color | fg=''color'' | text=''text'' }}</kbd>
: <code>{{((}}font color | fg=''color'' | text=''text'' {{))}}</code>
: <kbd>{<nowiki/>{font color | fg=''text color'' | bg=''background color'' | text=''text'' }}</kbd>
: <code>{{((}}font color | fg=''text color'' | bg=''background color'' | text=''text'' {{))}}</code>
You can name <kbd>|fg=</kbd> or <kbd>|bg=</kbd>, which is nice, but...
You can name {{para|fg}} or {{para|bg}}, 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 {{para|text}}, which is a compromise.
(See [[Help:Template#Parameters]] for why.)


Spacing is of no concern.
Spacing is of no concern.
:<code>.</code><kbd>{<nowiki/>{font color|tan|green|text with four words}}</kbd><code>.</code> &rarr; <code>.</code>{{font color|tan|green|text with four words }}<code>.</code>
: {{code|.}}{{tlc|font color|tan|green|text with four words}}{{code|.}} → {{code|.}}{{font color|tan|green|text with four words }}{{code|.}}
:<code>.</code><kbd> {<nowiki/>{font color|tan|green|text with four words}} </kbd><code>.</code> &rarr; <code>.</code> {{font color|tan|green|text with four words }} <code>.</code>
: {{code|.}} {{tlc|font color|tan|green|text with four words}} {{code|.}} → {{code|.}} {{font color|tan|green|text with four words }} {{code|.}}
:<code>.</code><kbd> {<nowiki/>{ font color  |  tan  |  green  | text with four words  }} </kbd><code>.</code> &rarr;  <code>.</code> {{ font color  |  tan  |  green  |  text    with    four    words }} <code>.</code>
: {{code|.}} <code><nowiki>{{font color  |  tan  |  green  | text with four words  }}</nowiki></code> {{code|.}} → {{code|.}} {{ font color  |  tan  |  green  |  text    with    four    words }} {{code|.}}


=== Parameters ===
=== Parameters ===
{|class=wikitable
{|class=wikitable
!Use / description
!Default value
|-
|-
| <code><nowiki>{{{1}}}</nowiki></code>  - ''text color''
!Parameter !! Use / description !! Default value
| inherited
|-
|-
| <code><nowiki>{{{2}}}</nowiki></code> - ''text''
| {{para|1}} || ''text color'' || inherited
|  
|-
|-
| link - {{=}}yes or {{=}}''fullpagename''
| {{para|2}} || ''text'' ||
|  
|-
| {{para|link}} || {{=}}yes or {{=}}''fullpagename'' ||
|}
|}


:Or
:Or
{|class=wikitable
{|class=wikitable
!Use / description
!Default value
|-
|-
| <code><nowiki>{{{1}}}</nowiki></code>  - ''text color''
!Parameter !! Use / description !! Default value
| inherited
|-
| {{para|1}} || ''text color'' || inherited
|-
|-
| <code><nowiki>{{{2}}}</nowiki></code> - ''background color''
| {{para|2}} || ''background color'' || inherited
| inherited
|-
|-
| <code><nowiki>{{{3}}}</nowiki></code>  - ''text''
| {{para|3}} || ''text'' ||
|  
|-
|-
| link - {{=}}yes or {{=}}''fullpagename''
| {{para|link}} || {{=}}yes or {{=}}''fullpagename'' ||  
|  
|}
|}


Line 85: Line 77:
!Renders as
!Renders as
|-
|-
| <code><nowiki>{{ font color | green | green text }}</nowiki></code>
| {{tlc|Font color|green|green text}} || {{Font color|green|green text }}
| {{ font color | green | green text }}
|-
|-
| <code><nowiki>{{ font color | blue | do not style text as a link }}</nowiki></code>
| {{tlc|Font color|blue|do not style text as a link}} || {{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>
| {{tlc|Font color|white|black|white with black background}} || {{Font color|white|black|white with black background }}
| {{ font color | white | black | white with black background }}
|-
|-
| <code><nowiki>{{ font color | #ffffff | #000000 | white with black background }} ([[hexadecimal colors]]) </nowiki></code>
| {{tlc|Font color|#ffffff|#000000|white with black background}} ([[Wikipedia:hexadecimal colors]]) || {{Font color|#ffffff|#000000|white with black background}} ([[Wikipedia:hexadecimal colors]])
| {{ font color | #ffffff | #000000 | white with black background}} ([[hexadecimal colors]])
|}
|}


Line 102: Line 90:
!Renders as
!Renders as
|-
|-
| <code><nowiki>{{ font color | white | blue | Wikipedia:Example | link = yes }}</nowiki></code>
| {{tlc|Font color|white|blue| Wikipedia:Example|link=yes}} || {{Font color|white|blue|Wikipedia:Example|link = yes}}
| {{ font color | white | blue | Wikipedia:Example | link = yes }}
|-
|-
| <code><nowiki>{{ font color | white | blue | Wikipedia:Example | link = Wikipedia:Sandbox }}</nowiki></code>
| {{tlc|Font color|white|blue|Wikipedia:Example|link=Wikipedia:Sandbox}} || {{Font color|white|blue|Wikipedia:Example|link = Wikipedia:Sandbox}}
| {{ font color | white | blue | Wikipedia:Example | link = Wikipedia:Sandbox }}
|-
|-
| <code><nowiki>{{ font color | text = Wikipedia:Example | link = Wikipedia:Sandbox | bg
| {{tlc|Font color|text = Wikipedia:Example|link = Wikipedia:Sandbox|bg = blue|fg = white}} || {{Font color|text = Wikipedia: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 <code>|link</code> 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 [[Wikipedia:pipe trick|pipe trick]].
and it is about as much typing as the [[Wikipedia:pipe trick|pipe trick]].


Although a wikilink accepts a ''font color'' (or other template or markup):
Although a wikilink accepts a ''font color'' (or other template or markup):
:<code><nowiki>[[Wikipedia:Example|{{font color|white|blue|the Wikipedia:Example page}}]]</nowiki></code>
:<code><nowiki>[[Wikipedia:Example|{{font color|white|blue|the Wikipedia:Example page}}]]</nowiki></code>
:→ [[Wikipedia:Example | {{ font color | white | blue | the Wikipedia:Example page}}]] (a font-colored link),
:→ [[Wikipedia:Example|{{font color|white|blue|the Wikipedia:Example page}}]] (a font-colored link),
a ''font color'' does not accept a wikilink, it creates wikilinks itself with <code>|link</code>.
a ''font color'' does not accept a wikilink, it creates wikilinks itself with {{para|link}}.
* Ok - {<nowiki/>{ font color | green | violet | Wikipedia:Example | link=yes }} → {{ font color | green | violet | Wikipedia:Example | link=yes }} (a <code>|link</code> {{tl | font color }})
* {{Y}} - {{tlc|Font color|green|violet|Wikipedia:Example|link {{=}} yes}} → {{Font color|green|violet|Wikipedia:Example|link = yes}} (a {{para|link}} {{tlb|font color}})
* Wrong - {<nowiki/>{ font color | green | violet | the [<nowiki/>[Wikipedia:Example]] page}} {{ font color | green | violet | the [[Wikipedia:Example]] page }} (Text with [<nowiki/>[wikilink brackets]] overrides the designated color)
* {{N}} - {{tlc|Font color|green|violet|the {{!(n(}}Wikipedia:Example]] page}} {{Rarr}} {{Font color|green|violet|the [[Wikipedia:Example]] page}} (Text with [<nowiki/>[wikilink brackets]] overrides the designated color)
* Wrong - {<nowiki/>{ font color | green | violet | [<nowiki/>[Wikipedia:Exammple]] }} {{ font color | green | violet | the [[Wikipedia:Exammple]] page }} (Text with [<nowiki/>[wikilink brackets]] overrides the designated color)
* {{N}} - {{tlc|Font color|green|violet|an {{!(n(}}Example]]}} {{Rarr}} {{Font color|green| violet|an [[Example]]}} (Text with [<nowiki/>[wikilink brackets]] overrides the designated color)
<!--
 
== See Also ==
* {{tl|Font color bold}}
 
== TemplateData ==
<templatedata>
{
"description": "Displays text with different font and background colors.",
"params": {
"1": {
"label": "Text Color",
"description": "The color of the text.",
"type": "string",
"aliases": [ "fg" ],
"default": "inherited",
"required": true
},
"2": {
"label": "Background Color",
"description": "The background behind the text color.",
"type": "string",
"aliases": [ "bg" ],
"default": "inherited",
"required": false
},
"3": {
"label": "Text",
"description": "The text to be colored.",
"type": "string",
"aliases": [ "text" ],
"required": true
},
"link": {
"label": "Link",
"description": "If the text is a link.",
"type": "string",
"suggestedvalues": [ "yes", "fullpagename" ],
"required": false
}
}
}
</templatedata>
 


--><includeonly>For more examples see [[/testcases]].</includeonly>
<includeonly>{{sandbox other||{{testcases other||


<includeonly>
<!-- Categories below this line, please -->
<!-- categories -->
[[Category:Formatting templates]]
[[Category:Text color templates]]
[[Category:General use templates]]
}}
}}}}</includeonly>
</includeonly>

Latest revision as of 01:56, 20 August 2023

Light bulb.png }}
It contains usage information, categories and other content that is not part of the original template page.


Purpose

{{Font color}} or {{Fc}} 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 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 Wikipedia:HTML5 recommendations, inserting the span tags <span style="color:color">...</span> and <span style="background-color:color">...</span>, so the 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.

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

Parameter Use / description Default value
|1= text color inherited
|2= text
|link= =yes or =fullpagename
Or
Parameter Use / description Default value
|1= text color inherited
|2= background color inherited
|3= text
|link= =yes or =fullpagename

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|#ffffff|#000000|white with black background}} (Wikipedia:hexadecimal colors) white with black background (Wikipedia:hexadecimal colors)
Markup Renders as
{{Font color|white|blue|Wikipedia:Example}} Wikipedia:Example
{{Font color|white|blue|Wikipedia:Example}} Wikipedia:Example
{{Font color}} 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 accepts a font color (or other template or markup):

[[Wikipedia:Example|{{font color|white|blue|the Wikipedia:Example page}}]]
the Wikipedia:Example page (a font-colored link),

a font color does not accept a wikilink, it creates wikilinks itself with |link=.

  • Green tickY - {{Font color|green|violet|Wikipedia:Example|link = yes}}Wikipedia:Example (a |link= {{font color}})
  • Red XN - {{Font color|green|violet|the [[Wikipedia:Example]] page}}the Wikipedia:Example page (Text with [[wikilink brackets]] overrides the designated color)
  • Red XN - {{Font color|green|violet|an [[Example]]}}an Example (Text with [[wikilink brackets]] overrides the designated color)

See Also

TemplateData

Displays text with different font and background colors.

Template parameters

ParameterDescriptionTypeStatus
Text Color1 fg

The color of the text.

Default
inherited
Stringrequired
Background Color2 bg

The background behind the text color.

Default
inherited
Stringoptional
Text3 text

The text to be colored.

Stringrequired
Linklink

If the text is a link.

Suggested values
yes fullpagename
Stringoptional