6 types of web applications you can build with TinyMCE (with 17 examples)

Joomla! Gives its users a lot of freedom – being able to format content as they please and pull in content parts from other parts of the CMS – which creates a rich and powerful editing experience.

But sometimes you want to restrict things a little more in your CMS, which leads us to the next example…

Users often need to edit short-form content, like a product description in an online store.

On its “Edit Product” screen, Shopify gives users a more simplified experience than the previous Joomla! example. However, they’ve still enabled select advanced capabilities like tables, to make it easy for store administrators to write product descriptions that include important information (ie. sizes or product variants).

Short–form content is often part of a larger page, with several components, so adding more control over what the user can do (through formatting options) helps to ensure that the content will “fit” with the rest of the page.

Many websites – especially news sites and blogs – encourage users to engage with one another via the comments. This helps build a sense of community, encourages repeat visits, and provides valuable feedback.

Here, TinyMCE is used as the rich text editor that allows visitors to leave comments and ask questions. Similar to short-form content, the best practice here is to keep the editing controls to a minimum – visitors want to write short messages and don’t want to be overwhelmed with formatting options.

Most organizations have some sort of contact form on their website. Sometimes they’re generated by your CRM, Marketing Automation tool, via a plugin in your CMS, or sometimes your web developer builds one from scratch.

In cases where visitors need to convey complex information in their inquiry, you can offer them rich text editing inside your contact form.

A great rich text editor stands out when it comes to word processing – specifically pageless, digital-first content. To showcase the editor’s abilities, there’s a Word Processing starter config and demo that can be set up in under 5 minutes.

It’s been modeled to match the Google Docs’ editing experience, including all the necessary editing controls, as well as a fully customizable spell checker and collaborative tools like comments and mentions.

Document builders are similar to word processors, but rather than creating free-form documents, a document builder creates them from various components or ‘blocks’. This allows for tighter control, to ensure the document conforms to strict brand or legal standards.

They’re the most commonly used in web apps that generate contracts, proposals, invoices, or other content that either has a strict structure, or contains repeatable parts (for example a boilerplate header, introduction, and closing statement).

In the above example, Concord Now’s rich text editor includes commenting functionality to let users review and discuss documents throughout the creation and approval workflows. This functionality delivers a streamlined contract management experience.

Brightspace LMS uses TinyMCE to enable course authors to create learning content, as well as in many other areas within their LMS. In addition to leveraging key editing capabilities like the ability to create sortable tables and a detailed word counter, where collaboration is crucial to the learning environment, they also let users @mention each other to aid the communication flow.

With accessible content being vital to the education space, Brightspace LMS also includes TinyMCE’s Accessibility Checker, and a customized color picker (with WCAG compliance checking), that they added through TinyMCE’s library of APIs.

HubSpot, a well-known player in the marketing automation space, uses TinyMCE in its drag-and-drop email builder. In addition to using merge tags for personalization and leveraging many of its out-of-the-box formatting capabilities, they’ve also built their own custom UI on top of the editor to match their platform’s look and feel.

The TinyMCE core rich text editor is also used in HubSpot’s Landing Page builder and other parts of their platform where users can create rich content.

While it may not be the first email use case that comes to mind, rich text editors play a strong, silent and mostly hidden role in the administration panels of several types of software. Administrators of platforms that send out transactional emails, like purchase confirmations or password reset emails, use the editor to craft and style emails that often contain dynamic content – such as unique links, codes, or transactions.

The TinyMCE editor that lies within Atlassian’s Confluence workspace, enables users to create, collaborate and share content related to projects, teams, and anything else work-related. In addition to a tailored UI and several custom-built functions like smart links and code samples, Confluence makes heavy use of table functionality to give users the power to improve the layout of their pages.

For most knowledge workers, teamwork is part of day-to-day work. All the project management tools (e.g. Jira, Asana or Monday.com) are designed to help team members communicate and get work done more efficiently, with better results.

The example shown above is our Workflow and Collaboration starter config, modeled off of the popular Jira project management tool. Here, the editor is used in two places – in the description of the task or work item to be done, and as a comments field to ask questions, provide updates and discuss the task.

Because email is so important to CRMs, we’ve included one more email use case. SalesLoft, a leading sales engagement platform, uses TinyMCE as their email template editor, was well as in all other places where WYSIWYG editing is a must – including editing meeting notes and maintaining snippets.

The SalesLoft customization includes a live preview pane that inserts dynamic sample data into emails, so that users can see what their email looks like when it arrives in the Inbox. They also added the ability to insert video content (for example a personalized hello message from a sales rep) into the email, directly from Vidyard.

With CRMs becoming the nerve center for customer engagement, many now offer their own ticketing system to help manage support issues.

In cases where issue descriptions can be complex and details need to be accurately conveyed to support staff, an advanced rich text editor helps users to effectively convey their issues and questions, without being held back by a plain text field.

This can lead to faster support resolutions, less back-and-forth and ultimately happier, more loyal customers.

Most text inputs used on the “edit record” of CRM screens are simple plain text – and for good reason. Speed and efficiency is the name of the game if a company wants to get the most out of their revenue teams.

But sometimes, a record requires more detail than what a plain text field can provide. In these cases, upgrading those fields with a rich text editor, allows users to describe calls or prospect needs in more detail – so colleagues can more easily understand the status of an account and pick up where the last person left off.