Difference between revisions of "Template:Font color/doc"

From Summertime Saga Wiki
Jump to: navigation, search
m (→‎Usage)
m (→‎See also)
 
(38 intermediate revisions by the same user not shown)
Line 1: Line 1:
 +
The template {{tlg|font color}} is how you insert colorized text. You can specify its background color at the same time.
 +
 
== Purpose ==
 
== Purpose ==
  
−
{<nowiki/>{Font color}} is how you insert colorized text, such as {{font color|red|red}}, {{font color|orange|orange}}, {{font color|green|green}}, {{font color|blue|blue}} and {{font color|indigo|indigo}}, and many others.
+
{{tlg|code=yes|nolink=yes|font color}} is also how you can color wikilinks to something other than blue for when you need to work within background colors. Normally <nowiki>[[Pink Cyclone]]</nowiki> produces [[Pink Cyclone]], but here we use a font color with {{para|link}} to create a black wikilink → {{font color|black|violet|link=yes|Pink Cyclone}}. You can make any text link to any page using the {{para|link}} parameter.
−
You can specify its {{font color|bg=yellow|fg=indigo|text=background}} color at the same time.
 
  
−
{<nowiki/>{Font color}} is also how you can color wikilinks to something other than blue for when you need to work within background colors. Normally <nowiki>[[wikilink]]</nowiki> → [[wikilink]], but here we use a font color with {{para|link}} to create a black wikilink → {{font color|black|violet|link=yes|wikilink}}. You can make any text link to any page using the {{para|link}} parameter.
+
This template uses the latest HTML5 recommendations, inserting the span tags
−
 
+
{{tag|span|nowrap=yes|attribs=style="color:color;"}} and {{tag|span|nowrap=yes|attribs=style="background-color:color;"}}, so the page increases its readability and usability in both the wikitext and the rendered page.
−
This template uses the latest [[Wikipedia:HTML5]] recommendations, inserting the span tags <nowiki><span style=color:color>...</span></nowiki> and <nowiki><span style=background-color:color>...</span></nowiki> for you, so your page increases its readability and usability in both the wikitext and the rendered page.
 
  
 
== Usage ==
 
== Usage ==
  
−
{<nowiki/>{Font color}} has a one-color and a two-color form:
+
{{tlg|code=yes|nolink=yes|font color}} has a one‐color form:
−
: {<nowiki/>{ font color | ''color'' | ''text'' }}
+
: {{tlg|code=yes|nolink=yes|font color|fg{{=}}{{var|text color}}|text{{=}}{{var|text}}}}
−
: {<nowiki/>{ font color | ''text color'' | ''background color'' | ''text'' }}
+
: {{tlg|code=yes|nolink=yes|font color|{{var|text color}}|{{var|text}}}}
  
−
Either form has a <code>|link=</code> option, for colorizing (otherwise blue or red) wikilink text:
+
And a two‐color form:
−
: |link=yes → <code>[<nowiki/>[''text'']]</code>
+
: {{tlg|code=yes|nolink=yes|font color|fg{{=}}{{var|text color}}|bg{{=}}{{var|background color}}|text{{=}}{{var|text}}}}
−
: |link=''[[fullpagename]]'' → <code>[<nowiki/>[''fullpagename'']]</code>
+
: {{tlg|code=yes|nolink=yes|font color|{{var|text color}}|{{var|background color}}|{{var|text}}}}
  
−
You can also name the other fields:
+
Either form has a {{para|link}} option, for colorizing (otherwise blue or red) wikilink text:
−
: {<nowiki/>{font color | fg=''color'' | text=''text'' }}
+
: {{para|link|yes}} produces <code>[[{{var|text}}]]</code>
−
: {<nowiki/>{font color | fg=''text color'' | bg=''background color'' | text=''text'' }}
+
: {{para|link|Erik}} produces {{code|[[Erik]]}}
−
You can name <code>|fg=</code> or <code>|bg=</code>, which is nice, but if you name either of them, you must also name <code>|text=</code>, which is a compromise.
 
  
−
=== Parameters ===
+
== Parameters ==
  
−
{|class=wikitable
+
In a one‐color form:
−
|-
+
; {{para|fg}} or {{para|1}} : The color of the text.
−
!
+
; {{para|bg}} or {{para|2}} : The color of the background.
−
! Use / description
+
; {{para|link}} : =yes or =fullpagename. If there is a link.
−
! Default value
 
−
|-
 
−
| {{{1}}}
 
−
| ''text color''
 
−
| inherited
 
−
|-
 
−
| {{{2}}}
 
−
| ''text''
 
−
|
 
−
|-
 
−
| link
 
−
| =yes or =''fullpagename''
 
−
|
 
−
|}
 
  
−
Or
+
In a two‐color form:
−
 
