Add syntax highlighting to parsed markdown in Visual Studio Online.
We are using markdown files in our Git repositories for documentation. There are a lot of code examples, but highlighting for programming languages is not implemented in the parsed markdown in VSO.
It would've been awesome to get this feature implemented.
Thank you guys for the all the great work!
Syntax highlighting for code blocks in markdown is supported in markdown files rendered in the File Explorer, wiki pages, and in PR comments. To do this, you must use the code “fencing” syntax and provide the language for the highlighting. See the details in the markdown syntax docs: https://docs.microsoft.com/en-us/vsts/collaborate/markdown-guidance#code-highlighting
These features are available in both VSTS and TFS 2018 RTM.
Thank you so much for addressing this issue. It is nice to finally have syntax highlighting in the Markdown files in VSO.
However, my team bumped into an issue with performance when the language was specified incorrectly. We had a markdown file which had two code blocks of SQL, but we had specified the language as TSQL. When attempting to view the 'Preview' tab of the markdown file, the browser suddenly consumes a significant amount of CPU and memory usage for the tab continually increases (some sort of leak it seems). This causes IE to lock up and crash, and causes the Chrome tab to come to a crawl. Changing the language from TSQL to SQL (no other changes to the markdown) fixes the issue.
Highlighting feature is not working for me, the final result is just a gray box witout format.
According to next guidance:
In VSTS by now this works for the Wiki preview. It still doesn't work for md-files outside of the wiki.
It is implemented, here is the syntax to use:
Kyle Schouviller commented
I did some experimentation, and it seems like just adding highlight.js to the page, adding one of the highlight.js stylesheets (e.g. the VS one), and then intializing it with hljs.initHighlighting() makes it work. Nothing else is required. Could we please get this done soon, or is there any way I can contribute?
Jørn A commented
Would it not be fairly easy to use your fabulous Mocaco editor for code blocks to enable syntax highlighting?
As no one seems to care to reopen this suggestion because this feature was never implemented as requested, I added a new one at:
I'd be thankful if anyone who stumbles across this would take the time to leave a vote at this new suggestion!
As TFS supports markdown files nicely, we decided to use it for our documentation needs. Unfortunately, the rendered markdown files do not use syntax highlighting for code blocks, which would be a very nice addition.
An unfortunately closed suggestion already asked for this feature, but as discussed there in the comments, it was never implemented:
Thus, I decided to open a new suggestion.
To be clear: there is syntax highlighting while editing markdown files, for the markdown code as well as code blocks inside it. That's nice, but having it in the rendered representation of the file would be much more important.
Jimmy Sorting commented
As the author of this idea I can confirm that the requested feature is still not implemented.
As Bernhard mentioned, this idea is about highlighting the code on the rendered page, or in "view mode" if it makes more sense.
This idea shouldn't be closed, please set the state to open.
Thanks for the confirmation, @dir.
It seems syntax highlighting works in markup editing mode when you use the fencing notation (like ```csharp) - it immediately colors the keywords. But it does not work when you view the actual page (as its HTML representation). It should be exactly the other way around.
Frustrating. I don't understand why this is closed, having fencing notation is not what this idea was about.
Doesn't work for me either.
I can use the fencing notation, but I don't see any syntax highlighting. Is really *syntax highlighting* supposed to work or just the fencing notation?
Thanks! When will this go live?
and maybe also add a designer (or at least preview) pane as one would have for other document/UI markup languages (say HTML, XAML)
David Judd commented
The GitHub readme and wiki markdown is our starting point for every new project and repository. VSO is lacking quite a bit behind in terms of markdown styling/editing.
Bruno Leonardo Michels commented
Extensions might or might not do this, but anyway Visual Studio should support this native. VS is falling behind in this other part of the world.
Yes! Especially since fenced code blocks ARE in fact colorized when editing online but not when only looking at the rendered markdown.
The blog post about using markdown files in VSO even claims that "Github-flavored extension" should work, but syntax highlighting doesn't.
Yes, please! Add syntax highlighting like in GitHub: