laobubu / HyperMD

A WYSIWYG Markdown Editor for browsers. Break the Wall between writing and previewing.
MIT License
1.47k stars 137 forks source link

Supporting syntax highlight for code block #69

Closed garaemon closed 4 years ago

garaemon commented 4 years ago

Is it possible to highlight the code block taking into account the syntax of programming languages?

niemes commented 4 years ago

yes, HyperMD use codemirror for that.

simple use : 3 ` without the space like on github

"let foo =  (bara) => return 'kooda'"
console.log(kooda)
garaemon commented 4 years ago

Is it possible to specify the name of the programming language which is used in the code block like ruby in the following example?

```ruby
require 'redcarpet'
markdown = Redcarpet.new("Hello World!")
puts markdown.to_html
```
niemes commented 4 years ago

Yes ofcourse, you can check the supported languages here : https://codemirror.net/mode/

Here an example of highlighting using hypermd codeblock with your code example :

hypermd_ruby

require 'redcarpet'
markdown = Redcarpet.new("Hello World!")
puts markdown.to_html

** You need to import/add all the codemirror mode and you can also change the css of the syntax highlighting.

garaemon commented 4 years ago

Thanks,

I confirmed that on the online HyperMD demo.

スクリーンショット 2020-08-25 17 31 37