Template:Unicon/Doc: Difference between revisions
Created page with "This template is used to display Wikipedia:Unicode icons through text, and bypass the usual render-as-emoji processing that most browsers and devices do. It is not guaranteed to work everywhere, but it does include some neat functionality to ''try'' to force the render-as-symbol behaviour. {{unicode|🕐}} == Usage == Simply pass the character you want to display as the first argument. Note that only single characters work: {{code|line=no|lang=mediawiki|<nowiki..." |
No edit summary |
||
| Line 1: | Line 1: | ||
This template is used to display [[:Wikipedia:Unicode]] icons through text, and bypass the usual render-as-emoji processing that most browsers and devices do. It is not guaranteed to work everywhere, but it does include some neat functionality to ''try'' to force the render-as-symbol behaviour. | This template is used to display [[:Wikipedia:Unicode]] icons through text, and bypass the usual render-as-emoji processing that most browsers and devices do. It is not guaranteed to work everywhere, but it does include some neat functionality to ''try'' to force the render-as-symbol behaviour. | ||
{{ | {{unicon|🕐}} | ||
== Usage == | == Usage == | ||
| Line 7: | Line 7: | ||
Simply pass the character you want to display as the first argument. Note that only single characters work: | Simply pass the character you want to display as the first argument. Note that only single characters work: | ||
{{code|line=no|lang=mediawiki|<nowiki>{{ | {{code|line=no|lang=mediawiki|<nowiki>{{unicon|🕐}}</nowiki>}} | ||
== Technical details == | == Technical details == | ||
There are four different techniques at play here. One of them is forcing the use of [https://fonts.google.com/noto/specimen/Noto+Emoji Noto Emoji font], if the user has it installed. The fallback font is a monospace font, which on most implementations will avoid using emojis. Furthermore, the [https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-emoji <code>font-variant-emoji</code>] CSS property is set, although the browser support is limited. Finally, a [https://www.unicode.org/reports/tr51/#def_text_presentation_selector text presentation selector] character is included after the input, ''telling'' the rendering engine to display the character as text. | There are four different techniques at play here. One of them is forcing the use of [https://fonts.google.com/noto/specimen/Noto+Emoji Noto Emoji font], if the user has it installed. The fallback font is a monospace font, which on most implementations will avoid using emojis. Furthermore, the [https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-emoji <code>font-variant-emoji</code>] CSS property is set, although the browser support is limited. Finally, a [https://www.unicode.org/reports/tr51/#def_text_presentation_selector text presentation selector] character is included after the input, ''telling'' the rendering engine to display the character as text. | ||