Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Document the fact that Rouge only recognises lower-case language identifiers #35697

Open
wants to merge 2 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@
````
`````

![Screenshot of rendered {% data variables.product.prodname_dotcom %} Markdown showing how quadruple backticks cause triple backticks surrounding a code block to remain visible. The block reads, "Look! You can see my backticks."](/assets/images/help/writing/fenced-code-show-backticks-rendered.png)

Check warning on line 43 in content/get-started/writing-on-github/working-with-advanced-formatting/creating-and-highlighting-code-blocks.md

View workflow job for this annotation

GitHub Actions / lint-content

Images alternate text should be between 40-150 characters

Image alternate text is 188 characters long.

{% data reusables.user-settings.enabling-fixed-width-fonts %}

Expand All @@ -66,6 +66,11 @@

![Screenshot of three lines of Ruby code as displayed on {% data variables.product.prodname_dotcom %}. Elements of the code display in purple, blue, and red type for scannability.](/assets/images/help/writing/code-block-syntax-highlighting-rendered.png)

> [!NOTE]
> While both capitalized and lower-case language identifiers are allowed on GitHub, to
> have a fenced code block highlighted on GitHub Pages sites the same way they're
> highlighted on GitHub, you must use lower-case language identifiers.

We use [Linguist](https://github.com/github-linguist/linguist) to perform language detection and to select [third-party grammars](https://github.com/github-linguist/linguist/blob/main/vendor/README.md) for syntax highlighting. You can find out which keywords are valid in [the languages YAML file](https://github.com/github-linguist/linguist/blob/main/lib/linguist/languages.yml).

## Creating diagrams
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -110,6 +110,10 @@ To make your site easier to read, code snippets are highlighted on {% data varia

By default, code blocks on your site will be highlighted by Jekyll. Jekyll uses the [Rouge](https://github.com/rouge-ruby/rouge) highlighter (which is compatible with [Pygments](https://pygments.org/)). If you specify Pygments in your `_config.yml` file, Rouge will be used as the fallback instead. Jekyll cannot use any other syntax highlighter, and you'll get a page build warning if you specify another syntax highlighter in your `_config.yml` file. For more information, see [AUTOTITLE](/pages/setting-up-a-github-pages-site-with-jekyll/about-jekyll-build-errors-for-github-pages-sites).

> [!NOTE]
> Rouge will only recognize lower-case language identifiers for a fenced code
> block.

If you want to use another highlighter, such as [highlight.js](https://github.com/highlightjs/highlight.js), you must disable Jekyll's syntax highlighting by updating your project's `_config.yml` file.

```yaml
Expand Down
Loading