Template:CodeBlock: Difference between revisions

From Valve Developer Community
Jump to navigation Jump to search
(increased contrast to contrast against syntax highlighting)
m (fixed width with src/lang)
 
(24 intermediate revisions by 6 users not shown)
Line 1: Line 1:
<noinclude><!--
See Also: [[Template:Code]]
    -->{{modernTodo|Add syntax highlighting for relevant languages such as C, C++, Squirrel, Lua, AngelScript, Python, and<!--
{{Doc}}
    -->QuakeC, as well as common non-code syntax, such as VMT, VMF, Soundscapes/scripts, RAD files, Studiomdl QC/QCI,<!--
<includeonly>
    -->etc.}}<!--
 
--></noinclude><!--
<onlyinclude><!--
-->{{Doc}}__NOEDITSECTION__<!--
         --><div style="max-width:{{{width|unset}}}; overflow:hidden;background-color:{{#switch:{{{style|}}}|1=rgba(0,0,0,.1)|rgba(0,0,0,.4)}};{{#switch:{{{style|}}}|1=border:1px solid rgba(48,48,48,1);|}}border-radius:4px; font-family:monospace,monospace; line-height:1.125rem; text-indent:0; white-space:pre-wrap; margin: {{{margin|.3em 0 .3em 0}}}"><!--
