Home / GitHub Page

WYSIWYG editor in Joplin

Isn’t it what the current Joplin editor does? It would highlight **bold** in a different colour, as well as # headers and other Markdown markup. In that case, isn’t the issue simply that the theme should be improved? For example, instead of rendering **bold** in blue as it does now, it should simply be rendered as bold text. Or is there something else that’s missing?

Nope, got it in one. That’s what we want, to see larger text when we use titles, to see bold when we use bold, etc. Basically, to have an actual, intuitive understanding of what we’re doing.

The current editor goes halfway to what I was talking about, it does syntax highlighting on markdown. But as you mentioned in the last sentence, we would want bold text to actually bold (including the **), headers should be larger, links should be clickable, etc. Slatejs that @devonzuegel posted does a good job with headers and bold, but not with the links.

1 Like

To me it seems pretty good! Not sure what tables you’re talking about, I can’t see any in the default example notes when installing Joplin (the “Welcome!” notebook)… how do you guys create table please, what for? wasn’t some of the pro-markdown guys saying “notes are just text”? :slight_smile:
Thanks for the insights.
PS: does Joplin want to appeal to just the nerdy/programmer type of users or to the general public just needing to take notes?

I’m very agnostic about this. I don’t care if the rendered text is in another window or not, but think that doing it in the same window will appeal to more people. The one thing that would bother me a lot however, completely overriding the one or two windows argument, is if I import a page with the clipper (or imported from evernote) and have a lot of crap at the bottom, or otherwise make a mess, that I can easily get out of it and see where things start and end so I can delete what I don’t want.

One of the many great things about Joplin is that it is fast. Fast to write, fast to render, fast to import from clipper, fast to edit junk you don’t want. I’d be very sad if I lost that.

here’s an old (and closed) similar discussion, maybe containing some good hints (or maybe not! :slight_smile: )

Last week I installed plugin “Notes by Firefox” to my firefox instance.
It has few formatting options, but his behaviour is really correct imho.
Thanks for reading me !

Would that not compromise privacy?
That’s the main point I adopted Joplin to achieve.
The markdown pane in courier font makes it unpleasant to use though, so I’ve gone back to other apps for anything I don’t need to keep private.

Hi all,

bevore I want to give some insights about my thoughts related to this topic I would like to ask all of you two things:

  1. In regards of needs the categories right and wrong are not very useful (in my opinion)
  2. This project is more or less a one man show (by Laurent), so nobody has the right of implementation of any suggested feature even if it would bring millions of user.

This said I would like to go through some points which are in my opinion not clearly expressed

  1. Why should I use markdown?
  • I think that markdown has a great advai beside ux: freedom of choice regarding the editor I use - I can replace Joplin with any other md-editor if I like to. [Joplin does have an importer for some non open standards because so many apps don’t give that freedom to there user (thanks laurent)]
  • For my in person why I prefer a md-editor is the feature-richness and so many different possible flavors which are and could be added in the future
  • For those prefer no WYSIWYG Editor: there is only one other FOSS project I know, which has a Crossplattform and freedom of choice sync feature-set similar to joplin - and carnet has no E2EE
    So in summary people probably ask for WYSIWYG just because they are in to joplin for an other reason than markdown.

