TinyMCE or WordPress inserting WBR html element into text in WordPress

Question

Greeting all,

I've written a simple WordPress shortcode which wraps inline $content in <code> tags. I see that sometimes the $content contains <wbr /> elements, which must be inserted either by TinyMCE or by WordPress. I'd never even heard of <wbr /> (word break opportunity) until I looked it up.

I'm guessing that TinyMCE is inserting the element in the WordPress visual editor, but I can't be sure. I looked through both the WordPress and TinyMCE source and I see mentions of <wbr /> but I couldn't find where it is being injected into the post content.

Do you know why the <wbr /> elements are being inserted, and if it's possible to turn off that behavior in shortcodes?

Forgot to mention that (for now) I'm working around the issue by removing the <wbr /> elements using preg_replace(). But I consider this kind of hack-ish and I'd prefer to turn it off in a cleaner way.

Answer 1

You can set invalid elements in tinymce using the invalid_elements option. This will take care of your issue. You have a lot of control with tinymce, you shouldn't have to use any regex. This and similar options in the cleanup/output should help you.

tinymce.init({
        ...
        invalid_elements : "wbr"
});