Prettier markdown editor?

I’m one of those users who prefers, in principle, the purity of editing in markdown instead of WYSIWYG. In practice, though, Joplin’s markdown editor is, frankly, not much to look at - especially next to to the beautifully rendered output. Since I spend more time writing notes than reading them, it’s disappointing to have a gorgeous viewer but an ugly editor!

Has anyone here used the StackEdit editor? It’s essentially a syntax-coloring editor like Joplin’s, but it also changes the font size and style along with the color so that the editing view looks more like the output will. It’s beautiful and intuitive, and I would love to see this sort of thing in Joplin. I think it would inspire a lot more casual users to stick with markdown view. Try it out at the link above.

2 Likes

Sorry I did not try it. But since I use Typora ( https://typora.io/ ) I really do not need to look elsewhere.

1 Like

I think maybe I was unclear.

Typora is WYSIWYG, closed-source software that is currently free but will have an unspecified price once it exits beta.

I’m not suggesting that people can use StackEdit as an external editor for Joplin. I’m suggesting that Joplin’s internal, non-WYSIWIG editor could be upgraded to be a better non-WYSIWIG editor - specifically, something like StackEdit. It could maybe even use StackEdit itself, since it’s open-source. That way we might have no need for something like Typora at all.

2 Likes

Woow, Is there any way of already integrating it with joplin notes?
Looks a lot better.

Wow… I’d love something like StackEdit. The combination of Markdown and a bit of WYSIWYG is just perfekt!

1 Like

Wow, I have never used the StackEdit editor before, but yes I have to agree that one is amazing. Especially how it adds the # to the side in a different color and changes the text size. It feels a little bit like IA Writer (at least when I used it like 2012 or whenever that was. :D)

I had the same idea and I think that this awesome result could be achieved with css

I suggest that Joplin should have a markdown editor just like StackEdit by default. In fact

It’s essentially a syntax-coloring editor like Joplin’s, but it also changes the font size and style along with the color so that the editing view looks more like the output will

so writing would be more pleasant without the need to switch to rendered view to see the result.
What do you think, @tessus and @laurent?

@desk7

This post from @laurent gives details of the latest Joplin Pre-Release which has (amongst other things) an alternative Markdown editor.

New Markdown editor

A new Markdown editor (Code Mirror) is now included with Joplin. For now it is for beta testing only so you need to manually enable it in the options in “Note” => “Use CodeMirror as the code editor”. The goal of this new editor is to address several of the issues that have affected the previous Markdown editor and that were either hard or impossible to fix, in particular:
Support for spell checking. Note that it is not yet implemented in the new editor but it at least can be done now.
Variable font size. The previous editor would not allow this, which would cause various issues.
Search within the Markdown text. Previously it was only possible to searched with the note viewer but with this editor it should be possible to search within the Markdown text too.
Improved support for emojis.
Improved support for Asian languages and Russian.

I have only briefly looked at it but it seems to do some of the things you mention.

Thanks for the information. I’m looking forward to the stable release!

Looks like 1.0.218 has been promoted from pre-release to release

I have yet to have any problem with the Codemirror editor although I did make up a new Codemirror based userchrome.css to change some of the colours. However my css file is a lot smaller than the previous one because some of the things I tried to add to the Ace Editor are now native to Codemirror.

This is an interesting remark by John Gruber who designed Markdown: Daring Fireball: Things Support for Markdown

Things does Markdown right. It doesn’t hide the Markdown formatting characters, it just styles them. Effectively, the notes field for tasks in Things is still just plain text. It’s just styled nicely if you write that plain text in Markdown. That’s the right way to do Markdown. Don’t hide the formatting characters; just style/color them.

1 Like

Indeed I like how they display Markdown. It's a bit similar to what we have, except for the bullet points which currently we cannot style.

I think the way they style bold and italics, with the markup being grayed out, is what should do too (currently we make the whole text bold or italic, including markup) because it means the text standup more.

*Remarkable* Notes - Things Blog - Cultured Code

2 Likes

While all those visual enhancements do look cool, would it be a big problem to have an option in the GUI that would allow the user to enable/disable markdown visual styling at will? I'm talking about something done with a simple tick, and not having to rely on custom CSS to achieve.

I myself prefer to have markdown displayed as if it was plain text, and I know I'm not alone (see https://discourse.joplinapp.org/t/is-it-possible-to-get-the-markdown-editor-to-behave-like-a-plain-text-editor/20337). For me, one of the main reasons is that I usually find the default colours having too low contrast, and as such being difficult to read, especially anything grey on white background. Personally, I'd even consider this an accessibility issue.

I'm also not a fan of the gigantic # heading text, but this is more of a personal preference.

Second that.
I would love it so much if I had to stop constantly looking for a Joplin replacement that supports plain text.
Give us that simple checkbox please.

A lot of these can be achieved with the Rich Markdown plugin. But completely hiding the markdown characters, while possible, doesn't work very smoothly. Making them transparent for lines that aren't being edited works, though.

I really don't understand. Use the markdown editor and the code block and you are done. It can't be more plain text than than this.

If you are not happy with how CodeMirror shows text in the editor there are more than just one example on this forum how to tweak it to your liking.

Actually it can "be more plain text than than this".
Notepad is an excellent example that comes to mind.
Having to put three backticks in the beginning of every single little note you make just to not having your text mangled is just stupid to me. Sorry.

I never ever use markdown, but I surely don't mind having the option should I ever want to use it.

What I really don't understand is the resistance to this small little simple checkbox. Should be easy enough to implement, and make Joplin so much better for at least some of us.

1 Like

I don't quite get it, Joplin is a markdown notes application. Everything is stored in and works off the notes being markdown. If you don't want to use markdown then why pick Joplin?
Also I don't quite understand the use case here - markdown itself is essentially plain text, if you object to the 'hybrid' display in the markdown editor then you can just put some CSS to format it as plain text.

I totally get that.

The reason I have chosen Joplin so far is that it is the application that comes closest to my use case. It comes so close, only this little annoyance left to make it perfect. For me.

When I want wysiwyg I want wysiwyg. When I want plain text I want plain text.
Is that really such a strange request?

1 Like