Add WYSIWYG Editor option / preview

I’m loving Supernotes, but I’m not personally a fan of markdown editing. I simply prefer a WYSIWYG style of editing. For example, when I want to make something bold, I want to highlight it and press CMD-B to make it bold. Now, that works in Supernotes of course, but then in the editor view it shows bold text. Once it renders then it removes the markdown, which is also fine. I would much rather just have the text show as bold in the editor view, without the markdown syntax. This isn’t a right or wrong, just what I prefer.

There are quite a few ways to handle this, but I think the easiest and most elegant way would be to have a way to toggle back and forth between the markdown view and the rendered view in the editor AND to be able to change the default view as a Settings option. Being able to toggle between markdown and rendered view in the editor also helps to check the output will be what you expect (without exiting editing mode). Similarly, if you are in rendered editor mode and getting weird output, it is helpful to switch to markdown view and see if there is any unexpected markdown happening.

Hi @jtbowlin,

Thanks for your kind words. We’re very dedicated to building the best markdown (WYSIWYM) editor out there, and with a few more ergonomic and visual improvements to tasks, links and easier typographic emphasis, we think we can get there. But can totally understand the want for a WYSIWYG editor, especially if you are used to it.

Removing the markdown and just showing the WYSIWYG view can lead to many strange outlier issues, which I’m sure you’ve noticed with other editors, like how do you get out of a bold text block when you can’t see the asterisks – it becomes a guessing game (as you mentioned the weird output). This is why we’ve been reluctant about WYSIWYG editors from the start and are fans of our display / edit modes when you get used to it.

Interestingly you mentioned toggling the marks within the edit view – I feel like this will become too confusing for most users that you can toggle between display and edit view and then within edit view toggle between marks and no marks. Although I guess we could add a hidden keybind for this for “pro” users (but then this wouldn’t work on mobile). The best solution would probably be to just add this as a user preference – would this work for you? I would also be inclined to change this feature request to “Add WYSIWYG editor option”.

Hi @tobias . So what’s interesting is in this forum software, when I’m creating/editing a post, I have a markdown editor on the left, and a WYSIWYG preview on the right (after you close the similar threads message).

So when I put ** around a word to bold it, it shows the asterisks on the left pane, but shows the word in bold on the right pane. Then when I exit the editor and it renders, obviously it matches what it was showing me in the right pane preview. To me, this is kind of what I’m looking for. I want to be able to see the output without having to exit the editor.

Now, I know that creates design issues and this isn’t a must have for me, but if you can make it work in an elegant way then I think it would be useful for many more people than just myself.

Thanks for your further feedback @jtbowlin, that’s very helpful!

One of the biggest issues with a split screen editor is that it doesn’t work on small screens / mobile devices. We’ve played around with supporting this in the past but didn’t find a good enough flow that we were happy with. We will keep all of this in mind though and hopefully be able to make the editor more ergonomic for you.

Understood. Makes sense. Thanks @tobias.

1 Like