July 28, 2016

Cross-browser hyphenation support for Plone 5

Most browsers lack hyphenation support (except Firefox). This Plone 5 add-on brings customizable hyphenation support to Plone 5 e.g. for better readability of the Plone 5 toolbar in German language.

Browsers - even in 2016 - are in general bad when it comes to hyphenation using CSS. CSS provides support for hyphenation for a long-time through hyphens: auto. However most browser excepts Firefox do not support hyphenation of text. There are some Javascript add-ons around for providing  hyphenation support across all browsers and most common languages - solutions like Hyphenator.

In general hyphenation on the web is not that important as hyphenation in print due to different display sizes, responsive design etc. However in some situations you want proper hyphenation for words or texts when the horizontal width of a box is limited and the standard word breaking algorithms of browser just generate a bad result.

This is one of (my) issues with the Plone 5 toolbar which looks like this (out-of-the-box with German as language) with completely unacceptable and improper word breaks.

zopyx.plone.hyphenator solves this problem by integrating Hyphenator with Plone 5.

As a result the Plone 5 toolbar looks much nicer - in particular because a proper hyphenation.

zopyx.plone.hyphenator can be configured to apply hyphenation to arbitrary page element by specifying a list of related CSS selectors within the Hyphenator control panel

Hyphenator supports most of the frequently used languages. Further hyphenation options provided by Hyphenator  will be supported by zopyx.plone.hyphenator  over time.