1
0
mirror of synced 2025-12-21 10:57:10 -05:00
Files
docs/content/github/writing-on-github/creating-and-highlighting-code-blocks.md
2020-11-02 15:12:44 -06:00

1.8 KiB

title, intro, redirect_from, versions
title intro redirect_from versions
Creating and highlighting code blocks Share samples of code with fenced code blocks and enabling syntax highlighting.
/articles/creating-and-highlighting-code-blocks
free-pro-team enterprise-server github-ae
* * *

Fenced code blocks

You can create fenced code blocks by placing triple backticks ``` before and after the code block. We recommend placing a blank line before and after code blocks to make the raw formatting easier to read.

```
function test() {
  console.log("notice the blank line before this function?");
}
```

Rendered fenced code block

{% tip %}

Tip: To preserve your formatting within a list, make sure to indent non-fenced code blocks by eight spaces.

{% endtip %}

Syntax highlighting

You can add an optional language identifier to enable syntax highlighting in your fenced code block.

For example, to syntax highlight Ruby code:

```ruby
require 'redcarpet'
markdown = Redcarpet.new("Hello World!")
puts markdown.to_html
```

Rendered code block with Ruby syntax highlighting

We use Linguist to perform language detection and to select third-party grammars for syntax highlighting. You can find out which keywords are valid in the languages YAML file.

Further reading