Enhance your content with Code Blocks in SmartDoc, a feature that makes code snippets stand out with syntax highlighting, fixed-width fonts, and line numbers. Whether you're sharing programming scripts or visually distinct content, Code Blocks are easy to use and customize.

Plan Availability	All plan types
Permissions	Available to all users with access to SmartDocs.
Related Reading	Creating and Managing SmartDocs

What are Code Blocks?

Code Blocks in SmartDoc:

Display code with syntax highlighting for improved clarity and readability.
Use a fixed-width font to ensure alignment and improve visual distinction.
Include line numbers to make referencing specific sections easy.

Example: JavaScript Code Block

function greet(name) { console.log(`Hello, ${name}!`); } greet("SmartSuite User");

Note: Code Blocks aren’t just for programmers! You can also use them for regular text without syntax highlighting to create visually distinct sections.

Supported Programming Languages

SmartDoc supports a wide variety of languages for syntax highlighting:

Programming Languages	Markup Languages	Other Formats
C	HTML	JSON
C#	Markdown	YAML
C++	XML	SQL
Java	CSS	Plain Text (default)
JavaScript	SASS
Python
Ruby
TypeScript
And more: Go, PHP, Shell, etc.

Using SmartDoc Code Blocks

Adding a New Code Block

1. From the Slash-Command Menu

Type / at the start of a new line or after a space.
Search for Code Block or scroll to it under the Advanced section.
Click Insert Code Block to add it.

2. Using Markdown

Type three backticks (```) at the start of a line to create a Code Block instantly.
Your cursor will focus inside the Code Block, ready for input.

Customizing Code Blocks

Setting Language Type

Default: Plain Text.
Change Language: Use the dropdown under the Code Block to select a programming or markup language.
- Example: Select "JavaScript" to apply syntax highlighting for JavaScript code.

Adjusting Word Wrapping

Default: Word wrapping is enabled.
Disable Wrapping:
- Click the three-line icon (next to the language dropdown).
- A horizontal scrollbar will appear, allowing text to extend beyond the right margin.

Editing a Code Block

Edit Code Block content like text in a Text Area field.
You can change the language type and toggle word wrapping at any time.
Important: Remember to save the record to preserve your changes.

Deleting a Code Block

Click the Code Block.
Click the Trash Can icon (a "Delete" tooltip will appear on hover).
Undo Option: Press Ctrl + Z (Windows) or Cmd + Z (Mac) to restore the deleted Code Block instantly.

Examples of Use

1. Programming Tutorials

Use syntax highlighting to showcase code examples clearly in various languages.

2. Documentation

Add code snippets for API references, database queries, or configuration files.

3. Visually Distinct Content

Use Code Blocks for non-code text to create structured, visually separated sections in your SmartDoc.