Sometimes while using TinyMCE one sees characters that are added randomly to the content and some of the content is garbled - text is distorted or scrambled. You see something similar to :
If this is something which you have encountered then chances are you are seeing character encoding problem.
What is character encoding problem?
Sometimes when you create a piece of content and then save and reload it from the database you will see some random characters like Â or ? are added to your content. When you see unusual characters like these in your content this is likely a character encoding issue.
Specifically, the existence of characters like Â and ? are commonly a result of a hard space ( or  ) or a Zero width non-breaking space (﻿) making its way into the content and then not being properly encoded.
There are a few other ways of spotting character encoding problems :
The symbol ? appears on entering text.This means character encoding has been corrupted.
The curved quote characters “ and ” or apostrophe character ’ - typically present in content imported from Word - are corrupted.
Special characters which you insert using TinyMCE’s Special Character menu item or toolbar button insert correctly but are incorrect once the content has been saved and reloaded from the database.
How to handle character encoding in TinyMCE ?
Now that we know what a character encoding problem is, let’s see how can we address the issue.
To resolve the issue you need to check encoding for the following components in your application :
Web Browser - browser encoding
Web Application code
If any component of your application uses a different encoding it is possible that random characters will appear in your content.
entity_encoding option in TinyMCE controls how entities or characters are processed by TinyMCE. Value of entity encoding can be set as encoding types as explained below :
named : characters will be converted into named entities based on the entities option.
Example : a non-breaking space could be encoded as &nsbp;
numeric : characters will be converted into numeric entities.
Example: a non-breaking space could be encoded as
raw : All characters will be stored in non-entity form except these XML default entities &,<,>,”
TinyMCE by default uses named encoding.
Once you have confirmed that all the components in your application have same encoding and if you do not want the default named encoding then you need to have an encoding setting in your configuration file.
Note: TinyMCE by default uses UTF-8 encoding
As mentioned above entity_encoding option in TinyMCE controls how entities/characters get processed by TinyMCE. Here is an example of how to use this setting:
selector: 'textarea', // change this value according to your HTML
entity_encoding : "numeric"
In this example I am using “numeric” value which will convert characters into numeric entities. For example, a non-breaking space would be encoded as
As explained above, if you see a character encoding problem in TinyMCE you need to make sure that all parts of your application (web browser, web application code, database, etc) are using the same encoding.
This problem is pretty easy to fix and all the above details should help easily tackle the issue.