2

The TinyMCE editor replaces all   to regular spaces when starts typing. I want to prevent the html entity conversion. It converts the entities in each key press.

I have already tried, 

 entity_encoding: "named",
 entities: '160,nbsp,38,amp,60,lt,62,gt'

and

 entity_encoding: "named",
 entities: ' '

Is there anything else to do ? This is my TinyMCE initialization,

tinymce.init({
        selector: selector,
        apply_source_formatting:true,
        entity_encoding: "named",
        entities: '160,nbsp,38,amp,60,lt,62,gt',
        force_p_newlines: force_p,
        forced_root_block: forced_root,
        valid_elements: "*[*]",
        invalid_elements: invalid_elms,
        valid_children: "+span[div],+th[input]",
        extended_valid_elements: "sc[id],dd[*],dt[*],monospace[*],input[*]", 
        custom_elements: "~sc,~monospace,~input",
        table_toolbar: "",
        menubar: false,
        save_enablewhendirty: false,
        toolbar1: toolbar_icons,
        plugins: [plugins_str],
        inline: true,
        formats: format_array_new,
        resize: true,
        toolbar_sticky: true,
        contextmenu: false,
        remove_script_host: false,

        skin_url: this._global.tinymceUrl + "/skins/ui/oxide",
        autofocus: true,
        fixed_toolbar_container: "#editor-toolbar",
        draggable_modal: true,
        paste_auto_cleanup_on_paste: true,
        paste_remove_spans: true,
        paste_remove_styles: true,
        paste_text_sticky: true,
        paste_strip_class_attributes: "all",
        paste_retain_style_properties: "",
        paste_as_text: true,
});
Michael Fromin
  • 13,131
  • 2
  • 20
  • 31
Kavya m
  • 49
  • 2
  • 8

2 Answers2

1

TinyMCE will (regardless of configuration settings) use a mixture of hard ( ) and regular spaces when it processes content that contains a string of multiple spaces of any kind.

For example, if you type one letter, the spacebar 5 times, and then another letter TinyMCE would end up with something like:

a     b

This is done for a couple of reasons:

  1. It allows people to insert spaces into content in a manner consistent with what one might do in a word processor
  2. Alternating the hard and regular spaces allows the content to wrap within its containing element. A long string of hard spaces would often cause content to break out of its containing element and the typical content author would not understand that sentence or how to address the issue.

When the TinyMCE serializer runs this space management is part of the process and not something you can disable.

What you can do is wrap hard spaces that you don't want modified. If you load the Nonbreaking Space TinyMCE plugin there is a configuration option for this capability:

https://www.tiny.cloud/docs/plugins/nonbreaking/#nonbreaking_wrap

As this is "on" by default when you load the Nonbreaking Space plugin you will see that if you use the menus to Insert / Nonbreaking Space you get something like this:

<span class="mce-nbsp-wrap" contenteditable="false">&nbsp;</span>

There is no "magic" to this other than a span with the appropriate class. If you wrap any hard space you want maintained in this fashion TinyMCE will not modify that space as a part of the space management process.

Michael Fromin
  • 13,131
  • 2
  • 20
  • 31
1

Because I have struggled with this a lot, and because as is described in Michael Fromin's answer the standard nbsp poses a series of issues for rich text editors in HTML, I decided to skip using nbsp altogether and use one of the other Unicode non-breaking spaces as described here: https://en.wikipedia.org/wiki/Non-breaking_space#Width_variation

More specifically, I ended up using the "Figure space" character, which renders as a bit wider space than normal (depending on the font), but is probably better than the thin non-breaking space for most uses. I created a custom button that adds this special character in the content.

Just make sure that whatever font you're using, especially if you're processing the produced HTML for some other output like PDF, is supporting this glyph.

AsGoodAsItGets
  • 2,886
  • 34
  • 49