Search code examples
htmlformsvisual-editor

Adding a visual editor to an HTML website

I have a website that will allow users to create posts. I want then to be able to do two very specific things:

  1. Wrap text in a code tag to then be displayed as code
  2. Add an image to the text

Stack Overflow's visual editor is a great example, except I only want to allow images and code (in addition to the regular text).

Is there any 3rd party plug-in or snippet that will allow me to add this type of visual editor to my website? Customizing its appearance would be a plus.

Additionally, how can this be displayed the way that stack overflow displays the code in a post?

I have been google searching for quite some time now with no luck. Any help would be great, thanks!

Solution

  • Check it out stackedit:

    https://github.com/benweet/stackedit/

    or pagedown

    https://code.google.com/p/pagedown/

    or the one from Stackoverflow itself WMD:

    https://blog.stackoverflow.com/2008/12/reverse-engineering-the-wmd-editor/