Content Blocks

Block-level elements for equations, code, images, tables, callouts, definitions, examples, tasks, and charts

equation

equationalias: eq

A display-mode LaTeX mathematical expression. Use for important formulas, theorems, or any math that deserves its own line. For inline math within a paragraph, use $...$ instead.

colour (colour; default: neutral). Tint colour applied to the rendered equation

equation{
    \int_0^1 x^2 \, dx = \frac{1}{3}
}(colour: blue)

equation{
    \int_0^1 x^2 \, dx = \frac{1}{3}
}(colour: blue)

Chalk

Read-only

code

codealias: cde, codeblock

A code block with syntax highlighting for 50+ languages. Supports diff annotations, line highlighting, and an interactive editor mode where students can read and optionally edit or run code.

language (programming-language; default: auto). Language for syntax highlighting
title (string; default: —). Filename or title shown above the block
mode (inline / fullscreen; default: inline). inline displays in place; fullscreen expands the block
interactive (boolean; default: false). Enables a runnable editor environment
editable (boolean; default: true). When interactive, controls whether students can edit the code
highlight lines (index-list; default: —). Line numbers to highlight
added lines (index-list; default: —). Lines marked as added (diff view)
removed lines (index-list; default: —). Lines marked as removed (diff view)
fullscreen (boolean; default: false). Allow learner to expand to fullscreen

code{
    def factorial(n):
        if n == 0:
            return 1
        return n * factorial(n - 1)
}(
    language: python
    title: factorial.py
    highlight lines: 3, 4
)

code{
    def factorial(n):
        if n == 0:
            return 1
        return n * factorial(n - 1)
}(
    language: python
    title: factorial.py
    highlight lines: 3, 4
)

Chalk

Read-only

image

imagealias: img

Embeds an uploaded asset image. Reference assets by filename after uploading them in the Assets tab. Supports an optional caption.

source (required; string). Filename of the uploaded asset, or a URL
caption (string; default: —). Caption displayed below the image

image(source: supply-demand.png; caption: Supply and demand at equilibrium)

image(source: supply-demand.png; caption: Supply and demand at equilibrium)

Chalk

Read-only

table

tablealias: tbl

A structured grid with pipe-delimited rows. Use only when row and column relationships matter; for short reference material, prefer ordinary lists because they scan better on small screens.

header-row (boolean; default: true). Treat first row as a header
header-column (boolean; default: false). Treat first column as a header
footer-row (boolean; default: false). Treat last row as a footer
highlight-rows (index-list; default: —). Row indices to highlight (1-based)
highlight-columns (index-list; default: —). Column indices to highlight (1-based)
highlight-cells (cell-list; default: —). Cell references to highlight, e.g. A1, B2-C3
highlight-colour (colour; default: blue). Highlight colour
title (string; default: —). Table caption
delimiter (string; default: pipe). Column delimiter character

- **USA**: GDP 27.4 USD tn; growth 2.5%
- **China**: GDP 17.7 USD tn; growth 5.2%
- **Germany**: GDP 4.1 USD tn; growth -0.3%

- **USA**: GDP 27.4 USD tn; growth 2.5%
- **China**: GDP 17.7 USD tn; growth 5.2%
- **Germany**: GDP 4.1 USD tn; growth -0.3%

Chalk

Read-only

Prefer this list pattern for compact comparisons. Save the table element for larger datasets where learners need to compare values across rows and columns.

definition

definitionalias: def

A term-definition pair. Use to introduce key vocabulary. The optional term attribute names the term being defined; the body provides the explanation. Body can contain any primitive elements.

term (string; default: —). The term being defined

definition{
    The instantaneous rate of change of a function at a given point,
    equal to the slope of the tangent line at that point.
}(term: Derivative)

definition{
    The instantaneous rate of change of a function at a given point,
    equal to the slope of the tangent line at that point.
}(term: Derivative)

Chalk

Read-only

example

example

A worked example or illustration. Use to demonstrate how a concept applies in a concrete case. Body can contain any primitive elements plus equations, tables, and images.

title (string; default: —). Example title or label

example{
    Using the power rule: $\frac{d}{dx}(x^4) = 4x^3$.
}(title: Power Rule)

example{
    Using the power rule: $\frac{d}{dx}(x^4) = 4x^3$.
}(title: Power Rule)

Chalk

Read-only

note

note, warning, tip

A highlighted callout block for important information, tips, or warnings. Style variants are set by the element name: note (blue), warning (yellow), tip (green).

