Adding math and equations to TinyMCE is easy with WIRIS

The Tiny team is proud to introduce WIRIS as a new member of our Technical Partner Program. WIRIS makes the leading equation editor for TinyMCE, and is available in other popular applications like Google Docs. Let’s explore WIRIS MathType with Manuel Cagigas and Juan Lao from the WIRIS math team.

Why TinyMCE?

WIRIS built its first equation editor plugin for HTML editors in 2008, called Wiris Editor.  Even ten years ago, the number of online platforms using Tiny was terrific. Our main interest at that time was the potential use in Moodle, a very popular open source learning management system that used TinyMCE.

After a successful integration of the Wiris Editor with TinyMCE and Moodle, whenever we are asked by customers about a great HTML editor, we always recommend TinyMCE.

In 2017, Wiris Editor was rebranded to MathType, but it remains the same terrific equation editor plugin.

Of interest to developers

MathType is a math editor that stores expressions in MathML and shows images in the view mode. MathML is an XML standard defined by W3C to represent mathematics, but MathML is not part of the HTML specification. Hence, integrating a tool that inserts MathML into an HTML editor presents some unique challenges.

Our experience integrating MathType into TinyMCE has been easy and smooth, despite the fact that the MathType architecture involves significant complexity. The TinyMCE API provided all the elements that we needed to create a successful and stable integration.

For example, MathType saves MathML but shows an image representing a mathematical expression in the editing view. The way the TinyMCE API handles these events allowed us to save and represent MathType data properly, which facilitates the work for third party integrators.

And as noted above, MathType saves MathML, not the equation image. Since MathML is not part of the HTML specification when TinyMCE processes an HTML code, the MathML tags are naturally removed. The extended_valid_elements setting of the TinyMCE API allowed us to easily extend the valid HTML with the MathML specification.

Finally, MathType has two integrations for TinyMCE: one for TinyMCE 3 and one for TinyMCE 4. The transition between them has been painless and smooth. Indeed, due to the huge compatibility between the two APIs, we are able to maintain one single plugin for both TinyMCE versions.  This is huge benefit for our integrating developers and our end users.

What the future holds for MathType and TinyMCE

TinyMCE 5 and handwriting recognition

MathType for TinyMCE 5 is the project we’re currently working on, and about which we are very excited. In particular, we are already working with the TinyMCE engineering team to ensure that TinyMCE 5 will be compatible with handwriting recognition of math expressions, just like previous versions of TinyMCE.

Handwriting recognition is a natural fit for touchscreen devices, which are increasingly popular in today’s academic settings.  Here is an example of handwriting recognition from our Google Docs integration:

NPM integration

We are aware that a large number of developers integrate TinyMCE into their projects via NPM. We have uploaded our plugin to this repository as well, so all dependencies are centralized in a single place, easing and speeding up the integration, and allowing for automatic updates as soon as those updates are published.

Introducing ChemType

While WIRIS tools have focused for years on the creation of math content, most notably with MathType, we also have recently released  ChemType for the creation of chemical formulas. The TinyMCE plugin allows you to activate both MathType and ChemType.

ChemType brings the same improved user experience to chemical formula creation that our  users are familiar with from MathType. We look forward to continuing to improve both applications.

And please contact us if you have any thoughts or suggestions about either application.

About MathType, a WIRIS solution

MathType is a WIRIS solution to create and edit scientific expressions. WIRIS offers a suite of tools to create scientific content from equations to graphics to advanced assessment questions.

MathType is currently available for TinyMCE, Microsoft Office, Google Docs and other HTML editors.  Please follow us on Twitter, Facebook and LinkedIn to get all the latest news on our products.