Callouts

Callouts are colored framed boxes that draw the eye to specific content — warnings, tips, learning goals, examples, hidden hints. They're built from regular markdown blockquotes with a type marker.

Basic syntax

> [!note] Heads up
> This is a note callout.

Heads up

This is a note callout.

The first line after [!type] is the title. Omit it and the callout falls back to the type name as a default heading.

With a custom title

> [!warning] Be careful
> This action cannot be undone.

Be careful

This action cannot be undone.

The title goes on the same line as the type marker. Without a title, the callout uses a default heading based on the type.

Collapsible callouts

Add - for collapsed by default, + for expanded:

> [!tip]- Click to expand
> Hidden content here. Useful for hints, solutions, optional deep-dives.

> [!tip]+ Expanded by default
> Visible content but with a collapse button so students can hide it.

Click to expand

Hidden content. Click the title above to expand.

Click the title to toggle. Great for:

• Hints and solutions ("Click for the answer")
• Optional deep-dives that not every student needs
• Long examples that clutter the page when always expanded

All callout types

Eduskript ships with 41 callout types — 15 base types plus aliases for common alternative names:

Base types

Aliases

Use whatever feels natural — lernziele is the same as success is the same as done. They all render the same callout.

Multi-paragraph content

Everything after the first line is callout content. Continue with > on each line:

> [!note] Title here
> First paragraph.
>
> Second paragraph.
>
> - List item
> - Another item
>
> Third paragraph with `inline code` and a [link](https://example.com).

Title here

First paragraph.

Second paragraph.

• List item
• Another item

Math, code blocks, lists, and even nested callouts all work inside.

Callouts inside callouts

> [!example] Outer callout
> Some explanation.
>
> > [!warning] Nested
> > A warning inside the example.

Useful for examples that include caveats — but use sparingly; deeply nested callouts get hard to read.

Practical patterns

Hidden hints

> [!tip]- Stuck?
> Try thinking about base cases first.

> [!solution]- Solution
> ```python
> def factorial(n):
>     return 1 if n <= 1 else n * factorial(n - 1)
> ```

The - keeps it collapsed; students click to reveal.

Lesson goals at the top

> [!success] Learning goals
> By the end of this page you'll be able to:
> - Define a function with parameters
> - Return a value
> - Recognize the difference between a parameter and an argument

Predict-then-verify exercises

> [!question] Predict
> What does this code print?
> ```python
> for i in range(3, 0, -1):
>     print(i)
> ```

> [!solution]- Verify
> ```python editor
> for i in range(3, 0, -1):
>     print(i)
> ```

A code block (just shown), then a runnable editor (collapsed) for verification.

Callouts cheat sheet