title (string; default: —). Bold label shown above the callout body

note{
    Remember to publish the map before sharing it with students.
}(title: Publishing)

warning{
    Deleting a partial cannot be undone.
}

tip{
    Use `shuffle: true` on wordbanks to prevent memorisation of position.
}

note{
    Remember to publish the map before sharing it with students.
}(title: Publishing)

warning{
    Deleting a partial cannot be undone.
}

tip{
    Use `shuffle: true` on wordbanks to prevent memorisation of position.
}

Chalk

Read-only

task

taskalias: exercise

An exercise or problem for students to complete. Use for problems, practice questions, or any directed activity. Body can contain any primitive elements plus equations, tables, and images.

title (string; default: —). Task label (e.g. Exercise 1, Practice)

task{
    Find the derivative of $f(x) = 3x^4 - 2x^2 + 7$.
}(title: Exercise 1)

task{
    Find the derivative of $f(x) = 3x^4 - 2x^2 + 7$.
}(title: Exercise 1)

Chalk

Read-only

piechart

piechartalias: pie

A pie or donut chart defined by parallel comma-separated lists of labels, values, and optional colours. Does not use a body block — all data is provided through attributes.

labels (required; string-list). Comma-separated slice labels
values (required; number-list). Comma-separated numeric values matching each label
colours (colour-list; default: —). Comma-separated colours matching each label
title (string; default: —). Chart title
show legend (boolean; default: true). Show the legend below the chart
style (default / donut; default: default). Use donut to render a donut chart

piechart(
    title: Budget Breakdown
    labels: Salaries, Infrastructure, Research, Other
    values: 55, 20, 18, 7
    colours: blue, teal, purple, grey
    style: donut
)

piechart(
    title: Budget Breakdown
    labels: Salaries, Infrastructure, Research, Other
    values: 55, 20, 18, 7
    colours: blue, teal, purple, grey
    style: donut
)

Chalk

Read-only

internote

internote

A reference to another internote document. Creates a link that connects related content, useful for cross-referencing topics within a map.

id (required; string). The target internote's ID
connect (boolean; default: true). Show a visual connection link

internote(ref: abc123def456)

internote(ref: abc123def456)

Chalk

Read-only

On this page

equation code image table definition example note task piechart internote

Content Blocks

Block-level elements for equations, code, images, tables, callouts, definitions, examples, tasks, and charts

equation

equationalias: eq

A display-mode LaTeX mathematical expression. Use for important formulas, theorems, or any math that deserves its own line. For inline math within a paragraph, use $...$ instead.

colour (colour; default: neutral). Tint colour applied to the rendered equation

equation{
    \int_0^1 x^2 \, dx = \frac{1}{3}
}(colour: blue)

equation{
    \int_0^1 x^2 \, dx = \frac{1}{3}
}(colour: blue)

Chalk

Read-only

code

codealias: cde, codeblock

A code block with syntax highlighting for 50+ languages. Supports diff annotations, line highlighting, and an interactive editor mode where students can read and optionally edit or run code.

language (programming-language; default: auto). Language for syntax highlighting
title (string; default: —). Filename or title shown above the block
mode (inline / fullscreen; default: inline). inline displays in place; fullscreen expands the block
interactive (boolean; default: false). Enables a runnable editor environment
editable (boolean; default: true). When interactive, controls whether students can edit the code
highlight lines (index-list; default: —). Line numbers to highlight
added lines (index-list; default: —). Lines marked as added (diff view)
removed lines (index-list; default: —). Lines marked as removed (diff view)
fullscreen (boolean; default: false). Allow learner to expand to fullscreen

code{
    def factorial(n):
        if n == 0:
            return 1
        return n * factorial(n - 1)
}(
    language: python
    title: factorial.py
    highlight lines: 3, 4
)

code{
    def factorial(n):
        if n == 0:
            return 1
        return n * factorial(n - 1)
}(
    language: python
    title: factorial.py
    highlight lines: 3, 4
)

Chalk

Read-only

image

imagealias: img

Embeds an uploaded asset image. Reference assets by filename after uploading them in the Assets tab. Supports an optional caption.

source (required; string). Filename of the uploaded asset, or a URL
caption (string; default: —). Caption displayed below the image

image(source: supply-demand.png; caption: Supply and demand at equilibrium)

image(source: supply-demand.png; caption: Supply and demand at equilibrium)

Chalk

Read-only

table

tablealias: tbl

A structured grid with pipe-delimited rows. Use only when row and column relationships matter; for short reference material, prefer ordinary lists because they scan better on small screens.

