Overview
Add a code snippet to your notes with syntax highlighting, then choose its language and display options. Give the snippet a title, show line numbers, or wrap long lines to make code easier to read.
Copy or format code, upload a supported text-based source file, or download the snippet. You can also run Python code or open an HTML preview from the block.
When to use it
Keep a useful code example alongside the notes that explain it.
Document a function, query, or configuration snippet for later reference.
Show line numbers when discussing specific lines of code.
Preview HTML or run a Python snippet while working through an example.
Features and settings
Setting
Choose a language
Set the code language so the snippet uses syntax highlighting appropriate to it. Choose a language that matches the code.
Setting
Add a title
Give the snippet a short title to make its purpose clear when you return to it.
Setting
Show line numbers
Turn on line numbers when you need to refer to particular lines or make a longer snippet easier to scan.
Setting
Wrap long lines
Turn on word wrapping to keep long lines visible within the code block instead of requiring horizontal scrolling.
Built in
Copy and format code
Use Copy Code to copy the snippet, or Format code to format it. You can also upload a supported text-based source file or download the code.
Built in
Preview HTML and run Python
Use Run HTML Preview to view HTML in a sandboxed preview, or Run Python to run Python code locally in your browser.
How to use it
Add a code block
In the editor, type / and search for Code Block.
Enter your code
Type or paste code into the block, or use Upload file to add a supported text-based source file.
Set up the snippet
Choose the code language, add a title if useful, and decide whether to show line numbers or wrap long lines.
Use the code
Copy or format the snippet, download it, or use Run HTML Preview or Run Python when working with HTML or Python.
Where it works
On any page
In the / menu
Inside board cards
Turn other blocks into it
Own settings panel
Lara can add it for you
Examples
Document a code example
Keep a syntax-highlighted function next to the explanation of what it does.
Review a snippet by line
Show line numbers so you can point to a specific part of a longer example.
Try HTML or Python
Preview an HTML snippet in its sandbox or run a Python example locally in your browser.
Tips · Limitations
Tips
Choose the language that matches your code for clearer syntax highlighting.
Add a short title to distinguish similar snippets.
Turn on line numbers when your notes refer to specific lines.
Use word wrapping when you want long lines to stay visible in the block.
Limitations
Uploaded files must be supported text-based source files; other files cannot be opened as code.
The HTML preview runs in a sandbox.
Frequently asked questions
How do I add a code snippet to my notes?
Type / in the editor, search for Code Block, then type or paste your code into the block.
How do I add syntax highlighting to code?
Choose the language that matches your snippet. The code block displays syntax highlighting for the selected language.
Can I show line numbers in a code snippet?
Yes. Turn on line numbers in the block options to make it easier to refer to individual lines.
Can I run code in a code block?
You can run Python with Run Python, which runs locally in your browser. For HTML, use Run HTML Preview to open a sandboxed preview.
How do I copy or download code from my notes?
Use Copy Code to copy the snippet, or choose Download to save the code.
Build your next page with Code Block
Open Workspace, type / and add it in a second. Free to start, no credit card.