Editor / Live Preview: Support Syntax Highlighting for Language XYZ

Feature requests
1

The Editor (and Live Preview) uses its own syntax highlighter engine. It is different from the one used in Reading mode and supports far fewer languages.

It would be nice if the Editor supports more languages and/or the same languages as reading mode.

3 Likes
2

Would be great to get syntax highlighting for Solidity. It is supported in PrismJS, so it should be enough to use the latest version in Obsidian; Thanks!

Related:

2 Likes
3

This answer in a related issue claims that Solidity is supported, but I’m unable to replicate that

Screenshot 2022-02-28 at 5.52.37 PM
Screenshot 2022-02-28 at 5.52.37 PM1444Ă—1446 156 KB

1 Like
4

it should work in reader. the editor is different matter.

5

Ah yes, it does work in preview :tada:

1 Like
6

While it does work in Reading, it does not work in Live Preview, unlike other languages. I believe that this is not intended behaviour, and would like to place this request forward.

7

Use case or problem

There is no syntax highlight for MATLAB codeblock in Live Preview.

Proposed solution

Migrate the syntax highlight for MATLAB in the reading mode to Live Preview.

1 Like
8

For code block, you can use octave instead of MATLAB.
Example:

octave 
function temp()

I hope this helps.

2 Likes
9

Thanks! Octave highlighting works great!

10

We strongly recommend you to search the forum with possible keywords before making a new feature request. If your request is very similar to an existing one, consider liking it and/or making a comment rather than making a new one. Once you’ve searched and determined that this is a new request, delete this line.

^^ Before the whitenoise person from “bugs” comes in raging, I searched below:
– WebAssembly
– WebAssembly code blocks
– WebAssembly code coloring
– WebAssembly feature requests
And there was no results in any for any of these items. THUS, I am submitting the request now.

Use case or problem

WebAssembly is growing in popularity, and since most other languages have some color-coding to signify key-terms, etc. It would be nice to have WebAssembly, be added in there. Well mainly WAT (WebAssembly Text Format). I mean after all if JSON gets its own coloring scheme, why not WAT? XD.

Proposed solution

Implementation is pretty easy, unlike other programming languages out there with a bunch of syntax-sugar, the WAT format is pretty simple.

  • If the word follows a “(” character it should be highlighted. As well as if a the word is attached to this word through (.) similar to a method syntax in other languages.
  • Anything in quotes, colored like in other languages.
  • Anything declared with a $ as its a variable declaration.
  • Any of the types should also be highlighted, i.e. (i32, i64, f32, f64).

There is probably more, but just at least, would give it some “pop” to stand out and make it less of a bore on the page when writing documentation.

Here is some example code for visual reference, if you have not seen it yet:

(module
	(global $import_integer_32 (import "env" "import_i32") i32)
	(global $import_float_32 (import "env" "import_f32") f32)
	(global $import_float_64 (import "env" "import_f64") f64)
	(import "js" "log_i32" (func $log_i32 (param i32)))
	(import "js" "log_f32" (func $log_f32 (param f32)))
	(import "js" "log_f64" (func $log_f64 (param f64)))
	(func (export "globaltest")
		(call $log_i32 (global.get $import_integer_32))
		(call $log_f32 (global.get $import_float_32))
		(call $log_f64 (global.get $import_float_64))
	)
)```
11

Lols, above its partially colored, but in the actual Obsidian code blocks it is not.

image_for_obsidian
image_for_obsidian641Ă—254 5.54 KB

12

Here is a possible workaround, which uses the reading mode syntax highlighter display, when in live preview. It utilises how dataview can insert markdown which is rendered by prism.js when displayed.

```dataviewjs 
dv.paragraph (`
~~~yourLanguage 
... the actual code...
~~~
`)
```

It’ll not be quite the same editing experience, but it’ll look nice!