Made Tech Blog

SirTrevorJS: King of the WYSIWYGs

A lot of our projects include some sort of manageable content, whether it be landing pages, blog postings or news articles, so it’s important for us to be able to provide our clients with an interface that allows them to easily create content that looks great.

Over the years, we’ve tried various WYSIWYG editors, including TinyMCE, Redactor and CKEditor, which are all fine in their own way, they each allow content to be edited as if you were working within a word processor, and we understand the appeal that has, but we’ve found that they can quickly lead to badly and inconsistently formatted content, especially in larger organisations with multiple content editors.

Good Evening, Sir Trevor

We discovered SirTrevorJS some time ago, and we were mightily impressed. Rather than treating content like a word processor, SirTrevor instead allows you to create a series of blocks, each of which can be set as one of a large list of different types. Out of the box, these block types include Heading, Text, Quote, Image, List and Video.

After selecting your block type, you’re presented with a very simple UI within which to fill out your content, and by highlighting sections of text you’re also able to format that text in bold, italics or with links.

The modular nature of these blocks means that we can concentrate on styling them individually, secure in the knowledge that they will look great, and consistent, in whatever configuration you can think of.

One of SirTrevor’s most useful features is the ability to create and define custom block types, something we’ve taken advantage of to create our own little block library that is now in use on many of our projects. These include Banners, Carousels and Images with Captions, all of which are often either impossible or difficult to create in other WYSIWYGs. In the world of e-commerce, we’ve also created blocks that allow you to easily search your database and set products related to the article you’re writing.

While a relatively young plugin (version 0.5.0 at the time of writing), and bearing in mind that there are some cases where it might be preferable to use a more traditional WYSIWYG, we would encourage anyone building applications with content management requirements to spend some time trying SirTrevor out.

Links:

About the Author

Avatar for Scott Mason

Scott Mason

Software Engineer at Made Tech