# Syntax highlighting of code examples **URL:** \ **Category:** Announcements\ **Tags:** sonarqube-cloud\ **Created:** [September 5, 2023, 8:21am UTC](https://community.sonarsource.com/t/syntax-highlighting-of-code-examples/98626 "2023-09-05T08:21:23Z")\ **Posts on this page:** 12\ **Page:** 1
**Author:** ![john.clifton](https://dub1.discourse-cdn.com/sonarsource/user_avatar/community.sonarsource.com/john.clifton/32/47448_2.png) [@john.clifton](https://community.sonarsource.com/u/john.clifton)\ **Post date:** [September 5, 2023, 8:21am UTC](https://community.sonarsource.com/t/syntax-highlighting-of-code-examples/98626/1 "2023-09-05T08:21:24Z")
Hello SonarCloud users! We are pleased to announce one more feature to help you get to Clean Code faster. Following the addition of ‘diff’ highlighting, we are adding syntax highlighting to noncompliant and compliant code examples. This should make it easier to see what updates are needed: ![image](https://europe1.discourse-cdn.com/sonarsource/uploads/sonarcommunity/original/3X/2/a/2ae5e8ba8f436e2ea9ddcdc9081b8df89ee38f70.png) As ever, any feedback and questions are most welcome. ---
**Author:** ![Nicolas\_Alcaraz](https://dub1.discourse-cdn.com/sonarsource/user_avatar/community.sonarsource.com/nicolas_alcaraz/32/48495_2.png) [@Nicolas\_Alcaraz](https://community.sonarsource.com/u/Nicolas_Alcaraz)\ **Post date:** [September 13, 2023, 10:46am UTC](https://community.sonarsource.com/t/syntax-highlighting-of-code-examples/98626/2 "2023-09-13T10:46:34Z")
Hi John, I just noticed that after upgrading to version 10.2. That is great! I develop my own plugin and I’d like to be able to sometimes bypass language auto-detection. I tried to add something like that in my HTML rule description file but it does not work: ```auto 
...

```

Any idea?

Thank you

Regards

Nicolas

---




**Author:** ![john.clifton](https://dub1.discourse-cdn.com/sonarsource/user_avatar/community.sonarsource.com/john.clifton/32/47448_2.png) [@john.clifton](https://community.sonarsource.com/u/john.clifton)\
**Post date:** [September 13, 2023, 11:09am UTC](https://community.sonarsource.com/t/syntax-highlighting-of-code-examples/98626/3 "2023-09-13T11:09:32Z")




Hi Nicolas,

Thank you for your feedback. Could you say a little bit more about what you would like to do, please? Are you trying to turn off the syntax highlighting completely or specify the particular language(s) that the code example is written in? What sort of results are you getting today?

We have been discussing adding the ability to specify the language of a code example, but haven’t got a plan for when this might be delivered at the moment.

Best regards

John

---




**Author:** ![Nicolas\_Alcaraz](https://dub1.discourse-cdn.com/sonarsource/user_avatar/community.sonarsource.com/nicolas_alcaraz/32/48495_2.png) [@Nicolas\_Alcaraz](https://community.sonarsource.com/u/Nicolas_Alcaraz)\
**Post date:** [September 13, 2023, 12:08pm UTC](https://community.sonarsource.com/t/syntax-highlighting-of-code-examples/98626/4 "2023-09-13T12:08:55Z")




Hi John,

For instance, for the following piece of code, I’d like no highlighting (or plaintext highlighting) according to the framework you’re using for highlighting:

 ![image](https://europe1.discourse-cdn.com/sonarsource/uploads/sonarcommunity/original/3X/5/5/55223e2fac2af8df468451e54a2e9f2d964fde3f.png)

Thank you

Regards

Nicolas

---




**Author:** ![john.clifton](https://dub1.discourse-cdn.com/sonarsource/user_avatar/community.sonarsource.com/john.clifton/32/47448_2.png) [@john.clifton](https://community.sonarsource.com/u/john.clifton)\
**Post date:** [September 13, 2023, 12:33pm UTC](https://community.sonarsource.com/t/syntax-highlighting-of-code-examples/98626/5 "2023-09-13T12:33:21Z")




Thank you for coming back so quickly. I’ll talk to the team and see if anything is possible today.

Kind regards

John

---




**Author:** ![john.clifton](https://dub1.discourse-cdn.com/sonarsource/user_avatar/community.sonarsource.com/john.clifton/32/47448_2.png) [@john.clifton](https://community.sonarsource.com/u/john.clifton)\
**Post date:** [September 14, 2023, 9:54am UTC](https://community.sonarsource.com/t/syntax-highlighting-of-code-examples/98626/6 "2023-09-14T09:54:37Z")




Hi @Nicolas_Alcaraz ,

It looks like php:S6600 needs to do something similar:

 ![image](https://europe1.discourse-cdn.com/sonarsource/uploads/sonarcommunity/original/3X/4/c/4ce57be36580e16a9227a1969797b9f7032a9b50.png)

It does it by putting backticks around each individual word:

```auto
To be noted that some construct such as `isset()`, `exit()` or `array()` does require them.
Here is the list of constructs for which parentheses could be used but should be avoided :
`return`, `echo`, `break`, `clone`, `case`, `continue`, `include`, `include_once`, `require`, `require_once`, `print`, `return`, `throw`, `yield`, `yield from`

```

Preview view: [https://github.com/SonarSource/rspec/blob/master/rules/S6600/php/rule.adoc](https://github.com/SonarSource/rspec/blob/master/rules/S6600/php/rule.adoc)  
Raw view: [https://raw.githubusercontent.com/SonarSource/rspec/master/rules/S6600/php/rule.adoc](https://raw.githubusercontent.com/SonarSource/rspec/master/rules/S6600/php/rule.adoc)

I hope that helps.

Best regards

John

---




**Author:** ![Nicolas\_Alcaraz](https://dub1.discourse-cdn.com/sonarsource/user_avatar/community.sonarsource.com/nicolas_alcaraz/32/48495_2.png) [@Nicolas\_Alcaraz](https://community.sonarsource.com/u/Nicolas_Alcaraz)\
**Post date:** [September 14, 2023, 5:09pm UTC](https://community.sonarsource.com/t/syntax-highlighting-of-code-examples/98626/7 "2023-09-14T17:09:55Z")




Hi John,

It looks like this “adoc” stuff is SonarSource specific.  
My rule description is stored as an HTML file. Thus, backtick syntax is not supported.  
That also links to my other question: ['Diff' highlighting for code examples and Clean Code Principles - #4 by Nicolas\_Alcaraz](https://community.sonarsource.com/t/diff-highlighting-for-code-examples-and-clean-code-principles/88149/4)

Thank you

Regards

Nicolas

---




**Author:** ![john.clifton](https://dub1.discourse-cdn.com/sonarsource/user_avatar/community.sonarsource.com/john.clifton/32/47448_2.png) [@john.clifton](https://community.sonarsource.com/u/john.clifton)\
**Post date:** [September 20, 2023, 8:29am UTC](https://community.sonarsource.com/t/syntax-highlighting-of-code-examples/98626/8 "2023-09-20T08:29:45Z")




Hi Nicolas,

Apologies, I think the equivalent in HTML is wrapping each word like this:

`` word ``

This is the rule I mentioned above in HTML format: [https://github.com/SonarSource/sonar-php/blob/master/php-checks/src/main/resources/org/sonar/l10n/php/rules/php/S6600.html](https://github.com/SonarSource/sonar-php/blob/master/php-checks/src/main/resources/org/sonar/l10n/php/rules/php/S6600.html)

Regards

John

---




**Author:** ![Nicolas\_Alcaraz](https://dub1.discourse-cdn.com/sonarsource/user_avatar/community.sonarsource.com/nicolas_alcaraz/32/48495_2.png) [@Nicolas\_Alcaraz](https://community.sonarsource.com/u/Nicolas_Alcaraz)\
**Post date:** [September 21, 2023, 7:36am UTC](https://community.sonarsource.com/t/syntax-highlighting-of-code-examples/98626/9 "2023-09-21T07:36:04Z")




Hi John,

It is what I’m doing:

![image](https://europe1.discourse-cdn.com/sonarsource/uploads/sonarcommunity/original/3X/7/2/7272703bd3d607bcbcc040f0234739e12c4cd871.png)

But whatever the class I pass to code, the keyword inside gets colorized.

Regards

Nicolas

---




**Author:** ![john.clifton](https://dub1.discourse-cdn.com/sonarsource/user_avatar/community.sonarsource.com/john.clifton/32/47448_2.png) [@john.clifton](https://community.sonarsource.com/u/john.clifton)\
**Post date:** [October 6, 2023, 2:19pm UTC](https://community.sonarsource.com/t/syntax-highlighting-of-code-examples/98626/15 "2023-10-06T14:19:08Z")




Hi,

Looking at sonar-java I found this rule for example: [https://github.com/SonarSource/sonar-java/blob/912ab49deb09376a9aecb97aa65b1121e3fb25be/java-checks/src/main/resources/org/sonar/l10n/java/rules/java/S1210.html](https://github.com/SonarSource/sonar-java/blob/912ab49deb09376a9aecb97aa65b1121e3fb25be/java-checks/src/main/resources/org/sonar/l10n/java/rules/java/S1210.html)

This uses ` text ` without any additional ‘class’ parameters in `` and produces the effect I think you are looking for:

 ![image](https://europe1.discourse-cdn.com/sonarsource/uploads/sonarcommunity/original/3X/d/4/d43e93400aefc101da10a7cb5689a01a4f373de4.png)

[https://next.sonarqube.com/sonarqube/coding\_rules?q=s1210&open=java%3AS1210](https://next.sonarqube.com/sonarqube/coding_rules?q=s1210&open=java%3AS1210)

Regards

John

---




**Author:** ![Nicolas\_Alcaraz](https://dub1.discourse-cdn.com/sonarsource/user_avatar/community.sonarsource.com/nicolas_alcaraz/32/48495_2.png) [@Nicolas\_Alcaraz](https://community.sonarsource.com/u/Nicolas_Alcaraz)\
**Post date:** [October 6, 2023, 7:35pm UTC](https://community.sonarsource.com/t/syntax-highlighting-of-code-examples/98626/16 "2023-10-06T19:35:19Z")




Hi John,

Thanks for the follow-up.

There must be some kind of rule description html processing on your side before generating the plugin because I don’t get the same output on my side with the same piece of html:

![image](https://europe1.discourse-cdn.com/sonarsource/uploads/sonarcommunity/original/3X/9/d/9d3d9262f0ec5a2e44e6a02f3c42946d22668fb3.png)

On your side:

![image](https://europe1.discourse-cdn.com/sonarsource/uploads/sonarcommunity/original/3X/d/4/d41583de43ec685d450eeab548060ab1d40f2e93.png)

Could you please ask somebody from your dev team about it?

Thanks a lot

Regards

Nicolas

---




**Author:** ![felipebz](https://dub1.discourse-cdn.com/sonarsource/user_avatar/community.sonarsource.com/felipebz/32/32739_2.png) [@felipebz](https://community.sonarsource.com/u/felipebz)\
**Post date:** [October 7, 2023, 12:55pm UTC](https://community.sonarsource.com/t/syntax-highlighting-of-code-examples/98626/17 "2023-10-07T12:55:53Z")




Hi,

They’re using the [highlight.js library](https://highlightjs.org/) to render the code on the issue details. It’s used [here](https://github.com/SonarSource/sonarqube/blob/master/server/sonar-web/design-system/src/components/CodeSyntaxHighlighter.tsx) in the SonarQube source code.

So, unless your language is supported by highlight.js, there’s no other way to highlight the code samples.