# Code block

Blocks of code or any preformatted text can be displayed by wrapping with triple backticks characters before and after.

A basic code block
```
A basic code block
```

# Syntax highlighting

Optional syntax highlighting of the code within the code block can be configured by adding a language identifier immediately after the opening triple backticks.

In the following sample, we configure JavaScript syntax highlighting for the code block by adding the js language identifier.

const msg = "hello, world";
```js
const msg = "hello, world";
```

# Title

Retype includes the functionality to set a title on your markdown code blocks.

Code block title
const msg = "Set a code block title";
``` Code block title
const msg = "Set a code block title";
```

The title can be used in conjunction with the code reference type.

Code block title
const msg = "Set a code block title";
```js Code block title
const msg = "Set a code block title";
```

The title must be separated from the opening fence by one space.

The pattern ``` Code block title will work as expected and ```Code block title will not.

If a code language is used, separate the title from the lang by one space. The pattern ```js Code block title will work as expected.


# Line numbers

Adding or removing line numbering for your code blocks can be configured by adding the # specifier character to the first line after the reference language.

const msg = "hello, world";
```js #
const msg = "hello, world";
```

You can also add a title after the #:

Your title here
const msg = "hello, world";
```js # Your title here
const msg = "hello, world";
```

The # must be separated from the opening ``` by one space. The pattern ``` # would work and the pattern ```# would not.

If a title is added, the title must also be separated from the # by one space. For instance, the pattern ``` # Your title here would work as expected and the pattern ``` #Your title here would not.

Line numbering can also be configured at the project level using the snippets config on your projects retype.json file. For instance, instructing Retype to add line numbering to all js and json code blocks across the website would require the following config:

Enable line numbering for js and json code blocks site wide
{
  "snippets": {
    "lineNumbers": [ "js", "json" ]
  }
}

With the above snippets config, then you would not have to add the # specifier to each code block. All js and json code blocks would automatically get line numbers.

Without snippets config
```js #
const msg = "Hello, world";
```
With snippets config
```js
const msg = "Hello, world";
```

If you configure a site wide snippets for a language and would like to explicitly remove the line numbering for a code block instance of that language, please add the !# specifier to the code block instance.

Remove line numbers if snippets config
```js !#
const msg = "Hello, world";
```

# Disable line numbers

Explicitly disabling the line numbering within code blocks is possible by using the !# specifier instead of #. This is expecially useful if the site wide snippets has been configured within your project retype.json file.

const msg = "Hello, world";
```js !#
const msg = "Hello, world";
```