162

I noticed that sometimes my code gets highlighted in different colors when rendered.

  • What is syntax highlighting?
  • How does it work?
  • What if my code isn't highlighted correctly?
  • How do I report a bug or request a new language?
  • What languages are currently available on Stack Exchange?

Return to FAQ index

Copied from the Meta Stack Exchange FAQ entry What is syntax highlighting and how does it work?

0

1 Answer 1

152

What is syntax highlighting?

Syntax highlighting allows code in posts to be highlighted based on the language it's written in, to make it easier to read.

How does it work?

Stack Exchange does not have its own syntax highlighting engine. It uses highlight.js. Therefore, any bugs and feature requests regarding the actual syntax highlighting code cannot be handled by Stack Exchange and should be directed to the team behind highlight.js.

Syntax highlighting is assigned to the preview when creating or editing posts as soon as you stop typing for 5 seconds.

How is the syntax highlighting language set?

The syntax highlighting may be set by the question's tags

If you have not explicitly set the syntax highlighting language for the code block or the post, Stack Exchanges uses the tags on the question to infer the language you are using. If two or more tags on the question have different syntax highlighting languages defined, it uses a default list and lets highlight.js infer what's the best language to use. If no tags have a language defined, no highlighting will be performed.

Moderators can set the syntax highlighting language for a tag from a predefined subset of those supported by Stack Exchange. The currently set syntax highlighting language for a tag is displayed on the tag's wiki page. The language hint (if any) that is currently being used for that tag will be displayed at the very bottom, below the buttons for the wiki:

Code language (used for syntax highlighting): lang-java

How do I explicitly set the syntax highlighting language

You can explicitly override the highlighting in use with your language of choice.

When using code fences

If you are using code fences (three backticks above and below the code block, ```), check out the supported languages and put the language name or alias right after the opening backticks, the lang- prefix is not needed:

```js
var a = 3;
while( !(a < 0)){
    alert("JavaScript code <b>goes</b> here.");
    a--;
}
```

renders as:

var a = 3;
while( !(a < 0)){
    alert("JavaScript code <b>goes</b> here.");
    a--;
}

To disable syntax highlighting, you can specify a language of "none" (or, equivalently, "lang-none"). For example:

```none
alert("Hello, world!");
```
Using pseudo-HTML comments prior to the code block (deprecated)
<!-- language: lang-or-tag-here -->

    code goes here

For instance, the following code block:

<!-- language: lang-js -->

    var a = 3;
    while( !(a < 0)){
        alert("JavaScript code <b>goes</b> here.");
        a--;
    }

renders as:

var a = 3;
while( !(a < 0)){
    alert("JavaScript code <b>goes</b> here.");
    a--;
}

If you don't want to have any syntax highlighting you can use the none language:

<!-- language: lang-none -->
Setting the syntax highlighting language for the entire question or answer (not deprecated)

If the selected language applies to all code blocks in your post, you can also use the <!-- language-all: lang-or-tag-here --> highlighting hint to have it be applied to all code blocks (so you don't have to add a hint before each one). If there's a highlighting language set for the whole post, you can still override that for specific code blocks by explicitly specifying the syntax highlighting language for that code block.

Available Syntax Highlighting Identifiers

You may use either a language code or a tag in the language hint to activate syntax highlighting.

Language Codes:

The full list of language codes currently available to use is maintained in the primary FAQ entry on Meta Stack Exchange.

Tags:

You can specify any tag that exists on the site, and it will use whatever language code is currently specified for that tag. Keep in mind that by default all tags start off with none as their language code. Tags with none specified as their language code will be ignored and revert to default.

You can also use the plain none keyword to manually specify no syntax highlighting, similar to using the lang-none code above.

Why isn't my code being highlighted correctly?

Before you do anything, are you sure that you've got the correct highlighting turned on?

It is common for people to have problems with syntax highlighting because the correct syntax highlighting language has not been set. Prior to declaring that there's a bug or your language isn't supported, please verify that the syntax highlighting language has actually been set for the code block you are experiencing problems with. To do so, you should go through the information above regarding how the syntax highlighting language can be set both implicitly from the tags and explicitly for the code block or post and be sure that it's been set.

Your language may not be supported by either or both Stack Exchange and/or highlight.js

If your post doesn't have the correct highlighting, it's possible it's not supported. Please look at the list of languages supported by Stack Exchange, which is a subset of languages supported by highlight.js. If your language is not on the list of languages supported by highlight.js, it needs to be created within the highlight.js project before it can be deployed by Stack Exchange. If a language that could be applied to a tag is already on the list of languages supported by highlight.js, but is not on the list of languages supported by Stack Exchange, you can raise a feature request here on Meta to have it deployed on the network.

How do I report a bug or request a new language?

If it is indeed a bug in the syntax highlighter itself, check the issues list to see if it has already been reported. If it hasn't, feel free to report it or join the project and submit a fix yourself. If you want to ensure that an issue you raised is fixed quickly, it's best to include the fix in the report. If the fix has already been implemented by Highlight.js but is still not working here, please raise a feature request on Meta to request that a new version of highlight.js be deployed.

You can also submit a request for a new language to be added in that same issues list. Keep in mind that Stack Exchange does not maintain this syntax highlighter, and posting bug reports or feature requests concerning it here on Meta will not get them fixed or implemented.


Originally copied from the Meta Stack Exchange FAQ entry, What is syntax highlighting and how does it work?

0

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .