TinyMCE logo

TinyMCE Removes Non-breaking Spaces

There are two reasons that TinyMCE might be removing non-breaking space entities ( ) from your HTML source code.  The first one is a common mistake people make when populating textareas.  This is covered in the TinyMCE FAQ, so there’s really no need to elaborate on this particular reason.

The second reason, however, is a bit more complicated, and only occurs if you have the entity_encoding property set to raw:

tinyMCE.init({
	mode : "textareas",
	theme : "advanced",
	...
	entity_encoding: 'raw'
});

If your configuration looks similar to this, you’ll most likely see all of your   entities get converted to regular spaces when you switch between HTML view and WYSIWYG view.  The easy solution would be to set entity_encoding to either named or numeric.  Fortunately, if you’re using ISO-8859-1 for your character encoding, you’re all set.  Unfortunately, if you’re using UTF-8 you’ll need to take an additional step to prevent many of your non-English characters from appearing as HTML entities.

The solution is simple.  Set your entity_encoding to named and overwrite the entities property:

tinyMCE.init({
	mode : "textareas",
	theme : "advanced",
	...
	entity_encoding: 'named',
	entities: '160,nbsp'
});

The above is the same thing as using raw entity encoding, except that your non-breaking space entities will be preserved.

About the author

Cory LaViska is a founder, web developer, and bootstrapper based in New Hampshire. His current focus is on Surreal CMS, an awesome SaaS content management service for web designers. Need to get in touch? You can connect with him on Twitter.

Comments

  1. Tomáš Kapler says:

    You are my lifesaver, this is exactly what i was looking for. If someone would need a wordpress function to do it without hacking core, just let me know and i will send it to you