Syntax highlight code snippets in Orchard when configured to use markdown
Asked Answered
E

1

6

I've installed Orchard 1.7.0, enabled markdown for blog posts (roughly as detailed here) but I'm unable to figure out how to add syntax highlighting for C# (or any language) to my posts.

  • Does Orchard have the facility to add syntax highlighting for markdown? or
  • How does stackoverflow add syntax highlighting?
  • Will Syntax Highlighter for Orchard produce the desired effect?
Edgy answered 30/9, 2013 at 15:8 Comment(4)
Syntax Highlighter works where you have to wrap your Code snippet in a <pre class="brush: csharp"></pre> tag. I have never tried combining it with the markdown editor, might be a case of install it and see?Accelerate
@Accelerate the <pre> tags have no attributes. I seem to need <pre class="brush: csharp;"> to get it to work out of the box. The options are very limited compared to the WordPress version.Edgy
Would have to look at the Markdown Module, but I'm sure there would be a way to extend it to encompass the functionality you are searching for.Accelerate
Looks like the Markdown editor creates the code blocks etc in javascript in the Markdown.Converter.js file.. As a workaround, you could modify that file to emit the tags like you want them.Accelerate
E
5

StackExchange uses Google Code Prettify (see here) and there is an Orchard module TheMonarch.SyntaxHighlighter that sets this up.

This module uses Google code prettify to add syntax highlighting to Orchard Blog posts. Choose from several themes bundled from the Admin UI. Google code prettify automatically detects most languages.

Edgy answered 2/10, 2013 at 15:18 Comment(1)
google code prettify is directly available for orchard. We do not need the TheMonarch.SyntaxHighlighter to set it up. Just find 'google code pretify' from gallery, install. Then enable and select a theme. Works darn good with markdown as well.Buddleia

© 2022 - 2024 — McMap. All rights reserved.