From Word and Excel to Froala Editor. Will it paste?

Every time we put out a new release for the Froala Document Editor, we are eagerly waiting for your feedback to see if the changes are met by expectations. Yesterday was a special day as we’ve released a new version for Froala WYSIWYG Editor, and among the new stuff and bug fixing, there is one plugin that stands out: Enhanced Microsoft Word and Excel pasting. We’ve been paying attention to pasting content from other sources into the editor from day one, and the editor was always graciously cleaning the pasted content. In the last period, we got lots of requests from you about the possibility to keep more of the Word and Excel formatting, such as font size, colors, table styling, or nested lists.

Although it might seem like a trivial thing at first glance, and you might think that browsers do the hard work for you, when pasting from Word or Excel into a browser, there is tons of unnecessary markup. Moreover, important information which doesn’t come as HTML has to be parsed and converted appropriately for the browser to render it. We understood how important this is to you, so we accepted this challenge and got our hands dirty with the Word markup. Here are a couple of the obstacles we faced in the first month of development for this feature.

Missing a good documentation

Working without a solid documentation is like a shot in the dark. There is ECMA-376 Standard which offers details about Office Open XML File Formats, however the structure often gets broken when it is copied to the clipboard. There is no documentation that you can rely on and you mainly have to use the “trial and error” approach to find out what to look for and come to a way of cleaning all the mess and convert the pasted content into a HTML which is proper structured and also keeps the important data. We basically took all the documents we could find and stared at the pasted structure for hours to understand what is going on there. Before going further, I want to thank you all who were there to help us with Word and Excel documents with different structures. You guys are the best!

Pasting images

Yes, you can now paste images from Word and they get uploaded to your server just as a regular image. This was a great engineering challenge and we loved to hack it! By default, when you paste from Word into the browser, the images are loaded through the FILE:// protocol and you can see them, however reading their contents and uploading is not possible. The images wouldn’t load without uploading them to a custom server, when you want to display the edited HTML to someone from a different computer.

We’ve been trying everything possible to read the image from the local path, but all the attempts in this direction were just a waste of time. However, we were set to have this working and it was time for a different approach by converting the images to BASE64 and uploading them from there. I remember how excited we were around here when we saw the first image being pasted from Word, uploaded to our server and then displayed in the editable box.

You can make it better

At this moment, pasting from Word and Excel into the Froala WYSIWYG HTML Editor is definitely possible and it keeps most of the style and you can even customize what to keep there and what not through the editor options: https://froala.com/wysiwyg-editor/docs/options#pasteAllowedStyleProps, https://froala.com/wysiwyg-editor/docs/options#pasteDeniedTags and https://froala.com/wysiwyg-editor/docs/options#pasteDeniedAttrs. We’re aware that there might be few minor glitches and we rely on you to tell us when something goes wrong. Therefore, if you find anything that you believe should work in a different way, just reach our engineering team and we’ll get it solved.