Template talk:Code

Improve Template:Code with revision 301901 (and also decide what it wants to be)

This concerns revision 301901 for Template:Code and also the template in general.

As of revision 302080, Template:Code has regressed from its Wikipedia counterpart significantly:

• Text is wrapped in <kbd> instead of <syntaxhighlight>

• using <kbd> to denote computer code is semantically incorrect and will throw surprises at user-agents that expect otherwise;

• {{{style}}} has been co-opted for pre-determined CSS styles instead of allowing editors to specify arbitrary CSS styles

• this is inconsistent with Template:Pre by the same maintainer and with the other in-house Wikipedia imports
• this is another surprise to editors
• editors can no longer specify arbitrary CSS styles without either a) using #tag:, b) using <code>, or c) using some nasty syntax hacks

• spurious parameters attempt to solve the inability to provide arbitrary CSS styles with another layer of unnecessary and obscure abstraction

• e.g., {{{select=1}}} results in identical behaviour to {{{style="user-select: all"}}}

• this appears to be a recurring element in other templates by the same maintainer
• editors must now remember a new set of arbitrary integer-key mappings
• existing values are fragile; changes to valid values will propagate across all invocations until someone fixes them

• e.g., {{{color}}} and {{{bg}}} abstract away CSS color and background-color

• preset CSS styles have inconsistent styling and can reflow the page if changed

• see: padding, border

Given that this Wiki has pitiful tooling for mass-updates, a template rewrite must:

• maintain backwards-compatibility with previous invocations; and
• produce correct backwards-compatible output

while providing new functionality. The code paths for this backwards-compatibility will probably persist until all old invocations are sanitized.

I already have a rewrite (revision 301901) that satisfied these complaints but was reverted almost immediately; changing the internal tag from <syntaxhighlight> to <code> will allow the template from this revision to produce correct output.

I would recommend replacing the current incarnation of Template:Code with a patched revision 301901, pending review.

On the other hand, the site administrators have made dubious changes to the site-wide CSS that revert the Vector skin styles. <code> is effectively indistinguishable from <kbd>; the number of template changes with <kbd> committed where <code> should be is non-zero. Perhaps Template:Code would better serve as a wrapper for <code> with sane CSS defaults (I suppose, as it is now), but maintain compatibility with syntax given by other Wikipedia ports.

idk :3 — 結衣 (talk) 22:32, 29 Apr 2023 (UTC)

Recent edits make text with unspecified language harder to read

The older method, which was basically {{mono}} with a background, was easier to read. It's nice having the new syntaxhighlight alias, but it's come at the cost of the legibility of the regular languageless text.
— SirYodaJedi (talk) 11:45, 20 October 2025 (PDT)

I don't understand what you're talking about. The background in the new version remains the same (it uses a slightly darker version of the background applied to the <code> tag by the site's styles). The main change is the removal of presets: unnecessary functionality is not required here. Regarding syntaxhighlight… it was already used in the template before my changes, I just replaced the {{{highlight}}} parameter with a more logical {{{lang}}}, because this value is substituted into the syntaxhighlight attribute, which is called lang.

PS: Don't get me wrong, I just genuinely don't understand the problem. If the new version causes any issues that break the template/page/other templates, please describe them and provide examples. I'll try to fix it as soon as possible. — Max34 (talk) 13:01, 20 October 2025 (PDT)

It looks different. The font is different.

int main() { return 0; }

int main() { return 0; }

int main() { return 0; }

int main() { return 0; }

int main() { return 0; }

Image for comparison, since it may differ between devices:

— SirYodaJedi (talk) 21:39, 20 October 2025 (PDT)

I checked these examples from different places and devices and didn't notice this problem. Perhaps it has something to do with font-family:monospace, monospace;. I tried the font-family:monospace;, see if that helps. — Max34 (talk) 00:24, 21 October 2025 (PDT)

I tried to dig deeper and figured out the problem. It turns out that if the code tag has an empty lang attribute, the font will be replaced with the one specified in the browser settings. This problem only occurs in Firefox; in Chrome, for example, all monospaced fonts are correctly replaced with the one specified in the browser settings. I just added 0 so that the lang attribute was not empty and this problem disappeared for me. — Max34 (talk) 03:45, 22 October 2025 (PDT)