--><includeonly><!--
             -->{{#if:{{{src|{{{lang|}}}}}}|<div style="width=100%; display:flex;justify-content:space-between;background-color:rgba(0,0,0,.1); border-bottom:1px solid rgba(255,255,255,.1); font-family:monospace,monospace;line-height:1.125rem; text-indent:0; white-space:pre-wrap; padding:.5em"><!--
    --><onlyinclude><!--
         --><div style="overflow:hidden;background-color:{{#switch:{{{style|}}}|1=rgba(0,0,0,.1)|rgba(0,0,0,.4)}};{{#switch:{{{style|}}}|1=border:1px solid rgba(48,48,48,1);|}}border-radius:4px; font-family:monospace,monospace; line-height:1.125rem; text-indent:0; white-space:pre-wrap; margin: {{{margin|.3em 0 .3em 0}}}"><!--
             -->{{#if:{{{src|{{{lang|}}}}}}|<div style="display:flex;justify-content:space-between;background-color:rgba(0,0,0,.1); border-bottom:1px solid rgba(255,255,255,.1); font-family:monospace,monospace;line-height:1.125rem; text-indent:0; white-space:pre-wrap; padding:.5em"><!--
--><!--
--><!--
                 --><div>{{{src|The source was not specified}}}</div><!--
                 --><div>{{{src|The source was not specified}}}</div><!--
                 -->{{#if:{{{lang|}}}|<div>{{#switch:{{{lang}}}|plain=Plain text|html=HTML|css=CSS|scss=SCSS|less=LESS|js=JavaScript|json=JSON|php=PHP|c=C|cs=C#|cpp=C++|pascal=Pascal|python=Python|java=Java|squirrel=Squirrel|lua=Lua|glua=gLua|{{{lang}}}}}</div>}}<!--
                 -->{{#if:{{{lang|}}}|<div>{{#switch:{{{lang}}}|plain=Plain text|html=HTML|css=CSS|scss=SCSS|less=LESS|js=JavaScript|json=JSON|php=PHP|c=C|csharp=C#|cpp=C++|pascal=Pascal|python=Python|java=Java|squirrel=Squirrel|lua=Lua|glua=gLua|fgd=Forge Game Data|{{{lang}}}}}</div>}}<!--
--><!--
--><!--
             --></div>}}<!--
             --></div>}}<!--
--><!--
--><!--
             --><div style="width:100%"><!--
             --><div style="width:100%"><!--
                 --><div style="position:relative;width:100%;display:flex;max-height:{{{height|unset}}};overflow:auto"><!--
                 --><div style="scrollbar-color:#373737 #101010; position:relative;width:100%;display:flex;max-height:{{{height|unset}}};overflow:auto"><!--
                     -->{{#if:{{{lines|}}}|<div style="z-index:1;display:flex;position:sticky;left:0;height:100%;padding:.5em 0 .4em 0;background-color:{{#switch:{{{style|}}}|1=rgb(31,31,31)|rgb(24,24,24)}};border-right:1px solid rgb(48,48,48)"><!--
                     -->{{#if:{{{lines|}}}|<div style="z-index:1;display:flex;position:sticky;left:0;height:100%;padding:.5em 0 .4em 0;background-color:{{#switch:{{{style|}}}|1=rgb(31,31,31)|rgb(24,24,24)}};border-right:1px solid rgb(48,48,48)"><!--
                         --><ol start="{{{start|1}}}" style="text-align:right;pointer-events:none;white-space:nowrap;list-style-position:inside;margin-left:8px;margin-top:0;user-select:none;margin-right:-10px;text-indent:0"><!--
                         --><ol start="{{{start|1}}}" style="text-align:right;pointer-events:none;white-space:nowrap;list-style-position:inside;margin-left:8px;margin-top:0;user-select:none;margin-right:-10px;text-indent:0"><!--
Line 41: Line 38:
                             --><div style="width:100%;background:rgba(255,128,0,0.1);margin-top:calc((1.6em * ({{{lightstart4|4}}} - 1)) + .45em);margin-bottom:.45em;height:calc(1.6em * {{{lightamount4|1}}});position:absolute;left:0;user-select:none;pointer-events:none"><!--
                             --><div style="width:100%;background:rgba(255,128,0,0.1);margin-top:calc((1.6em * ({{{lightstart4|4}}} - 1)) + .45em);margin-bottom:.45em;height:calc(1.6em * {{{lightamount4|1}}});position:absolute;left:0;user-select:none;pointer-events:none"><!--
                             --></div><!--
                             --></div><!--
                         --></div>}}<div style="padding:.45em .5em;position:relative">{{{1|}}}</div><!--
                         --></div>}}<div style="padding:.45em .5em;position:relative">{{#if:{{{highlight|}}}|{{#tag:syntaxhighlight|{{{1|}}}|lang={{{highlight}}}|inline=1|style="background-color:transparent;"}}|{{{1|}}}}}</div><!--
                     --></div><!--
                     --></div><!--
--><!--
--><!--
Line 47: Line 44:
             --></div><!--
             --></div><!--
--><!--
--><!--
         --></div><!--
         --></div></onlyinclude>
    --></onlyinclude><!--
 
--></includeonly>
</includeonly>
 
[[Category:Formatting templates]]

Latest revision as of 16:21, 17 August 2025

See Also: Template:Code

English (en)Deutsch (de)Esperanto (eo)Español (es)Français (fr)Suomi (fi)Hrvatski (hr)Magyar (hu)Italiano (it)日本語 (ja)한국어 (ko)Nederlands (nl)Polski (pl)Português (pt)Português do Brasil (pt-br)Русский (ru)Slovenčina (sk)Svenska (sv)Türkçe (tr)Українська (uk)Tiếng Việt (vi)中文 (zh)中文(臺灣) (zh-tw)
Curly brackets white.pngTemplate Documentation [view] [edit]
Icon-translate.png Available doc translations
View
Page history

This template formats the text as a block of code.

Parameters and Examples

Main

The main parameters are described below.

Name Description Example Preview
{{{1}}} Your code.
It is recommended to wrap the template content with the <nowiki> tag.
{{CodeBlock|Hello, World!}}
Hello, World!
{{{margin}}} Controls margins. Goes clockwise.
{{CodeBlock|margin=5px 30px 0 10px|Hello, World!}}
Hello, World!
{{{style}}} The style of the template. The following styles are available:
  • 1 - Outlined version;
  • Default - Default style that is based on Markdown.
{{CodeBlock|style=1|Hello, World!}}
Hello, World!
{{{height}}} Controls the height of the block.
{{CodeBlock|height=52px|<nowiki>1. Hello World 2. Hello World 3. Hello World 4. Hello World</nowiki>}}
1. Hello World 2. Hello World 3. Hello World 4. Hello World
{{{width}}} Controls the width of the block.
{{CodeBlock|width=50%|<nowiki>1. Hello World 2. Hello World 3. Hello World 4. Hello World 5. Hello World </nowiki>}}
1. Hello World 2. Hello World 3. Hello World 4. Hello World 5. Hello World
{{{lines}}} Manual: Numbered lines.
{{CodeBlock|lines=4|<nowiki>Hello World Hello World Hello World Hello World</nowiki>}}
  1.  
  2.  
  3.  
  4.  
Hello World Hello World Hello World Hello World
{{{start}}} What number to start numbering from (default value is 1). The value can be negative.
{{CodeBlock|start=12|lines=5|<nowiki>Hello World Hello World Hello World Hello World Hello World</nowiki>}}
  1.  
  2.  
  3.  
  4.  
  5.  
Hello World Hello World Hello World Hello World Hello World
{{{highlight}}} Adds syntax highlighting for the language specified.
Icon-Bug.pngBug:Condenses code into one line.  [todo tested in ?]
{{CodeBlock|highlight=c|int main() {return 0;} }}
int main() { return 0; }

Header

The parameters for adding a header with the code source and the name of the programming language are described below.

Note.pngNote:The header is enabled automatically when you enter one of the following parameters.
Name Description Example Preview
{{{src}}} The source of your code.
{{CodeBlock|src=light.rad|forcetextureshadow props_foliage/urban_tree01.mdl}}
light.rad
forcetextureshadow props_foliage/urban_tree01.mdl
{{{lang}}} The name of the language displayed on the right side of the header.
{{CodeBlock|lang=csharp |<nowiki>using System; namespace HelloWorld { internal class Program { static void Main(string[] args) { Console.WriteLine("Hello World"); } } }</nowiki>}}
The source was not specified
C#
using System; namespace HelloWorld { internal class Program { static void Main(string[] args) { Console.WriteLine("Hello World"); } } }