header-row (boolean; default: true). Treat first row as a header
header-column (boolean; default: false). Treat first column as a header
footer-row (boolean; default: false). Treat last row as a footer
highlight-rows (index-list; default: —). Row indices to highlight (1-based)
highlight-columns (index-list; default: —). Column indices to highlight (1-based)
highlight-cells (cell-list; default: —). Cell references to highlight, e.g. A1, B2-C3
highlight-colour (colour; default: blue). Highlight colour
title (string; default: —). Table caption
delimiter (string; default: pipe). Column delimiter character

- **USA**: GDP 27.4 USD tn; growth 2.5%
- **China**: GDP 17.7 USD tn; growth 5.2%
- **Germany**: GDP 4.1 USD tn; growth -0.3%

- **USA**: GDP 27.4 USD tn; growth 2.5%
- **China**: GDP 17.7 USD tn; growth 5.2%
- **Germany**: GDP 4.1 USD tn; growth -0.3%

Chalk

Read-only

Prefer this list pattern for compact comparisons. Save the table element for larger datasets where learners need to compare values across rows and columns.

definition

definitionalias: def

A term-definition pair. Use to introduce key vocabulary. The optional term attribute names the term being defined; the body provides the explanation. Body can contain any primitive elements.

term (string; default: —). The term being defined

definition{
    The instantaneous rate of change of a function at a given point,
    equal to the slope of the tangent line at that point.
}(term: Derivative)

definition{
    The instantaneous rate of change of a function at a given point,
    equal to the slope of the tangent line at that point.
}(term: Derivative)

Chalk

Read-only

example

example

A worked example or illustration. Use to demonstrate how a concept applies in a concrete case. Body can contain any primitive elements plus equations, tables, and images.

title (string; default: —). Example title or label

example{
    Using the power rule: $\frac{d}{dx}(x^4) = 4x^3$.
}(title: Power Rule)

example{
    Using the power rule: $\frac{d}{dx}(x^4) = 4x^3$.
}(title: Power Rule)

Chalk

Read-only

note

note, warning, tip

A highlighted callout block for important information, tips, or warnings. Style variants are set by the element name: note (blue), warning (yellow), tip (green).

title (string; default: —). Bold label shown above the callout body

note{
    Remember to publish the map before sharing it with students.
}(title: Publishing)

warning{
    Deleting a partial cannot be undone.
}

tip{
    Use `shuffle: true` on wordbanks to prevent memorisation of position.
}

note{
    Remember to publish the map before sharing it with students.
}(title: Publishing)

warning{
    Deleting a partial cannot be undone.
}

tip{
    Use `shuffle: true` on wordbanks to prevent memorisation of position.
}

Chalk

Read-only

task

taskalias: exercise

An exercise or problem for students to complete. Use for problems, practice questions, or any directed activity. Body can contain any primitive elements plus equations, tables, and images.

title (string; default: —). Task label (e.g. Exercise 1, Practice)

task{
    Find the derivative of $f(x) = 3x^4 - 2x^2 + 7$.
}(title: Exercise 1)

task{
    Find the derivative of $f(x) = 3x^4 - 2x^2 + 7$.
}(title: Exercise 1)

Chalk

Read-only

piechart

piechartalias: pie

A pie or donut chart defined by parallel comma-separated lists of labels, values, and optional colours. Does not use a body block — all data is provided through attributes.

labels (required; string-list). Comma-separated slice labels
values (required; number-list). Comma-separated numeric values matching each label
colours (colour-list; default: —). Comma-separated colours matching each label
title (string; default: —). Chart title
show legend (boolean; default: true). Show the legend below the chart
style (default / donut; default: default). Use donut to render a donut chart

piechart(
    title: Budget Breakdown
    labels: Salaries, Infrastructure, Research, Other
    values: 55, 20, 18, 7
    colours: blue, teal, purple, grey
    style: donut
)

piechart(
    title: Budget Breakdown
    labels: Salaries, Infrastructure, Research, Other
    values: 55, 20, 18, 7
    colours: blue, teal, purple, grey
    style: donut
)

Chalk

Read-only

internote

internote

A reference to another internote document. Creates a link that connects related content, useful for cross-referencing topics within a map.

id (required; string). The target internote's ID
connect (boolean; default: true). Show a visual connection link

internote(ref: abc123def456)

internote(ref: abc123def456)

Chalk

Read-only

On this page

equation code image table definition example note task piechart internote