Can I insert a soft hyphen ­ in the CKEditor?

[Alf S.]

As I try to insert a soft hyphen (­) in the Code, the soft hyphen is always removed as I click on OK in the Code Editor of CKEditor.

I am only using "Typographer" as a Textformatter (works well but sometimes, when I have long words like "Unternehmenskommunikation" it fails). Deactivated, but the soft hyphen is still removed.

Also deactivated ACF and HTML Purifier. No luck.

<wbr>  works, but it's kinda outdated and shows no hyphen.

What is the correct setting to allow soft hyphens?

[BrendonKoz]

I just tested this a bit with HTMLPurifier, and (at least in quick testing) was unable to prevent it (as far as I could tell) from removing the HTML equivalent of the character (using &shy;, or pasting a rendered version of it in directly). Searching the internet as a whole doesn't seem to give much specific information either. Since &amp; worked but &shy; did not, I'm not entirely sure what's going on internally without auditing the underlying code (for HTMLPurifier), and would likely have to do the same for CKEditor and/or ProcessWire.

If you change the field from a WYSIWYG interface to a simple textarea, does it work as expected? If so, you might need a CKEditor plugin for the soft hyphen, but I'm simply guessing.

In the one Stack Overflow topic I found, most people actually recommended using <wbr> over a soft hyphen - why do you feel it's "kinda outdated"? With the exception of Internet Explorer 11, it has full browser support, and if it works right now (whereas soft hyphen does not) then that's less time you'd need to worry about it. As for the lack of a hyphen, there might be some CSS solutions there, but I'm unsure how well they'd work out.

One last thought: I didn't test this in ProcessWire myself -- are you sure it's not just converting the text of &shy; to \u00ad in the database?

[Alf S.]

@BrendonKoz

Thank you. It works as it has to. But not as I expected.

As there is an input of &nbsp; the code editor shows it when I reopen it. Not when there is a soft hyphen &shy;. Obviously it is converted to \u00ad, as you said, but it can not be seen. Unless I insert the text in my text cleaner: http://www.2h11.de/tools/clean-text.html 

My mistake. Errare humanum artificialis intelligentia est.

I did not try tinyMCE but I guess it behaves the same. I will see…

[BitPoet]

1 hour ago, Alf S. said:

I did not try tinyMCE but I guess it behaves the same. I will see…

A quick test with InputfieldTinyMCE left the &shy; intact in the source code view.

[Alf S.]

16 hours ago, BrendonKoz said:

recommended using <wbr> over a soft hyphen - why do you feel it's "kinda outdated"?

…it does not render a hyphen in the browser… it just breaks the word (Mac OS, Firefox)

[aagd]

Hi, just wanted to add, that hyphenation is also possible via CSS, so adding a class (via a custom entry in Styles) might also be an option.
Here's a good intro: All you need to know about hyphenation in CSS | by Richard Rutter | Clearleft Thinking | Medium

[BrendonKoz]

Yup, definitely possible. It can potentially cause breaks in unintended spots which, for certain languages, are just unacceptable, so that has to be considered as well. It's still an option, though. A soft hyphen or <wbr> are options that allow direct control of where breaks should occur, if any, and one must consider what is best for their project and use-case. Thanks for providing the linked resource, aagd!

@BitPoet and @Alf S. thank you for reporting back!