You are viewing this question as it will appear in the manual grading interface. Return to the normal view when you are done.

Element pl-code: Display code with syntax highlighting

Questions below were designed to showcase the different features of pl-code. The goal of pl-code is to display different programming languages with appropriate syntax highlighting and code line emphasis.

The most common use of pl-code is to display pre-written code with appropriate syntax highlighting. The language must be specified with the language attribute. In this case, we are requesting python with language="python". We also enable the copy code button by setting copy-code-button="True". Additionally, we ensure the code is indented to the start of the line by setting normalize-whitespace="true". 

1
2
def square(x):
    return x * x

You can disable selection of the code region using the prevent-select="true" attribute.

1
2
def square(x):
    return x * x

Another useful feature of pl-code is the ability to highlight specific lines. This is done by using highlight-lines="..." attribute. 

1
2
3
4
5
6
7
8
def foo():
    return 'foo'

def square(x):
    return x * x

def bar(x):
    return 'bar'

The pl-code element also provides the ability to have code included from an external file. This can be achieved with source-file-name="myCode.py" attribute. 

1
2
3
4
A = 3
B = 9.34
C = B + A
D = C - 5

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
<CATALOG>
<CD>
<TITLE>The Dark Side of the Moon</TITLE>
<ARTIST>Pink Floyd</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>Abbey Road Studios</COMPANY>
<PRICE>7.50</PRICE>
<YEAR>1973</YEAR>
</CD>
</CATALOG>

To change the style in use for a particular code block, the attribute style-name can be used. Any of the built-in pygments styles may be used. The examples below use the sas, staroffice and github-dark styles, respectively. 

1
2
3
4
A = 3
B = 9.34
C = B + A
D = C - 5

1
2
3
4
A = 3
B = 9.34
C = B + A
D = C - 5

1
2
3
4
A = 3
B = 9.34
C = B + A
D = C - 5

The pl-code element can also be used to show output of a terminal command using ANSI colors, by setting the language attribute to ansi-color. 

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
Default terminal text without formatting.

 30;40  30;41  30;42  30;43  30;44  30;45  30;46  30;47 
 31;40  31;41  31;42  31;43  31;44  31;45  31;46  31;47 
 32;40  32;41  32;42  32;43  32;44  32;45  32;46  32;47 
 33;40  33;41  33;42  33;43  33;44  33;45  33;46  33;47 
 34;40  34;41  34;42  34;43  34;44  34;45  34;46  34;47 
 35;40  35;41  35;42  35;43  35;44  35;45  35;46  35;47 
 36;40  36;41  36;42  36;43  36;44  36;45  36;46  36;47 
 37;40  37;41  37;42  37;43  37;44  37;45  37;46  37;47 

 30;1;40  30;1;41  30;1;42  30;1;43  30;1;44  30;1;45  30;1;46  30;1;47 
 31;1;40  31;1;41  31;1;42  31;1;43  31;1;44  31;1;45  31;1;46  31;1;47 
 32;1;40  32;1;41  32;1;42  32;1;43  32;1;44  32;1;45  32;1;46  32;1;47 
 33;1;40  33;1;41  33;1;42  33;1;43  33;1;44  33;1;45  33;1;46  33;1;47 
 34;1;40  34;1;41  34;1;42  34;1;43  34;1;44  34;1;45  34;1;46  34;1;47 
 35;1;40  35;1;41  35;1;42  35;1;43  35;1;44  35;1;45  35;1;46  35;1;47 
 36;1;40  36;1;41  36;1;42  36;1;43  36;1;44  36;1;45  36;1;46  36;1;47 
 37;1;40  37;1;41  37;1;42  37;1;43  37;1;44  37;1;45  37;1;46  37;1;47 

 90;40  90;41  90;42  90;43  90;44  90;45  90;46  90;47 
 91;40  91;41  91;42  91;43  91;44  91;45  91;46  91;47 
 92;40  92;41  92;42  92;43  92;44  92;45  92;46  92;47 
 93;40  93;41  93;42  93;43  93;44  93;45  93;46  93;47 
 94;40  94;41  94;42  94;43  94;44  94;45  94;46  94;47 
 95;40  95;41  95;42  95;43  95;44  95;45  95;46  95;47 
 96;40  96;41  96;42  96;43  96;44  96;45  96;46  96;47 
 97;40  97;41  97;42  97;43  97;44  97;45  97;46  97;47 

 30;100  30;101  30;102  30;103  30;104  30;105  30;106  30;107 
 31;100  31;101  31;102  31;103  31;104  31;105  31;106  31;107 
 32;100  32;101  32;102  32;103  32;104  32;105  32;106  32;107 
 33;100  33;101  33;102  33;103  33;104  33;105  33;106  33;107 
 34;100  34;101  34;102  34;103  34;104  34;105  34;106  34;107 
 35;100  35;101  35;102  35;103  35;104  35;105  35;106  35;107 
 36;100  36;101  36;102  36;103  36;104  36;105  36;106  36;107 
 37;100  37;101  37;102  37;103  37;104  37;105  37;106  37;107 

 90;100  90;101  90;102  90;103  90;104  90;105  90;106  90;107 
 91;100  91;101  91;102  91;103  91;104  91;105  91;106  91;107 
 92;100  92;101  92;102  92;103  92;104  92;105  92;106  92;107 
 93;100  93;101  93;102  93;103  93;104  93;105  93;106  93;107 
 94;100  94;101  94;102  94;103  94;104  94;105  94;106  94;107 
 95;100  95;101  95;102  95;103  95;104  95;105  95;106  95;107 
 96;100  96;101  96;102  96;103  96;104  96;105  96;106  96;107 
 97;100  97;101  97;102  97;103  97;104  97;105  97;106  97;107

Combined with the Python pprint module, the pl-code element can be used to display complex Python objects that cannot be JSON serialized easily. In particular, we used the pprint.pformat() function to generate the string to display below. We also enabled line numbers by setting show-line-numbers="True". 

1
2
3
4
5
my_object = \
{(0, 0): 'origin',
 (1, 2): 'hi',
 (2, 2): 'another point',
 (3, 3): 'yet another point'}

Correct answer

Student view placeholder

In student views this area is used for assessment and score info.
Tools

Staff information

Question

QID:
Title:
Element pl-code: Display code with syntax highlighting

Variant

Started at:
2026-08-04 22:47:12 (CDT)
Duration:
0s
Show/Hide answer 
{}
This box is not visible to students.
History
dec frac
rad deg