2068837226

I recently added page management capabilities to this site (cms on sails), making it a fledgeling CMS. I used the same editor that is used by the Ghost blogging platform. You can find the source code on github.

Part of my quest to write a Sails.js based CMS was to find a web based markdown or html editor that would best serve my purposes. I had a few simple criteria in making my decision:

  • Popularity / Community support

Using a popular library means you’ll find many other developers in the same boat. If you run into bugs or issues, you’re more likely to find help in their issue tracker or on IRC.

  • Simplicity

Easy to set up, easy to maintain, easy to use for the end user. Clean and simple === good.

  • Personal preferences

At the end of the day, I’m going on a gut call. I didn’t prepare a fancy report or comparative analysis to decide what I’ll use. You should rely on my suggestions either — try out some editors and choose based on your own experience.

TinyMCE is a WYSYWIG (What you see is what you get) style HTML editor. It’s very popular, and used by multiple well known corporations. I found it because it was the first result on Google. There are many plugins and extensions available for TinyMCE which you can easily find online. It’s also easy to set up.

Epic Editor

On the downside, it might be too much for your needs. Users on stack overflow complain that it’s slow and heavy. It offers many extra features you might not need.

I personally avoided it because it doesn’t offer live preview — meaning you can’t see the rendered markup as you type. You have to click a button to see the output every time.

Easiest – EpicEditor

EpicEditor is a markdown based editor. The interface clean and concise, with only two buttons that appear on hover — a preview button and a full screen mode. The setup process was also easy. You download a JavaScript file and a stylesheet. Note: be attentive as to where you place the dependencies. You may need to configure the editor to point it to their exact locations.

EpicEditor is also customizable. There are several themes written by the community, and the JavaScript comes with a wide variety of different config choices. For myself, I really appreciate good defaults. EpicEditor has good defaults, so its easy on the eyes and works well — right out of the box.

EpicEditor in Action

At time of writing, I’m still using EpicEditor for the blog post side of the CMS. For simplicity and easier dependency management, I’m going to switch everything to the ghost editor soon.

Personal Favorite – Ghost Editor

Ghost Markdown Editor is a stand-alone version of the editor used by the Ghost Project. Luckily, Ghost is open source, and the code base is released under a very permissive license.

They have a beautiful website and blogging platform. If all I needed was a blog, I’d just run the self hosted version of their system (free). To anybody wanting to run their own blog, I recommend the hosted version of Ghost (5$/month) over anything else. it’s very sleek and easy to use.

Ghost Editor

Ghost Editor is my favorite because of the live preview feature. You can see your markup rendered live, right next to where you type. The repository comes with a good example implementation, so getting set up is quite easy. Visually, the editor is definitely above average compared to most WYSIWIG editors).

Conclusion

Nowadays there’s a free, JavaScript base editor for every need. TinyMCE, EpicEditor, and Ghost Markdown Editor are three of my favorites.

If there’s an editor you prefer over the ones I discussed, let me know in the comments, or contact me about it.