How to Fix Non-Breaking Spaces When Copying from Word to CKEditor
Question details
Pasting text from Microsoft Word into CKEditor results in unwanted non-breaking spaces in the HTML source.
- Product
- Microsoft Word
- Device & OS
- not provided
- Scenario
- Copying rich text content from a Word document and pasting it into a web-based CKEditor interface.
- Observed behavior
- CKEditor's HTML source view displays multiple non-breaking space ( ) entities inserted throughout the pasted content, a behavior not seen when copying from Google Docs.
Ensure you have access to your CKEditor configuration files or your content management system's text editor settings, as resolving this requires adjusting how the editor handles clipboard data.
Configure CKEditor's Paste from Word Settings
Adjust CKEditor's configuration to actively clean up and remove non-breaking spaces during the paste conversion process.
This issue is primarily caused by CKEditor's conversion algorithm attempting to preserve Microsoft Word's exact visual layout. By modifying the 'Paste from Word' plugin settings or adding a custom data processor rule, you can force the editor to strip out these non-breaking spaces automatically.
Open your CKEditor 'config.js' file or navigate to the editor settings within your CMS dashboard.
Ensure that 'config.pasteFromWordRemoveFontStyles' and 'config.pasteFromWordRemoveStyles' are set to 'true' to strip out proprietary Word styling.
To specifically target non-breaking spaces, add an event listener to the 'paste' event in your CKEditor initialization script that uses a regular expression to replace ' ' with standard spaces: 'evt.data.dataValue = evt.data.dataValue.replace(/ /g, " ");'.
Use the Paste as Plain Text Feature
Bypass Word's complex rich-text clipboard data entirely to prevent formatting artifacts from transferring.
Remove Non-Breaking Spaces in Word Before Copying
Clean up the document formatting within Microsoft Word before transferring the content to the web editor.
Try WPS Office for Cleaner Text Copying
If Microsoft Word's complex clipboard formatting continues to cause issues in your web editors, WPS Office provides a lightweight, highly compatible word processing experience that generates cleaner clipboard data for seamless web integration.
Frequently Asked Questions
Why does pasting from Google Docs not create non-breaking spaces?
Google Docs is a native web application, so the HTML it places on your system's clipboard is already optimized for web environments. Microsoft Word is a desktop print application that uses highly complex, proprietary RTF and HTML data on the clipboard to preserve exact physical print layouts, which often translates into non-breaking spaces.
Is this a bug in Microsoft Word?
No, it is not considered a bug in Word. It is a result of how CKEditor's conversion algorithm interprets and preserves the complex styling data that Microsoft Word intentionally puts on the clipboard.
Does the CKEditor 'Paste from Word' plugin fix this automatically?
The 'Paste from Word' plugin helps normalize a lot of erratic HTML, but depending on your exact CKEditor version and configuration, it may still preserve non-breaking spaces to maintain paragraph indentations or layout. Customizing the plugin's configuration is often necessary.