I also want to repeat one point which nails why I ask for an WYSIWYG Editor:
I write many very short notes for my Task-Management and some very long notes for different purpose (talks for example). In those long notes it is hard to oriented (even at the desktop) in the md only view and in my opinion, possible - but in a distracting way - with the dual panel view.
It gets even more harder when I want to work on my long notes at the mobile phone. I don’t have the opportunity of a dual panel view and because of the size of the smartphone (even so with 6" screen size) there is no chance for me to look up what I wrote earlier in the note.

So in my opinion a WYSIWYG Editor which lefts markdown formatting tags would give my the possibility to structure my text not only for reading but also when I write and I still can quickly edit the formatting if i want to.
(In terms of structure, this is why I prefer making headlines for example bigger over the actual implementation highlight formattings with color)

I hope this is understandable from the point of grammar and vocabulary - because my English is very poor.

But I also hope this helps to understand why some of us ask for an WYSIWYG Editor.

@lauren: I’m very thankful for your app. And I would be very happy to see this coming - as I mentioned already this is your project i totally understand if you don’t want to go for a feature you don’t want to use.

Anyway without commenting it I would like to add some words from Antoine de Saint-Exupéry’s the little prince:
You become responsible, forever, for what you have tamed.

Sorry this comment got way to long ^^

I prefer a decent, well-thought, long comment over many of the short ones I see here and elsewhere.

Having said that:

This pops up the idea of some sort of folding mode, where headings can be used to collapse/expand everything that is beneath. That would be really awful.

1 Like

I think you misunderstood. You can always use text and ascii to create tables. Furthermore, I said: Notes are usually text. (Please note the word ‘usually’.)

Obviously when you add an image, it’s not text. But this is rather the exception for me. For note taking I use text, because I want to search it and maybe alter/revise it later. It should be a living document. Images are static. I’m also not saying that using images is a bad idea. I use images as well, e.g. a pic of a whiteboard with architectural scribble, and some such.

I only said: Notes are usually text. If this is not the case for you, you are maybe looking for an app where you can dump all sorts of stuff into. There are hundreds of “organizer” apps out there. They are closed source, most likely only allow you to sync with either their own infrastructure or a publc cloud, don’t provide E2EE, and are not available an all platforms. But that’s another story and should probably go in a separate topic.

To come back to WYSIWYG: I never said I am against it. I said that if it were ever to be implemented, I would only hope that it would be a choice and not mandatory.


I think a very good implementation of this approach is done by Bear Notes on iOS and macOS. You can write regular Markdown, which is not hidden, but it renders it in a very similar way as a preview window would. I use Bear daily and actually learned to love markdown because of it. I just started using Joplin, because I would like to replace Bear and Evernote with an application where I can control the privacy of my data. When editing longer texts I currently use Typora as an editor for Joplin, but I would rather just work in one app.

Here is what one of my recent notes looks like in Bear:

1 Like

In this Fedora Magazine article there’s few markdown editors mentioned (even Joplin through the comments)

@devonzuegel if you’re still looking into this, I found a really nice editor built on CodeMirror, HyperMD it supports WYSIWYG (but has the option to show all markdown syntax), it’s definitely worth looking into giving that it supports everything Joplin needs and has the solid base of CodeMirror.

I don’t know how difficult it will be to set up given that this is a react app, but I found an example of someone integrating CodeMirror with react so it shouldn’t be impossible (also a component).

p.s. When using the demo make sure to click on “Lab” and untoggle “Hide tokens”

Cool, thanks for the rec. The demo you shared looks great. I’ll play around with it.

I’ve been playing with Slate editor, which seems powerful and extensible but requires heavy lifting to create the modules to get the behavior we’re looking for. HyperMD could be a great solution to that problem!

One idea is to store/edit notes in whatever format the person chooses. I think the Ghost blogging platform does this. They do it at the block of text level. I.e., each block has a rendering type. Each block is markdown or their own WYSIWYG format. That would add a lot of complexity to Joplin though, right?

To be frank, I’m kind of in the camp of, “just stick with markdown as it is.” Anything else is going to introduce some significant compromises, I suspect. Markdown is a fast, clean, ubiquitous standard. Folks that don’t like it? Um… Well… Use something else? Is that harsh? Do two panes bug you? Maybe just show the one? That’s why that option is there? I just don’t quite understand why this is hard. Cuz folks have to learn something new? Is that bad? Hey, once they learn markdown and how markdown editors work, that means they can work with the zillion other markdown interfaces out there, since, you know, markdown is everywhere.

Is WYSIWYG worth exploring? Yes. Of course. My contention is that markdown, in the raw, is such a refreshing usability improvement and gives you some really powerful flexibility. That’s the whole reason it was developed in the first place. Folks wanting a WYSIWYG interface IMHO are somewhere on the learning- and comfort-curve with markdown. The great thing is that markdown is So. Damn. Simple. to learn. The tough part is just getting used to it.

I’m rambling. Explore away. But, folks, markdown is your friend. It really is a wonderful interface if you’d just stop fighting it. :slight_smile:

1 Like

Oh, wow, this HyperMD thing looks great.

HyperMD indeed seems to be much better than Marktext. It still makes a few mistakes, for example rendering content that should be in a PRE tag, or messing up some tables but overall it seems pretty good.

1 Like

Hi! Really needs a good editor

Sharp,php View the horror!!!