+
; {{para|fg}} or {{para|1}} : The color of the text.
−
{|class=wikitable
+
; {{para|bg}} or {{para|2}} : The color of the background.
−
|-
+
; {{para|text}} or {{para|3}} : The text to display.
−
!
+
; {{para|link}} : =yes or =fullpagename. If there is a link, the page target of the link.
−
! Use / description
 
−
! Default value
 
−
|-
 
−
| {{{1}}}
 
−
| ''text color''
 
−
| inherited
 
−
|-
 
−
| {{{2}}}
 
−
| ''background color''
 
−
| inherited
 
−
|-
 
−
| {{{3}}}
 
−
| ''text''
 
−
|
 
−
|-
 
−
| link
 
−
| =yes or =''fullpagename''
 
−
|
 
−
|}
 
  
 
== Examples ==
 
== Examples ==
  
−
{|class=wikitable
+
{|class=wikitable style="width:100%;"
 
! Markup
 
! Markup
 
! Renders as
 
! Renders as
 
|-
 
|-
−
| <code><nowiki>{{ font color | green | green text }}</nowiki></code>
+
| {{tlg|code=yes|nolink=yes|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>
+
| {{tlg|code=yes|nolink=yes|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 | | yellow | default text in yellow background }}</code>
+
| {{tlg|code=yes|nolink=yes|font color||yellow|default text in yellow background}}
 
| {{font color||yellow|default text in yellow background}}
 
| {{font color||yellow|default text in yellow background}}
 
|-
 
|-
−
| | <code>{<nowiki/>{ font color | bg=yellow | text = default text in yellow background }}</code>
+
| {{tlg|code=yes|nolink=yes|font color|bg{{=}}yellow|text{{=}}default text in yellow background}}
 
| {{font color|bg=yellow|text=default text in yellow background}}
 
| {{font color|bg=yellow|text=default text in yellow background}}
 
|-
 
|-
−
| <code><nowiki>{{ font color | white | black | white with black background }}</nowiki></code>
+
| {{tlg|code=yes|nolink=yes|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 }}</nowiki></code>
+
| {{tlg|code=yes|nolink=yes|font color|#FFFFFF|#000000|white with black background}}
−
| {{font color|#ffffff|#000000|white with black background}}
+
| {{font color|#FFFFFF|#000000|white with black background}}
 
|}
 
|}
  
−
{|class=wikitable
+
{|class=wikitable style="width:100%;"
 
! Markup
 
! Markup
 
! Renders as
 
! Renders as
 
|-
 
|-
−
| <code><nowiki>{{ font color | white | blue | Wikipedia:Example | link = yes }}</nowiki></code>
+
| {{tlg|code=yes|nolink=yes|font color|white|#57A3E6|Eve|link{{=}}yes}}
−
| {{font color|white|blue|Wikipedia:Example|link=yes}}
+
| {{font color|white|#57A3E6|Eve|link=yes}}
 
|-
 
|-
−
| <code><nowiki>{{ font color | white | blue | Wikipedia:Example | link = Wikipedia:Sandbox }}</nowiki></code>
+
| {{tlg|code=yes|nolink=yes|font color|white|#57A3E6|Eve is a nice girl|link{{=}}Eve}}
−
| {{font color|white|blue|Wikipedia:Example|link=Wikipedia:Sandbox}}
+
| {{font color|white|#57A3E6|Eve is a nice girl|link=Eve}}
 
|-
 
|-
−
| <code><nowiki>{{ font color | text = Wikipedia:Example | link = Wikipedia:Sandbox | bg
+
| {{tlg|code=yes|nolink=yes|font color|fg{{=}}white|bg{{=}}#57A3E6|text{{=}}Eve is a nice girl|link{{=}}Eve}}
−
= blue | fg = white }}</nowiki></code>
+
| {{font color|fg=white|bg=#57A3E6|text=Eve is a nice girl|link=Eve}}
−
| {{font color|text = Wikipedia:Example|link=Wikipedia:Sandbox|bg=blue|fg=white}}
 
 
|}
 
|}
  
−
The {{para|link}} parameter is a good way to colorize wikilinks, and it is about as much typing as the [https://en.wikipedia.org/wiki/Help:Pipe_trick pipe trick].
+
The {{para|link}} parameter is a good way to colorize wikilinks:
 +
: {{font color|green|✓}} <code>[<nowiki/>[Becca|{<nowiki />{font color|black|#FFBCA8|The daughter of Tina}}]]</code> produces [[Becca|{{font color|black|#FFBCA8|The daughter of Tina}}]] (a font‐colored link).
 +
 
 +
However the template {{tlg|nolink=yes|font color}} does not accept a wikilink, it creates wikilinks itself with the {{para|link}} parameter:
 +
: {{font color|green|✓}} {{tlg|code=yes|nolink=yes|font color|white|#C990FF|Missy|link{{=}}yes}} produces {{font color|white|#C990FF|Missy|link=yes}}.
 +
: {{font color|red|✗}} {{tlg|code=yes|nolink=yes|font color|white|#C990FF|The page about &#91;&#91;Missy&#93;&#93;}} produces {{font color|white|#C990FF|The page about [[Missy]]}} because the text with wikilink brackets overrides the designated color.
 +
 
 +
== See also ==
 +
 
 +
{{tlg|lightlink}} - provides a white‐colored wikilink for infobox, navbox and tables.
  
−
Although a wikilink accepts a ''font color'' (or other template or markup):
+
[[Category:Templates]]
−
: <code>[<nowiki/>[Wikipedia:Example|{<nowiki />{font color|white|blue|the Wikipedia:Example page}}]]</code> → [[Wikipedia:Example|{{font color|white|blue|the Wikipedia:Example page}}]] (a font-colored link)
+
[[Category:Templates documentation]]
−
A ''font color'' does not accept a wikilink, it creates wikilinks itself with {{para|link}}.<br>
 
−
✓ {<nowiki/>{ font color | green | violet | Wikipedia:Example | link=yes }} → {{font color|green|violet|Wikipedia:Example|link=yes}} (a {{para|link}} {{tl|font color}})<br>
 
−
✗ {<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)
 

Latest revision as of 14:39, 25 July 2020

The template {{font color}} is how you insert colorized text. You can specify its background color at the same time.

Purpose

{{font color}} is also how you can color wikilinks to something other than blue for when you need to work within background colors. Normally [[Pink Cyclone]] produces Pink Cyclone, but here we use a font color with |link= to create a black wikilink → Pink Cyclone. You can make any text link to any page using the |link= parameter.

This template uses the latest 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 form:

{{font color|fg=text color|text=text}}
{{font color|text color|text}}

And a two‐color form:

{{font color|fg=text color|bg=background color|text=text}}
{{font color|text color|background color|text}}

Either form has a |link= option, for colorizing (otherwise blue or red) wikilink text:

|link=yes produces [[text]]
|link=Erik produces [[Erik]]

Parameters

In a one‐color form:

|fg= or |1= 
The color of the text.
|bg= or |2= 
The color of the background.
|link= 
=yes or =fullpagename. If there is a link.

In a two‐color form:

|fg= or |1= 
The color of the text.
|bg= or |2= 
The color of the background.
|text= or |3= 
The text to display.
|link= 
=yes or =fullpagename. If there is a link, the page target of the link.

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||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
{{font color|white|black|white with black background}} white with black background
{{font color|#FFFFFF|#000000|white with black background}} white with black background
Markup Renders as
{{font color|white|#57A3E6|Eve|link=yes}} Eve
{{font color|white|#57A3E6|Eve is a nice girl|link=Eve}} Eve is a nice girl
{{font color|fg=white|bg=#57A3E6|text=Eve is a nice girl|link=Eve}} Eve is a nice girl

The |link= parameter is a good way to colorize wikilinks:

✓ [[Becca|{{font color|black|#FFBCA8|The daughter of Tina}}]] produces The daughter of Tina (a font‐colored link).

However the template {{font color}} does not accept a wikilink, it creates wikilinks itself with the |link= parameter:

✓ {{font color|white|#C990FF|Missy|link=yes}} produces Missy.
✗ {{font color|white|#C990FF|The page about [[Missy]]}} produces The page about Missy because the text with wikilink brackets overrides the designated color.

See also

{{lightlink}} - provides a white‐colored wikilink for infobox, navbox and tables.

Retrieved from "https://wiki.summertimesaga.com/index.php?title=Template:Font_color/doc&oldid=24721"