Recommended Configuration for htmlArea

By: Lucas Thurston

Looks complicated at first glance, and some of it is. Much of what is going on here is straightforward, however. Here's what we're doing:

Reducing the options

There are simply too many built-in buttons in htmlArea. The more unnecessary options a content editor has, the greater the temptation to try new things or do a simple task a more complicated way. Since our goal is to simplify markup, yield more consistent HTML output and styles with CSS, we need to get rid of some options.

Instead of putting complex markup into text elements, another goal of simplifying is to use the content element types that TYPO3 provides us with: image with text, tables, etc. We have more control over the output of these content elements than we do over the output of the RTE, making future changes to the templates easier. Also, with the release of TYPO3 version 4.0, many steps towards tableless layouts have been taken, meaning output by TYPO3’s content rendering engine is cleaner than ever before.

Including the site stylesheet

In a perfect world, all styles would be designed in the original mock-up of the site. In this same internet utopia there is one style for links, one style for each header type, and on down the list. Alas, we often find ourselves in more of a content management purgatory, where we need multiple header layouts and inevitably something is missing from the mock-up, if indeed a completely mock-up even existed. Unless strict rules are set on what goes where (hierarchical structure of varying headers for instance) and how, too many doors can be left open for inconsistency.

Defining some special span classes for non-semantic content markup

The htmlArea RTE extension allows for the definition of some span tag classes, which is reads from the style sheet and allows the user to insert into the text with the “textstyle” button.