5

I search for a editor to write Markdown syntax and preview in the same textarea, like Bootstrap WYSIHTML5 for html.

enter image description here

I don't like a additional preview. The preview in additional element have many scripts, there I can find on the web. But for me is important, that the edit element is also the view element, write and see with markdown. Maybe hallo.js is great, but I think it works not with textarea element. Also it is fine, that I can use a small solution, not to oversize for a small list of buttons and functions. The textarea is also important for me, why the user will save with send post in php, also without Javascript. The goal is a simple notes, write markdown, alternative use the buttons to format and see only the formatted content to easy readable.

Hint: I have read question #1 and question #2, but only CK Editor and Aloha is the solution. Two nice projects, but very big for my small requirements.

Thanks a lot for your time.

Community
  • 1
  • 1
bueltge
  • 2,294
  • 1
  • 29
  • 40
  • With web technologies: CodeMirror is JS syntax-highlighting editor supporting variable-size fonts https://codemirror.net/demo/variableheight.html and widgets so most implementations are based on that. https://simplemde.com/, https://github.com/laobubu/HyperMD, desktop editors (electron) like http://abricotine.brrd.fr/, https://www.zettlr.com/. CodeMirror 5 had some weaknesses on mobile and with bidi; CodeMirror 6 just added markdown support, not widely used yet. https://stackedit.io/ is notable independent implementation, I think based on contenteditable. – Beni Cherniavsky-Paskin Feb 04 '21 at 08:38
  • There are very few implementations with native desktop GUI. https://wereturtle.github.io/ghostwriter/ uses Qt. – Beni Cherniavsky-Paskin Feb 04 '21 at 09:45
  • Emacs can also display variable fonts and images. `markdown-mode` does pretty good WYSIWYM on text styles and can render images in-place. `texfrag` can render inline math (though sizing is off). – Beni Cherniavsky-Paskin Feb 04 '21 at 09:48

2 Answers2

1

I have found a solution with the showdown and to-markdown, the the result and his source for example. The hint is, that I add a css statement style="display: none;", that hide the textarea with the source, not more. Line in the source file

--> https://github.com/bueltge/Notes

bueltge
  • 2,294
  • 1
  • 29
  • 40
1

But you still want to use markdown?

So I assume you still want to see the markdown-markup and the style: Editor (demo) is a plain text markdown editor, based on codemirror.

klml
  • 1,718
  • 16
  • 22
  • The editor is nice, but it not possible to live edit without switch to the preview. For editor, there not have the knowing about markdown is it easy to mark the strings and use the buttons, see live the result, without switch preview, markdown syntax. – bueltge Jul 07 '14 at 20:59