Show Markdown syntax in editor

Hi all,

I’ve just been poking around Prosemirror some and had a quick question. I really like the live editor feature in the demos where it transforms the markdown as you type. But, I would like to still keep the block level markdown syntax in the editor. I think this makes it easier to tell what headings are being used, etc. Stackedit does this pretty well I think:

So my question, is anyone doing something similar with Prosemirror? Any examples of how that is implemented?

Thanks!

2 Likes

In CodeMirror you wil find exactly that feature.

2 Likes

I also think this would be useful, but even more interesting to me would be a discussion of how you would do this in Prosemirror. Is the editor flexible enough to do something like this in a straightforward manner or would it be complicated?

You can do this with css like:

h2::before { content: "## "; }

There are projects that take it to the extreme of using all monospace fonts of the same size, but you could leave those styles out: http://mrcoles.com/demo/markdown-css/

2 Likes

two other better fitting codemirror examples: