DEPRECATION WARNING

This documentation is not using the current rendering mechanism and is probably outdated. The extension maintainer should switch to the new system. Details on how to use the rendering mechanism can be found here.

EXT: htmlArea RTE

Author:Stanislas Rolland
Created:2008-01-05T21:28:53
Changed by:Stanislas Rolland
Changed:2012-04-23T21:24:09.400000000
Email:typo3(arobas)sjbr.ca
Info 2:Stanislas Rolland
Info 3:
Info 4:

EXT: htmlArea RTE

((generated))

Table of Contents

Copyright 2

Credits 2

License 2

Sponsors 2

Introduction 3

What does it do? 3

Requirements 3

What's new in TYPO3 4.7 3

Support 3

Users Manual 4

Text formating with inline elements 4

List of inline elements 4

Labels in the text formating drop-down list 4

Behavior of the text formating drop-down list and of the buttons 4

Text styling with classes on inline elements 5

List of inline elements 5

Labels in the text styling drop-down list 6

Behavior of the text styling drop-down list 6

Using definition lists 7

Buttons 7

Creating a definition list 7

Creating and remapping dt/dd elements 8

Nesting definition lists (Indent/TAB) 8

Marking language 11

Drop-down list and button 11

Editing language marks 12

Using hotkeys 14

FAQ: How do I remove a link? 14

FAQ: How do I delete a table? 14

FAQ: How do I configure the editor to use my CSS styles? 15

FAQ: Is it possible to style the appearance of links in the RTE itself? 15

FAQ: How can I use a Bengali Open Type font in the editor? 15

FAQ: How do I configure the RTE to keep my custom tag? 16

FAQ: Why is the class attribute on table tags always rendered as contenttable in the front end? 16

FAQ: Why are abbr and acronym tags not correctly rendered in the front end? 16

FAQ: Why are popup windows too small when they open? 16

FAQ: Why is the editor not displayed with full width when I use the full window wizard? 16

FAQ: Why do style selector boxes remain disabled in IE? 17

FAQ: Why can't I get all buttons to be displayed? 17

FAQ: Why does it take so long to load the editor in Internet Explorer? 17

Configuration 18

Installing the RTE 18

Extension configuration variables 18

User TSConfig 18

Page TSConfig 20

Toolbar Elements 44

Static Template: Clickenlarge Rendering 46

Default Website Language 46

Server Configuration 46

Installing multiple RTE's 46

Using htmlArea RTE in a front end plugin 47

Configuring the anchor accessibility feature 47

Default Configurations 48

Default configuration of RTE content transformation 48

Typical default configuration 50

Minimal default configuration 53

Demo default configuration 53

Image default configuration 56

Troubleshooting 58

Internet Explorer caching problem with Apache mod_gzip module 58

Internet Explorer and HTML tag abbr 59

Security error when accessing the stylesheets 59

Issue with Firefox extension NoScript 60

Introduction

What does it do?

The extension offers a Rich Text Editor or RTE with the following features:

  • Support for Firefox 1.5+, SeaMonkey 1.0+, Safari 3.0.4+, Google Chrome 1.0+ and Opera 9.62+ on all platforms, and for IE6.0+ on Windows platforms;
  • Based on the ExtJS JavaScript framework;
  • Integration of TYPO3 image insertion and link insertion browsers, configurable color selector and user element insertion dialog;
  • Configuration through TYPO3 Extension Manager, Page and User TSConfig RTE properties; three default sets of Page and User TSConfig configuration settings for typical situations, advanced users or demo environments;
  • Integration with the translation facilities of TYPO3;
  • Block and inline CSS style selector boxes with style descriptors imported from an external CSS file;
  • Integration of a spell checking feature providing server-side spell checking in many languages, with optional personal dictionaries for backend users;
  • Integration of ContextMenu, TableOperations, InsertSmiley, FindReplace, RemoveFormat, CharacterMap, QuickTag and Acronym htmlArea extensions;
  • Anchor accessibility feature;
  • Clean paste feature;
  • Hook on Lorem Ipsum wizard so that dummy content may be inserted when the editor is in wysiwyg mode;
  • Optional configurable server-side HTML cleaning when content is pasted into the editor;
  • A class that may be used in front end extensions to enable rich text editing of text fields.

Requirements

Starting with TYPO3 4.0, the extension is included as system extension.

If spell checker feature is enabled in version 1.4.2+, then Static Info Tables version 2.0.0+ is required. If spell checker feature is enabled in versions before 1.4.2, version 1.1.0 (or more recent) of the Static Info Library extension (sr_static_info) is required.

The spell checker feature requires GNU Aspell 0.60+ to be installed on the server.

The spell checker requires PHP to be compiled with pspell. If PHP is not compiled with pspell, the spell checker will function in shell_exec mode.

The hook on the Lorem Ipsum wizard requires version 1.1.0+ of the Lorem Ipsum extension (lorem_ipsum).

What's new in TYPO3 4.7

The following features have been added in TYPO3 4.7:

  • a new toolbar button (insertsofthyphen) allows to insert a soft hyphen into the text without opening the «Insert special character» dialogue. This feature was sponsored by Bundesanstalt für Landwirtschaft und Ernährung (BLE);
  • the following HTML5 block elements are enabled in the RTE: article, aside, footer, header, nav, section;
  • a new tab of the «Edit element» dialogue allows to edit microdata items using, by default, the voculary defined by schema.org ; a new button «Show microdata» allows to highlight the microdata items in the RTE editing area;
  • the click-enlarge feature now uses an HTML5-compliant custom attribute (data-htmlarea-clickenlarge);
  • the order of tabs of the Insert/modify image dialogue may be configured in Page TSConfig.

Support

Please see/report problems on TYPO3 Forge http://forge.typo3.org/projects/typo3v4-core/issues under category rtehtmlarea.

You may get support in the use of this extension by subscribing to news://news.netfielders.de/typo3.projects.rte .

Users Manual

Text formating with inline elements

The overall idea behind this is to make it as comfortable as possible to write semantic inline markup without having to code. Buttons in general are very easy to access, but if there are too many of them, they are confusing.

Now, which elements you need most often depends on the type of text you are writing.

  • If your site is about literature, you need a lot of q, cite, samp, dfn.
  • If your site is about typo3, what you need is a lot of code, var, kbd, samp, dfn and and ocassionally q and cite.
  • On a university website you have both subjects in different parts of the pagetree.

Therefore the idea is to have those elements as buttons you need most often, and the complete list in a drop-down list. Which buttons are shown and which elements are shown are configurable via Page and/or User TSConfig.

List of inline elements

b, bdo, big, cite, code, del, dfn, em, i, ins, kbd, q, samp, small, span, strike, strong, sub, sup, tt, u, var

Labels in the text formating drop-down list

In the drop-down list, depending on RTE configuration, both, the label and the tagname may be shown.

The label is important for those authors that do not know HTML, the tagname is convenient for the coders and also for the HTML novices, because this way they can learn their meanings and be enabled to use the status bar.

For example, depending on configuration, we may have:

q – Quotation

or

Quotation – q

or

Quotation

Labels are always shown in the author's language regardless of the content's language.

The default order is alphabetical but may be configured otherwise in Page TSConfig.

Behavior of the text formating drop-down list and of the buttons

While in case of nested inline markup all buttons may be highlighted, only one of the options will be pre-selected in the drop-down list and therefore be shown in the collapsed drop-down list.

Legend:

highlighted (selected) string:This is the string inside the textarea the author has selected using the mouse or keyboard.

|= cursor position inside the textarea.

Case 1: No string is highlighted and the cursor is outside any inline element:

a) the option shown in the collapsed drop-down list is 'No text format ';

  1. the drop-down list and all buttons are disabled.
Case 2: No string is highlighted and the cursor is inside an inline element:

Example: <code>wor \| d</code>

a) the option shown in the collapsed drop-down list is the type of the inner inline element in which the cursor is positioned;

  1. the drop-down list and all buttons are enabled;

c) the button corresponding to the type of the inner inline element in which the cursor is positioned is highlighted by means of a white background; if the cursor is positioned inside nested inline elements, all corresponding buttons are highlighted by means of a white background;

d) if the author chooses a different markup in the drop-down list or clicks on a button that is not highlighted, the markup of the inner inline element is remapped;

e) if the author chooses 'Remove text format', the markup of the inner inline element is removed;

f) if the author clicks on an highlighted button, the markup of the innermost inline element of the corresponding type is removed;

  1. the position of the cursor is unchanged.
Case 3: A string is highlighted and crosses multiple elements:

a) the option shown in the collapsed drop-down list is 'No text format' (first option);

  1. if the string crosses multiple block elements:

the drop-down list is disabled;

  1. if the string crosses multiple inline elements:
  • the option shown in the collapsed drop-down list is 'No text format';
  • the drop-down list is enabled;
  • if the author chooses a markup, the highlighted string is wrapped with the chosen markup;
  • the resulting marked up string is not highlighted;
  • the cursor is positioned at the end of the marked up string.
Case 4: The highlighted string is not contained in any inline element:

a) the option shown in the collapsed drop-down list is 'No text format';

b) if the author chooses a markup, the highlighted string is wrapped with the chosen markup;

  1. the resulting marked up string is not highlighted;

d) the cursor is positioned at the end of the marked up string, so that This is great!becomes <strong> This is great!|</strong>.

Case 5: The highlighted string is contained in an inline element:

a) the option shown in the collapsed drop-down list is 'No text format';

b) if the author chooses a markup, the highlighted string is wrapped with the chosen markup;

  1. the resulting marked up string is not highlighted;
  2. the cursor is positioned at the end of the marked up string.

Example 1:

<q>This is a verygood question.</q>

becomes

<q>This is a <strong> very|</strong>question.</q>.

Example 2:

<q>This is great!</q>, he shouted.

becomes

<q><strong>This is great!|</strong></q>, he shouted.

Case 6: The highlighted string contains exactly the complete inline element:

Example of highlighted string:<code>word</code>

a) The option shown in the collapsed drop-down list is the type of inline element corresponding to the highlighted string;

b) if the author chooses 'Remove textformat', the inline markup gets removed:<code>word</code>becomesword|;

c) if the author chooses another markup, e.g. <var> , the markup wraps the highlighted node, so that<code>word</code>becomes <var><code>word | </code></var> .

Text styling with classes on inline elements

The text styling drop-down list makes it possible to add a class to an inline element:

  • whenever the cursor is put somewhere inside the element;
  • when the element is completely selected.

The classes allowed for each type of inline element are configurable.

List of inline elements

In addition to the inline elements listed under text formating above, classes may be assigned to abbr and acronym elements:

abbr, acronym, b, bdo, big, cite, code, del, dfn, em, i, ins, kbd, q, samp, small, span, strike, strong, sub, sup, tt, u, var

Labels in the text styling drop-down list

In the selectlist, both, the label and the class selector or class name may be shown:

label

class name - label

label - class name

Labels are always shown in the author's language regardless of the content's language.

The order is alphabetical.

Behavior of the text styling drop-down list

Only one of the classes is pre-selected in the Text Style selectlist and therefore shown in the collapsed selectlist. At all times, only classes allowed by the configuration settings are presented in the selectlist.

Legend:

highlighted (selected) string:This is the string inside the textarea the user has selected using the mouse or keyboard.

|= cursor position inside the textarea.

Case 1: No string is highlighted and the cursor is outside any inline element:
  1. the option shown in the collapsed selectlist is 'No text style';
  2. the selectlist is disabled.
Case 2: No string is highlighted and the cursor is inside an inline element:

Example: <code>wor \| d</code>

a) the option shown in the collapsed selectlist is the current value of the element's class attribute, or 'No text style' when the inline element bears no class attribute;

b) the selectlist is enabled and contains the classes allowed for the type of inline element;

c) if the author chooses a different class, the class attribute gets updated; the position of the cursor is unchanged;

d) if the author chooses 'No text style', the current class is removed; if the element has no more class, the class attribute gets removed; if the element is a span element and it has no more attribute, the span element is removed;the position of the cursor is unchanged.

Case 3: A string is highlighted and crosses multiple elements:
  1. the option shown in the collapsed selectlist is 'No text style';
  2. if the string crosses multiple block elements:

the selectlist is disabled;

  1. if the string crosses multiple inline elements:
  • the selectlist is enabled and contains the classes allowed for the 'span' element;
  • if the author chooses a class, the highlighted string is wrapped with a 'span' element with the chosen class as value of its class attribute;
  • the resulting marked up string is not highlighted;
  • the cursor is positioned at the end of the string.
Case 4: The highlighted string is not contained in any inline element:
  1. the option shown in the collapsed selectlist is 'No text style';

b) if the author chooses a class, the highlighted string is wrapped with a 'span' element with the chosen class as value of its class attribute;

  1. the resulting marked up string is not highlighted;
  2. the cursor is positioned at the end of the highlighted string.
Case 5: The highlighted string is contained in an inline element:
  1. the option shown in the collapsed selectlist is 'No text style';

b) if the author chooses a class, the highlighted string is wrapped with a 'span' element with the chosen class as value of its class attribute;

  1. the resulting marked up string is not highlighted;
  2. the cursor is positioned at the end of the highlighted string.
Case 6: The hightlighted string contains exactly the complete inline element:

Example of hightlighted string:<code>word</code>

a) the option shown in the collapsed selectlist is the current value of the element's class attribute, or 'No style' when the inline element bears no class attribute;

b) the selectlist is enabled and contains the classes allowed for the type of inline element;

c) if the author chooses a different class, the class attribute gets updated; the cursor is moved at the end of the highlighted string which gets de-highlighted;

d)if the author chooses 'No style', the current class is removed; if the element has no more class, the class attribute gets removed;if the element is a span element and it has no more attribute, the span element is removed; the cursor is moved at the end of the highlighted string which gets de-highlighted.

Using definition lists

Buttons

The following buttons are used:

a button allowing to create definition lists (dl);

a button allowing to toggle between term (dt) and definition (dd) elements;

indenting and outdenting of definition lists is done using the indent/outdent buttons or the TAB/SHIFT-TAB keys.

In the toolbar, the definition list and definition item buttons are usually placed right after the unordered list (ul) and the ordered list (ol) buttons.

Creating a definition list

Case 1: Nothing is highlighted, cursor is inside p or hx.

Example:

<p>Definition term|</p>

If dl-button is clicked, this becomes:

<dl>

<dt>Some Text|</dt>

</dl>

Case 2: Nothing is highlighted, cursor is inside a block element other than p or hx.

Example:

<div>Definition term|</div>

If dl-button is clicked, this becomes:

<div>

<dl>

<dt>Definition term|</dt>

</dl>

</div>

Case 3: Creating a dl from multiple highlighted paragraphs

Let us say, we have the following code highlighted:

<p>Definition term 1</p>

<p>Definition text 1</p>

<p>Definition term 2</p>

<p>Definition text 2</p>

Klicking the dl-button results in alternating dt/dd elements wrapped by dl :

<dl>

<dt>Definition term 1</dt>

<dd>Definition text 1</dd>

<dt>Definition term 2</dt>

<dd>Definition text 2|</dd>

</dl>

Case 4: Creating a dl from a highlighted combination of hx and p

<h4>headline 1</h4>

<p>paragraph 1.1</p>

<p>paragraph 1.2</p>

<h4>headline 2</h4>

<p>paragraph 2.1</p>

In this case

  • every hx would become dt, and
  • every p would become dd.

<dl>

<dt>headline 1</dt>

<dd>paragraph 1.1</dd>

<dd>paragraph 1.2</dd>

<dt>headline 2</dt>

<dd>paragraph 2.1|</dd>

</dl>

Creating and remapping dt/dd elements

Case 1: Behaviour of Enter key if the cursor is at the end of dt/dd
  • If the cursor is at the end of a dt -element and Enter is pressed, a new dd -Element will be created as next sibling.
  • If the cursor is at the end of a dd -element and Enter is pressed, a new dt -Element will be created as next sibling.
Case 2: Behaviour of Enter key if the cursor is at the beginning of dt/dd
  • If the cursor is at the beginning of a dt-Element and Enter is pressed, a new dt will be created as previous sibling.
  • If the cursor is at the beginning of a dd-Element and Enter is pressed, a new dd will be created.
Case 3: Remapping dd to dt

In order to remap the dt to dd , the cursor has to be somewhere inside a dt/dd. The remapping is done by clicking the dt/dd- toggle button.

Nesting definition lists (Indent/TAB)

While dt does not allow any blockelements inside, dd does, and you may also nest definition lists.

This is usefull if you have a term that has different definitions in different contexts. The nesting can be achieved using indent/outdent buttons as for the other list types.

Case 1: Indenting without any highlighted text

Let us say I want to talk about the Acronym PC in different context:

<dl>

<dt>PC</dt>

<dd>The Acronym has different meanings in different contexts:|</dd>

</dl>

Now I press indent, with the result that a new combination of dl+dt is created at my cursor position and my cursor is inside the newly created dt:

<dl>

<dt>PC</dt>

<dd>The Acronym has different meanings in different contexts:

<dl>

<dt>|</dt>

</dl>

</dd>

</dl>

Case 2: Indenting highlighted dt/dd elements

This case is divided into two subcases.

Subcase 2a: We have a dd as previous sibling of the hightlighted elements.

In this case the highlighted dt/dd elements should be wrapped with <dl> and should be placed inside the dd at cursor position. Example:

<dl>

<dt>PC</dt>

<dd>The Abbreviation has different meaning in different contexts:</dd>

<dt>Information technology</dt>

<dd>Personal Computer</dd>

<dt>Social sciences</dt>

<dd>Political correctness</dt>

<dt>Latin Grammar</dt>

<dd>Participium coniunctum</dd>

</dl>

Clicking indent results in:

<dl>

<dt>PC</dt>

<dd>The Abbreviation has different meaning in different contexts:

<dl>

<dt>Information technology</dt>

<dd>Personal Computer</dd>

<dt>Social sciences</dt>

<dd>Political correctness</dt>

<dt>Latin Grammar</dt>

<dd>Participium coniunctum|</dd>

</dl>

</dd>

</dl>

Subcase 2b: We have a dt as previous sibling of the highlighted dt/dd elements.

In this subcase the highlighted elements will be wrapped by dd+dl .

<dl>

<dt>PC</dt>

<dt>Information technology</dt>

<dd>Personal Computer</dd>

<dt>Social sciences</dt>

<dd>Political correctness</dt>

<dt>Latin Grammar</dt>

<dd>Participium coniunctum</dd>

</dl>

Clicking indent will result in:

<dl>

<dt>PC</dt>

<dd>

<dl>

<dt>Information technology</dt>

<dd>Personal Computer</dd>

<dt>Social sciences</dt>

<dd>Political correctness</dt>

<dt>Latin Grammar</dt>

<dd>Participium coniunctum|</dd>

</dl>

</dd>

</dl>

Case 3: Outdenting without any highlighting

After having said all about PC, I want to talk about RTE on the outer level and therefore do the following:

  • I press Enter to create a new dt and perhaps klick dt/dd-toggler.
  • I click outdent or press Shift+TAB to outdent the newly created dt.

As a result, my newly created dt/dd element is moved beneath the nested dl.

Example:

<dl>

<dt>PC</dt>

<dd>The Abbreviation has different meaning in different contexts:

<dl>

<dt>Information technology</dt>

<dd>Personal Computer</dd>

<dt>Social sciences</dt>

<dd>Political correctness</dt>

<dt>Latin Grammar</dt>

<dd>Participium coniunctum</dd>

<dt> | </dt>

</dl>

</dd>

</dl>

Clicking outdent in this situation will result in:

<dl>

<dt>PC</dt>

<dd>The Abbreviation has different meaning in different contexts:

<dl>

<dt>Information technology</dt>

<dd>Personal Computer</dd>

<dt>Social sciences</dt>

<dd>Political correctness</dt>

<dt>Latin Grammar</dt>

<dd>Participium coniunctum</dd>

</dl>

</dd>

<dt> | </dt>

</dl>

Case 4: Outdenting a highlighted group of dt/dd-elements

Outdenting of highlighted elements only works in a sensible way, if the highlighted elements are at the very end of an indented dl. If you want to move up or down elements at the beginning or in the middle, this can be achieved with cut and paste.

Example: Highlighted elements are at the end of a nested dl

<dl>

<dt>outer term 1</dtd>

<dd>outer data 1

<dl>

<dt>inner term 1</dt>

<dd>inner data 1</dd>

<dt>inner term 2</dt>

<dd>inner data 2</dd>

<dt>inner term 3</dt>

<dd>inner data 3</dd>

</dl>

</dd>

</dl>

Clicking outdent will place the selected elements below the next outer dd:

<dl>

<dt>outer term 1</dtd>

<dd>outer data 1

<dl>

<dt>inner term 1</dt>

<dd>inner data 1</dd>

<dt>inner term 2</dt>

<dd>inner data 2</dd>

</dl>

</dd>

<dt>inner term 3</dt>

<dd>inner data 3 | </dd>

</dl>

Marking language

Editing language marks

Case 1: The author highlights a part of a text node and selects a language

Highlighted area:

<p>Semantisches Markupmindert Barrieren.</p>

Result in markup with cursor position:

<p>Semantisches <span lang="en">Markup</span>|mindert Barrieren.</p>

Case 2: The author highlights the whole text node inside an inline element and selects a language
a) to add the lang attribute

Highlighted area:

<cite>New York Times</cite>

Result in markup with cursor position:

<cite lang="en">New York Times</cite>|

b) to change the value of the lang attribute

Highlighted area:

<cite lang="en">Le Monde</cite>

Result in markup with cursor position:

<cite lang="fr">Le Monde</cite>|

c) to delete the lang attribute (No language)

Highlighted area:

<cite lang="en">Die Zeit</cite>

Result in markup with cursor position:

<cite>Le Monde</cite>|

In case the inline element in question isa span thatdoes not have any other attributes, the span element will be removed.

Case 3: The author highlights a complete element node via the status bar and selects a language

Highlighted area:

<cite>New York Times</cite>

Result in markup with cursor position:

<cite lang="en">New York Times</cite>|

Case 4: Nothing is highlighted and the author selects a language
a) to add the lang attribute

Cursor position:

<p>Die <cite>New |York Times</cite> titelte ….</p>

The lang attribute is set in the direct parent element node.Result in markup with cursor position:

<p>Die <cite lang="en">New|York Times</cite> titelte ….</p>

b) to change the attribute value

Cursor position:

<p><cite lang="fr">New |York Times</cite> titelte ….</p>

Result in markup with cursor position:The value of the lang attribute of the direct parent element node is changed.

<p><cite lang="en">New |York Times</cite> titelte ….</p>

c) to remove the lang attribute

Cursor position:

<p><cite lang="fr">Die |Zeit</cite> titelte ….</p>

Result in markup with cursor position:The lang attribute gets removed.

<p><cite>Die |Zeit</cite> titelte ….</p>

In case of a span element that has no other attributes the span element will be removed.

Case 5: Nothing is highlighted, the cursor is directly inside a block element and the author selects a language

<p>Beware |the dog!</p>

The lang attribute is set for the parent element:

<p lang="en">Beware|the dog!</p>

Case 6: The author selects a block element via the status bar
a) to add the lang attribute

Highlighted block:

<blockquote><p>Did you ever experience a <span lang="fr">dejà vu</span> effect?</p></blockquote>

Resulting markup with cursor position:

<blockquote lang="en"><p>Have you ever had a <span lang="fr">dejà vu</span> effect.</p></blockquote>|

b) to change the value of the lang attribute

Highlighted block:

<blockquote lang="en"><p>Hattest du jemals einen <span lang="fr">dejà vu</span>-Effekt?</p></blockquote>

Resulting markup with cursor position:

<blockquote lang="de"><p>Hattest du je einen <span lang="fr">dejà vu</span>-Effekt.</p></blockquote>|

c) to remove the lang attribute

Highlighted block:

<blockquote lang="de"><p>Hattest du jemals einen <span lang="fr">dejà vu</span>-Effekt?</p></blockquote>

Resulting markup with cursor position:

<blockquote><p>Hattest du je einen <span lang="fr">dejà vu</span>-Effekt.</p></blockquote>|

Case 7: The author highlights multiple block elements and selects a language

<p>Rats!</p>

<p>They fought the dogs and killed the cats,</p>

<p>And bit the babies in the cradles,</p>

<p>And ate the cheeses out of the vats,</p>

<p>And licked the soup from the cooks' ownladles,</p>

Resulting markup with cursor position:

<p lang="en" >Rats!</p>

<p lang="en" >They fought the dogs and killed the cats,</p>

<p lang="en" >And bit the babies in the cradles,</p>

<p lang="en" >And ate the cheeses out of the vats,</p>

<p lang="en" >And licked the soup from the cooks' own |ladles,</p>

Using hotkeys

Hoykeys maybe be configured for most buttons in Page TSConfig. The following hotkeys are defined by default, but may be reconfigured:

ctrl+l : Justify Left (if the corresponding button is configured in the toolbar of the RTE)

ctrl+e : Justify Center (if the corresponding button is configured in the toolbar of the RTE)

ctrl+r : Justify Right (if the corresponding button is configured in the toolbar of the RTE)

ctrl+j : Justify Full (if the corresponding button is configured in the toolbar of the RTE)

ctrl+n : Format block as Paragraph (if the corresponding select box is configured in the toolbar of the RTE)

ctrl+1 : Format block as Heading 1 (if the corresponding select box is configured in the toolbar of the RTE)

ctrl+2 : Format block as Heading 2 (if the corresponding select box is configured in the toolbar of the RTE)

ctrl+3 : Format block as Heading 3 (if the corresponding select box is configured in the toolbar of the RTE)

ctrl+4 : Format block as Heading 4 (if the corresponding select box is configured in the toolbar of the RTE)

ctrl+5 : Format block as Heading 5 (if the corresponding select box is configured in the toolbar of the RTE)

ctrl+6 : Format block as Heading 6 (if the corresponding select box is configured in the toolbar of the RTE)

The following hotkeys are predefined and reserved:

ctrl+a : Select all

ctrl+z : Undo (if the corresponding button is configured in the toolbar of the RTE)

ctrl+y : Redo (if the corresponding button is configured in the toolbar of the RTE)

ctrl+x : Cut

ctrl+c : Copy

ctrl+v : Paste

ctrl+0 : Clean Word

ctrl+space: Insert a non-breaking space

Using the Enter key inserts a paragraph (<p>, <hx> or <pre>). Using shift-Enter will insert a line break (<br />).

FAQ: How do I delete a table?

You may proceed as follows:

  • click in any cell in the table;
  • in the editor status bar, displayed at the bottom of the editor frame, click on “table”;
  • press the “Delete” key or the “Backspace” key.

You may also proceed as follows:

  • click in any cell in the table;
  • click on the right button of the mouse or pointing device;
  • the context menu is displayed;
  • at the bottom of the context menu, you have the option to delete the TABLE element.

In Internet Explorer, you may also proceed as follows:

  • put the cursor just after the table and press the “Backspace” key;
  • or click on the border of the table and press the “Delete” key.

FAQ: How do I configure the editor to use my CSS styles?

The following style sheets apply to the contents of the editing area and are linked in the following order:

the htmlarea-edited-content.css file from the skin in use; it contains selectors for use in the editor, but not intended to be applied in the frontend;

the css file specified by property contentCSS in Page TSConfig: you may define the styles you want to use in an external CSS file and assign the file name to this property.

FAQ: How can I use a Bengali Open Type font in the editor?

Since Bengali is not well supported by all browsers, the recommended approach would be to add the Bengali font in the list of font families specified on the body selector of the RTE.default.contentCSS stylesheet. For example:

body { font-family: Verdana, sans-serif, Likhan; }

For some reason, with some fonts, the lines may overlap when using larger font sizes. It is the case with the Bengali Likhan font in Firefox 1.0.2. This may also be corrected through the stylesheet. For example:

body { font-family: Verdana, sans-serif, Likhan; line-height: 1.4; }

Note that, when using the Bengali Likhan font, a line-height with em or % unit may not produce any effect in Firefox 1.0.2.

FAQ: How do I configure the RTE to keep my custom tag?

Add the following lines to your Page TSConfig:

RTE.default.proc.allowTags = list-of-allowed-tags
RTE.default.proc.HTMLparser_rte.tags.mycustomtag.protect =1

where

list-of-allowed-tags is the list of all allowed tags, including your custom tag, and

mycustomtag is the name of your tag.

FAQ: Why is the class attribute on table tags always rendered as contenttable in the front end?

«Typo3 always replaces the class I selected in the RTE for a table with the class "contenttable". Do you have an idea how to switch that off?»

Assuming that you have installed extension CSS Styled Content (css_styled_content), add the following line in your TS template Setup field:

lib.parseFunc_RTE.externalBlocks.table.stdWrap.HTMLparser.tags.table.fixAttrib.class.list >

The contenttable class will then be added only if no class is specified for the table.

FAQ: Why are abbr and acronym tags not correctly rendered in the front end?

Make sure that abbr and acronym are included in the list:

styles.content.links.allowTags

in your TS template constants.

FAQ: Why are popup windows too small when they open?

We have tried to make sure that all popup windows open with usable dimensions. Since the contents of the windows may be variable and may be localized, it is difficult to ensure that all windows will open with the correct size in all languages. Therefore, the editor will try to adjust the width and height of the windows to their specific contents and to center the windows on the screen.

In some OS/browser configurations, the editor may be prevented from resizing and moving the windows due to lack of privileges:

  • If you use a Firefox browser, select through the browser menu Tools -> Options -> Web Characteristics -> Javascript -> Advanced, and check the options that allows scripts to Hide the status bar and that allow scripts to resize and move windows. Popup windows should then open with the correct size.
  • If you use IE6 on Windows XP SP2, select through the browser menu Tools -> Internet Options -> Security -> Trusted Sites, and add the url of TYPO3 site to the list of trusted sites. Popup windows should then open with the correct size.

FAQ: Why is the editor not displayed with full width when I use the full window wizard?

If you are editing the most usual content element, that is the bodytext column of tt_content table, try to add the following line to your Page TSConfig:

TCEFORM.tt_content.bodytext.RTEfullScreenWidth= 100%

Note that this setting is now included in the default configuration of the extension.

If editing some other column, use the same model:

TCEFORM.my_table_name.my_column_name.RTEfullScreenWidth= 100%

FAQ: Why do style selector boxes remain disabled in IE?

When using IE, make sure that the browser cache setting is set to Automatic.

FAQ: Why can't I get all buttons to be displayed?

User TSConfig restricts the user to a specified set of buttons; therefore, for access to all buttons without restriction, in User TSConfig, set: options.RTEkeyList = *

Page TSConfig adds the buttons required to edit the table and field you wish to edit; therefore, to add all buttons by default, in Page TSConfig, set RTE.default.showButtons = *

If you are trying to edit the bodytext field of a content element from table tt_content, then the TCA field types and palettes may specify a list of buttons to add; this specification takes precedence over RTE.default.showButtons; to override any such setting in TCA for the bodytext field of table tt_content, in Page TSConfig, set RTE.config.tt_content.bodytext.showButtons = *

If you are trying to edit a text field from another table, then, in Page TSConfig, set RTE.config.tableName.columnName.showButtons = *

Buttons textcolor, bgcolor, fontstyle and fontsize are enabled only if «Enable features that use the style attribute> is checked in the extension manager.

If extension static_info_tables is not installed, the spellcheck, language and acronym buttons are not enabled.

If the encoding of the content element is not either iso-8859-1 or utf-8, the spellcheck button is not enabled.

Buttons user and acronym are never available in the front end.

Button unlink is not available if button link is not available.

None of the table operations buttons are available is the button table is not available.

Safari does not support the paste button.

Opera does not support the copy, cut and paste buttons.

FAQ: Why does it take so long to load the editor in Internet Explorer?

Try to adjust your IE browser cache settings:

From the IE main menu, navigate to: Tools -> Internet Options -> General -> button: Configure... or in some other IE versions: Extras -> Internet Options : Temporary Files -> button: Advanced

Select the radio button Automatic.

Some server configuration settings may also help working around Internet Explorer caching problems. See the Server Configuration section and the Tutorial section of this document.

Configuration

Installing the RTE

The extension is a system extension and is installed by default when TYPO3 is installed.

Use the Extension Manager to un-install/re-install the extension.

The extension may be installed as a system, global or local extension.

You may be requested to uninstall the following extension: rte_conf.

If you plan to use the spell checking feature, you should install extension Static Info Tables (static_info_tables). The spell checker feature requires GNU Aspell 0.60+ to be installed on the server.

Custom elements presented by the User Elements feature may be maintained with extension Custom Tags (extension key: de_custom_tags).

Note that the installation dialog will request to create table tx_rtehtmlarea_acronym; this table is used by theAcronym feature.

Upon installation directory uploads/tx_rtehtmlarea will be created. Personal dictionaries are stored in subdirectories of this directory.

Upon installation, if RTE has not yet been enabled with the TYPO3 Install tool, it will be automatically enabled:

$TYPO3_CONF_VARS['BE']['RTEenabled'] = 1;

Extension configuration variables

The Extension Manager installation dialog allows to set the following extension configuration variables:

  • Default configuration settings: let you choose a set of default Page TSConfig and User TSConfig settings; select Typical (Most commonly used features are enabled. Select this option if you are unsure which one to use.) for the typical site requirements; select Minimal (Most features disabled. Administrator needs to enable them using TypoScript. For advanced administrators only.) for minimal settings; select Demo (Show-off configuration. Includes pre- configured styles. Not for production environments.) to explore some of the available features; default value is Typical;
  • Enable images in the RTE : if this boolean variable is set, the use of images in the “Minimal” or the "Typical" default configuration of the RTE will be enabled; default value is 0;
  • Enable additional inline elements: If set, the potential use of additional inline elements will be enabled; default value is 0;
  • Enable features that use the style attribute : If set, the potential use of features that use the style attribute (color, fontstyle, fontsize) will be enabled; default value is 1;
  • Enable links accessibility icons : if this boolean variable is set, accessibility icons may be added to links; default value is 0; see Page TSConfig property RTE.classesAnchor;
  • Enable compressed scripts: if this boolean variable is set, editor scripts are compressed; default value is 1.

If the SpellChecker is not enabled, then the remaining configuration variables are irrelevant; note that if extension static_info_tables is not installed, SpellCheker will not be enabled.

  • No spell checking languages : the list of languages for which Aspell does not provide spell checking (see Unsupported Languages ) and for which the Spell Checker feature will therefore be disabled (not shown in the RTE tool bar); default value is 'ja, km, ko, lo, th, zh, b5, gb';
  • Aspell directory: the server directory in which Aspell is installed; default value is “/usr/bin/aspell”;

Force Aspell command mode: if this boolean variable is set,the Aspell command interface will be used; this may be useful when PHP is compiled with pspell, but with an old version of Aspell, and a newer version is available in another directory; default value is 0.

User TSConfig

Upon installation, the extension will set default properties in User TSConfig as specified by the extension configuration variable: Default configuration settings . Three default configurations are available: Minimal, Typical, and Demo. These default configurations are documented in the next section of the present document.

These properties may be modified for any particular BE user or BE user group, with the Typo3 User Admin Tool. Properties of User TSConfig are documented in this document: http://typo3.org/documentation/document- library/doc_core_tsconfig/User_TSconfig/

setup.default.edit_RTE

Property

setup.default.edit_RTE

Data type

boolean

Description

Specifies that RTE editing should be enabled or disabled by default.

setup.override.edit_RTE

Property

setup.override.edit_RTE

Data type

boolean

Description

Specifies that RTE editing should be enabled or disabled, the user not being allowed to change the setting.

setup.default.rteWidth

Property

setup.default.rteWidth

Data type

int+/%

Description

If set, specifies the default width of the RTE editing area. The specified value overrides the calculated width of the RTE editing area. Note that a percentage may be specified.

Note: The property is ignored in IE if the value is a percentage.

setup.override.rteWidth

Property

setup.override.rteWidth

Data type

int+/%

Description

If set, specifies the width of the RTE editing area, the user not being allowed to change the setting. The specified value overrides the calculated width of the RTE editing area. Note that a percentage may be specified.

Note: The property is ignored in IE if the value is a percentage.

setup.default.rteHeight

Property

setup.default.rteHeight

Data type

int+

Description

If set, specifies the default height of the RTE editing area. The specified value overrides the calculated height of the RTE editing area. This includes the height of the toolbar, of the editing area and of the status bar.

setup.override.rteHeight

Property

setup.override.rteHeight

Data type

int+

Description

If set, specifies the height of the RTE editing area, the user not being allowed to change the setting. The specified value overrides the calculated height of the RTE editing area. This includes the height of the toolbar, of the editing area and of the status bar.

setup.default.rteResize

Property

setup.default.rteResize

Data type

boolean

Description

Specifies whether or not the RTE is resizable by default.

setup.override.rteResize

Property

setup.override.rteResize

Data type

boolean

Description

Specifies whether or not the RTE is resizable, the user not being allowed to change the setting.

setup.default.rteMaxHeight

Property

setup.default.rteMaxHeight

Data type

int+

Description

If set, and if the RTE is resizable, specifies the default maximal height of the RTE, including the tool bar, the editing area and the status bar.

setup.override.rteMaxHeight

Property

setup.override.rteMaxHeight

Data type

int+

Description

If set, and if the RTE is resizable, specifies the default maximal height of the RTE, including the tool bar, the editing area and the status bar, the user not being allowed to change the setting.

setup.default.rteCleanPasteBehaviour

Property

setup.default.rteCleanPasteBehaviour

Data type

string

Description

If set, specifies the default clean paste behaviour when the pastetoggle button is ON.

Possible values are: plainText, pasteStructure, pasteFormat.

setup.override.rteCleanPasteBehaviour

Property

setup.override.rteCleanPasteBehaviour

Data type

string

Description

If set, specifies the clean paste behaviour when the pastetoggle button is ON, the user not being allowed to change the setting

Possible values are: plainText, pasteStructure, pasteFormat.

options.RTEkeyList

Property

options.RTEkeyList

Data type

list of id-strings

Description

Specifies the list of RTE buttons to which the BE user or BE user group is restricted.

Default: * (means all)

Note: For the list of possible buttons, see property showButtons of Page TsConfig.

options.HTMLAreaPspellMode

Property

options.HTMLAreaPspellMode

Data type

string

Description

Specifies the mode of spelling suggestions. Possible values are: ultra, fast, normal or bad-spellers.

Default: normal

Note: For more information on spelling suggestions modes, see Notes on the Different Suggestion Modes ).

options.enablePersonalDicts

Property

options.enablePersonalDicts

Data type

boolean

Description

Enables the personal dictionaries feature for the user or user group, when the feature is enabled in Page TSConfig.

Default: 0

Note: The feature must also be enabled in Page TSConfig.

options.uploadFieldsInTopOfEB

Property

options.uploadFieldsInTopOfEB

Data type

boolean

Description

Inserts a file uploader on the 'file' tab of the Insert/Modify link dialogue as well as on the magic, plain and dragdrop tabs of the Insert/modify image dialogue.

Note: This applies only when buttons.link.TYPO3Browser.disabled and/or buttons.image.TYPO3Browser.disabled is not set.

Default: 0

options.createFoldersInEB

Property

options.createFoldersInEB

Data type

boolean

Description

If set, a create folders option appears in the TYPO3 file browser.

Note: This applies only when buttons.link.TYPO3Browser.disabled and/or buttons.image.TYPO3Browser.disabled is not set.

Note: For admin-users this is always enabled.

Default: 0

options.noThumbsInRTEimageSelect

Property

options.noThumbsInRTEimageSelect

Data type

boolean

Description

If set, then image thumbnails are not shown in the image selector.

Default: 0

options.RTESmallWidth

Property

options.RTESmallWidth

options.RTESmallHeight

Data type

pixels

Description

Width and height of the editor area when edit_wideDocument is NOT set.

Default: RTESmallWidth = 530, RTESmallHeight = 380

options.RTELargeWidthIncrement

Property

options.RTELargeWidthIncrement

options.RTELargeHeightIncrement

Data type

pixels

Description

Increments applied to the width and height of the editor area when edit_wideDocument IS set.

Default: RTELargeWidthIncrement= 150, RTELargeHeilghtIncrement = 0

page.RTE.default.buttons.formatblock.restrictToItems

Property

page.RTE.default.buttons.formatblock.restrictToItems

Data type

list of id-strings

Description

List of options to which the user will be restricted in the block formating drop-down list.

The available options are: p, h1, h2, h3, h4, h5, h6, pre, address, article, aside, blockquote, div, footer, header, nav, section

page.RTE.default.buttons.formattext.restrictTo

Property

page.RTE.default.buttons.formattext.restrictTo

Data type

list of id-strings

Description

Restricts the availability of options, or inline element types, in the text formating drop-down list.

Default: * (means all)

Page TSConfig

Upon installation, the extension will set default properties in Page TSConfig as specified by the extension configuration variable: Default configuration settings . Three default configurations are available: Minimal, Typical, and Demo. These default configurations are documented in the next section of the present document.

These properties may be modified in the PageTS Config of your page; this is most often done on the root page of your site.

((generated))

classes:

Properties of each class available in the RTE.

classes.[ classname ]

Property

classes.[ classname ]

Description

Defines the classes available in the RTE. classname is the actual name of the style-class you are configuring. Notice you must specifically assign the classes to the various facilities also. See later.

Properties:

.name = label of the class (may be a reference to an entry in a localization file of the form LLL:EXT:[fileref]:[labelkey])
.value = the style for the class
.noShow = boolean; if set, the style of the class is not used to render it in the pop-up selector.

# specification of alternating classes for rows and/or columns of a table
.alternating {
    rows {
        startAt = int+ (default = 1)
        oddClass = class-name
        evenClass = class-name
        oddHeaderClass = class-name
        evenHeaderClass = class-name
    }
    columns {
        startAt = int+ (default = 1)
        oddClass = class-name
        evenClass = class-name
        oddHeaderClass = class-name
        evenHeaderClass = class-name
    }
}

# specification of counting classes for rows and/or columns of a table
.counting {
        rows {
                startAt = int (default = 1)
                rowClass = class-name (should not be a substring of other class names)
                rowLastClass = class-name
                rowHeaderClass = class-name (should not be a substring of other class names)
                rowHeaderLastClass = class-name
        }
        columns {
                startAt = int (default = 1)
                columnClass = class-name(should not be a substring of other class names)
                columnLastClass = class-name
                columnHeaderClass = class-name(should not be a substring of other class names)
                columnHeaderLastClass = class-name
        }
}
((Unknown Property))

Property

Description

Example:

# Hidding an allowed class in the class selector dropped downlist
RTE.classes.class-name.value = display: none;

Example:

# Configuration of an alternating and counting class
RTE.classes.countingtable {
        name = Counting class
        alternating {
                rows {
                        startAt = 1
                        oddClass = tr-odd
                        evenClass = tr-even
                        oddHeaderClass = thead-odd
                        evenHeaderClass = thead-even
                }
                columns {
                        startAt = 1
                        oddClass = td-odd
                        evenClass = td-even
                        oddHeaderClass = th-odd
                        evenHeaderClass = th-even
                }
        }
        counting {
                rows {
                        startAt = 1
                        rowClass = tr-count-
                        rowLastClass = tr-last
                        rowHeaderClass = thead-count-
                        rowHeaderLastClass = thead-last
                }
                columns {
                        startAt = 1
                        columnClass = td-count-
                        columnLastClass = td-last
                        columnHeaderClass = th-count-
                        columnHeaderLastClass = th-last
                }
        }
}

Example:

# Hidding an allowed counting class in the class selector dropped downlist
# Note the ending hyphen « - »
# The class name string should be as specified in the counting property
RTE.classes.counting-class-name-.value = display: none;

[page:RTE]

mutuallyExclusiveClasses:

Lists of mutually exclusive or incompatible classes.

mutuallyExclusiveClasses.[ label ]

Property

mutuallyExclusiveClasses.[ label ]

Data type

list of id-strings

Description

Defines a set of classes that are mutually exclusive An element may have only one of the listed classes assigned to it at any given time.

[page:RTE]

colors:

Properties of each color available in the RTE.

colors.[ id-string ]

Property

colors.[ id-string ]

Description

Defines the colors available in the RTE.

Properties:

.name = Label of the color in menu
.value = The HTML-color value

Example:

# General configuration of the available colors:
RTE.colors {
  color1 {
    name = Background color
    value = blue
  }
  color2 {
    name = Another color I like!
    value = #775533
  }
  noColor {
    name = No color
    value =
  }
}
# Specific setting for the font color selector:
RTE.default.colors = color1, color2, noColor

[page:RTE]

fonts:

Properties of each font available in the RTE.

fonts.[ id-string ]

Property

fonts.[ id-string ]

Description

Defines the fonts available in the RTE.

Properties:

.name = Label of the font in menu (may be a reference to an entry in a localization file of the form LLL:EXT:[fileref]:[labelkey])
.value = The font face value (comma-separated list of font-family names; if a font-family name contains spaces, it should be quoted with single quotes)

Example:

# General configuration of the available fonts:
RTE.fonts {
  face1 {
    name = Verdana
    value = verdana, arial
  }
  face2 {
    name = Comic Sans
    value = 'Comic Sans MS'
  }
  noFace {
    name = No font
    value =
  }
}
# Specific setting for the fontstyle selector:
RTE.default.buttons.fontstyle.addItems = face2 , face1, noFace

[page:RTE]

fontSizes:

Properties of each font size available in the RTE.

fontSizes.[ id-string ]

Property

fontSizes.[ id-string ]

Description

Defines the font sizes available in the RTE.

Properties:

.name = Label of the font size in menu (may be a reference to an entry in a localization file of the form LLL:EXT:[fileref]:[labelkey])
.value = The font size value

Example:

# General configuration of the available font sizes:
RTE.fontSizes {
  size1 {
    name = Large
    value = 16px
  }
  size2 {
    name = Small
    value = 8px
  }
}
# Specific setting for the fontsyze selector:
RTE.default.buttons.fontsize.addItems = size1, size2

[page:RTE]

RTE interface configuration objects:

These objects contain the actual configuration of the RTE interface.

default.[...]

Property

default.[...]

config.[ tablename ].[ field ].[...]

config.[ tablename ].[ field ].types.[ type ].[...]

Description

These objects contain the actual configuration of the RTE interface. For the properties available, refer to the table below.This is a description of how you can customize in general and override for specific fields/types.

'RTE.default' configures the RTE for all tables/fields/types

'RTE.config.[ tablename ].[ field ]' configures a specific field. The values inherit the values from 'RTE.default' in fact this is overriding values.

'RTE.config.[ tablename ].[ field ].types.[ type ]' configures a specific field in case the 'type'-value of the field matches type . Again this overrides the former settings.

[page:RTE]

RTE interface configuration properties:

These properties may be set for each RTE interface configuration object.

disabled

Property

disabled

Data type

boolean

Description

If set, the editor is disabled.

showButtons

Property

showButtons

Data type

list of id-strings

Description

List of buttons that should be enabled in the editor toolbar.

Note: showButtons = * shows all available buttons.

Available buttons are: blockstylelabel, blockstyle, textstylelabel, textstyle, fontstyle, fontsize, formatblock, blockquote, insertparagraphbefore, insertparagraphafter, lefttoright, righttoleft, language, showlanguagemarks, left, center, right, justifyfull, orderedlist, unorderedlist, definitionlist, definitionitem, outdent, indent, formattext, bidioverride, big, bold, citation, code, definition, deletedtext, emphasis, insertedtext, italic, keyboard, monospaced, quotation, sample, small, span, strikethrough, strong, subscript, superscript, underline, variable, textcolor, bgcolor, textindicator, editelement, showmicrodata, emoticon, insertcharacter, insertsofthyphen, line, link, unlink, image, table, user, acronym, findreplace, spellcheck, chMode, inserttag, removeformat, copy, cut, paste, pastetoggle, pastebehaviour, undo, redo, about, toggleborders, tableproperties, tablerestyle, rowproperties, rowinsertabove, rowinsertunder, rowdelete, rowsplit, columnproperties, columninsertbefore, columninsertafter, columndelete, columnsplit, cellproperties, cellinsertbefore, cellinsertafter, celldelete, cellsplit, cellmerge

Note: Buttons textcolor, bgcolor, fontstyle and fontsize are enabled only if «Enable features that use the style attribute> is checked in the extension manager.

Note: If extension static_info_tables is not installed, the spellcheck, language and acronym buttons are not enabled.

Note: If the encoding of the content element is not either iso-8859-1 or utf-8, the spellcheck button is not enabled.

Note: Buttons user and acronym are never available in the front end.

Note: Button unlink is not available if button link is not available.

Note: None of the table operations buttons is available if the button table is not available.

Note: Opera, Safari 5+ and Chrome 6+ do not support the copy, cut and paste buttons.

hideButtons

Property

hideButtons

Data type

list of id-strings

Description

List of buttons that should not be enabled in the editor toolbar.

toolbarOrder

Property

toolbarOrder

Data type

list of id-strings

Description

Specifies the order and grouping of buttons in the RTE tool bar. The keywords space, bar and linebreak may be used to insert a space, a separator or a line break at the corresponding position in the tool bar.

Default: blockstylelabel, blockstyle, space, textstylelabel, textstyle, linebreak,

bar, formattext, bold, strong, italic, emphasis, big, small, insertedtext, deletedtext, citation, code, definition, keyboard, monospaced, quotation, sample, variable, bidioverride, strikethrough, subscript, superscript, underline, span, bar, fontstyle, space, fontsize, bar, formatblock, blockquote, insertparagraphbefore, insertparagraphafter, bar, lefttoright, righttoleft, language, showlanguagemarks, bar, left, center, right, justifyfull, bar, orderedlist, unorderedlist, definitionlist, definitionitem, outdent, indent, bar, textcolor, bgcolor, textindicator, bar, editelement, showmicrodata, emoticon, insertcharacter, insertsofthyphen, line, link, unlink, image, table, user, acronym, bar, findreplace, spellcheck, bar, chMode, inserttag, removeformat, bar, copy, cut, paste, pastetoggle, pastebehaviour, bar, undo, redo, bar, about, linebreak, toggleborders, bar, tableproperties, tablerestyle, bar, rowproperties, rowinsertabove, rowinsertunder, rowdelete, rowsplit, bar, columnproperties, columninsertbefore, columninsertafter, columndelete, columnsplit, bar, cellproperties, cellinsertbefore, cellinsertafter, celldelete, cellsplit, cellmerge

keepButtonGroupTogether

Property

keepButtonGroupTogether

Data type

boolean

Description

Specifies that all buttons of a button group are displayed on the same line of the tool bar. A button group is delimited by a linebreak or by a bar.

Default: 0

Note: If enabled, the setting is honored only by Mozilla/Firefox and Safari. It is ignored when the browser is Internet Explorer, Opera or Mozilla 1.3.

defaultContentLanguage

Property

defaultContentLanguage

Data type

string

Description

ISO code of default language of content elements. This language is used by RTE features that insert content, usually in the form of values of html tag attributes, when the language of the content element is not specified. This property applies to TYPO3 BE only.

Default: en

Note: Any value other than 'en' requires Static Info Tables to be installed.

disableContextMenu

Property

disableContextMenu

DEPRECATED

Data type

boolean

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use contextMenu.disable instead.

disableRightClick

Property

disableRightClick

DEPRECATED

Data type

boolean

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use contextMenu.disable instead.

contextMenu.disabled

Property

contextMenu.disabled

Data type

boolean

Description

If set, the context menu of the RTE triggered by mouse right click is disabled.

Default: 0

Note: Context menu is not available in Opera.

contextMenu.showButtons

Property

contextMenu.showButtons

Data type

list of id-strings

Description

List of buttons that should be shown in the context menu For the list of available buttons see property showButtons above.

Default: If not specified, all buttons available in the editor toolbar will appear in the context menu, unless they are removed by property contextMenu.hideButtons.

Note: Drop-down lists or select boxes will not be shown in the context menu.

Note: The buttons must be enabled in the editor toolbar.

Note: The buttons will appear in the same order as in the editor toolbar (see property toolbarOrderabove).

contextmenu.hideButtons

Property

contextmenu.hideButtons

Data type

list of id-strings

Description

List of buttons that should not be shown in the context menu.

contextMenu.maxHeight

Property

contextMenu.maxHeight

Data type

int+

Description

Maximum height of the context menu in pixels.

Default: 300

showStatusBar

Property

showStatusBar

Data type

boolean

Description

Specifies that the editor status bar should be displayed or not.

Default: 0

Note: showStatusBar is set to 1 in the Typical and Demo default configurations (see chapter on default configurations).

buttons.editelement.removeFieldsets

Property

buttons.editelement.removeFieldsets

Data type

list of id-strings

Description

List of fieldsets to remove from the edit element dialogue.

Possible string values are: identification, style, language, microdata, events.

buttons.editelement.properties.removed

Property

buttons.editelement.properties.removed

Data type

list of id-strings

Description

List of fields to remove from the edit element dialogue.

Possible string values are: id, title, language, direction, onkeydown, onkeypress, onkeyup, onclick, ondblclick, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup.

buttons.formatblock.orderItems

Property

buttons.formatblock.orderItems

Data type

list of id-strings

Description

Specifies the order in which the block element types are presented in the block formating drop-down list.

The standard block element types are: p, h1, h2, h3, h4, h5, h6, pre, address, article, aside, blockquote, div, footer, header, nav, section

The list may also contain custom items as specified by the buttons.formatblock.addItems property.

If not set, the default order will be alphabetical, in the language of the current backend user.

Note: If set, any option not in the list will be removed from the drop-down list.

buttons.formatblock.removeItems

Property

buttons.formatblock.removeItems

Data type

list of id-strings

Description

List of default items to be removed from the block formating drop-down list.

The default items are: p, h1, h2, h3, h4, h5, h6, pre, address, article, aside, blockquote, div, footer, header, nav, section

buttons.formatblock.addItems

Property

buttons.formatblock.addItems

Data type

list of id-strings

Description

List of custom items to be added to the block formating drop-down list.

Each of the added items should be configured.

hidePStyleItems

Property

hidePStyleItems

DEPRECATED

Data type

list of id-strings

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use buttons.formatblock.removeItems instead.

buttons.formatblock.items.[ item-name ].label

Property

buttons.formatblock.items.[ item-name ].label

Data type

string

Description

Alternative label for the option identified by the item name in the block formating drop-down list.

Note: The string may be a reference to an entry in a localization file of the form LLL:EXT:[ fileref ]:[ labelkey ]

buttons.formatblock.items.[ item-name ].addClass

Property

buttons.formatblock.items.[ item-name ].addClass

Data type

string

Description

A class name to be assigned to the blocks whenever the item is applied to selected text.

Note: The specified class should be allowed on elements of the block type (using property RTE.default.buttons.blockstyle.tags.[ tagName ].allowedClasses).

buttons.formatblock.items.[ item-name ].tagName

Property

buttons.formatblock.items.[ item-name ].tagName

Data type

string

Description

A tag name to be assigned to the block elements whenever the (custom) item is applied to selected text.

The value of this property must be equal to one of the standard block element types.

Note: [ item-name ] must not be a standard block tag name.

Note: If [ item-name ] also has property addClass, then the specified class should be allowed on elements of block type tagName (using property RTE.default.buttons.blockstyle.tags.[ tagName ].allowedClasses).

buttons.formatblock.prefixLabelWithTag

Property

buttons.formatblock.prefixLabelWithTag

Data type

boolean

Description

If set, the option label in the block formating drop-down list is prefixed with the tagname.

Default: 0

buttons.formatblock.postfixLabelWithTag

Property

buttons.formatblock.postfixLabelWithTag

Data type

boolean

Description

If set, the option label in the block formating drop-down list is postfixed with the tagname.

Default: 0

buttons.formatblock.items.[ item-name ].hotKey

Property

buttons.formatblock.items.[ item-name ].hotKey

Data type

character

Description

A hotkey will be associated with the option of the block formating drop-down list identified by the item name.

buttons.indent.useClass

Property

buttons.indent.useClass

Data type

string

Description

Class name to be used when indenting by means of div sections with class attribute.

Default: indent

buttons.indent.useBlockquote

Property

buttons.indent.useBlockquote

Data type

boolean

Description

If set, indentation will be produced by means of blockquote tags instead of div sections with class attribute.

Default: 0

buttons.left.useClass

Property

buttons.left.useClass

Data type

string

Description

Class name to be used when aligning blocks of text to the left by means of class attribute.

Default: align-left

Note: This property is also used for text aligment in table operations.

buttons.center.useClass

Property

buttons.center.useClass

Data type

string

Description

Class name to be used when centering blocks of text by means of class attribute.

Default: align-center

Note: This property is also used for text aligment in table operations.

buttons.right.useClass

Property

buttons.right.useClass

Data type

string

Description

Class name to be used when aligning blocks of text to the right by means of class attribute.

Default: align-right

Note: This property is also used for text aligment in table operations.

buttons.justifyfull.useClass

Property

buttons.justifyfull.useClass

Data type

string

Description

Class name to be used when justifying blocks of text to both left and right by means of class attribute.

Default: align-justify

Note: This property is also used for text aligment in table operations.

buttons.left.useAlignAttribute

Property

buttons.left.useAlignAttribute

buttons.center.useAlignAttribute

buttons.right.useAlignAttribute

buttons.justifyfull.useAlignAttribute

Data type

boolean

Description

If anyone of these four properties is set, alignment will be produced by means of align attributes instead of class attributes.

Default: 0

buttons.blockstyle.tags.[ tag-name ].allowedClasses

Property

buttons.blockstyle.tags.[ tag-name ].allowedClasses

Data type

list of id-strings

Description

Specifies the classes allowed for the block element identified by the tag name. Any string in the list may contain wild card characters. The wild card character is “*” and stands for any sequence of characters.

The classes must also be defined, using the specific tag selector, in the CSS file specified by the contentCSS property.

If the property is empty for any tag, classes associated with the given tag in the contentCSS file are used.

The classes are presented in the drop-down list in alphabetical order in the language used by the backend user.

buttons.blockstyle.tags.all.allowedClasses

Property

buttons.blockstyle.tags.all.allowedClasses

Data type

list of id-strings

Description

Specifies the classes allowed for all block elements, in addition to the classes allowed for each specific element (see above).

The classes must also be defined, without any tag selector, in the CSS file specified contentCSS property.

The classes are presented in the drop-down list in alphabetical order in the language used by the backend user.

classesParagraph

Property

classesParagraph

DEPRECATED

Data type

list of id-strings

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use buttons.blockstyle.tags.div.allowedClasses instead.

classesTable

Property

classesTable

DEPRECATED

Data type

list of id-strings

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use buttons.blockstyle.tags.table.allowedClasses instead.

classesTD

Property

classesTD

DEPRECATED

Data type

list of id-strings

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use buttons.blockstyle.tags.td.allowedClasses instead.

buttons.blockstyle.showTagFreeClasses

Property

buttons.blockstyle.showTagFreeClasses

Data type

boolean

Description

Specifies that classes not associated with any tag in the contentCSS style sheet should be or should not be shown in the block style drop- down list.

Default: 0

buttons.blockstyle.prefixLabelWithClassName

Property

buttons.blockstyle.prefixLabelWithClassName

Data type

boolean

Description

If set, the option name in the block style drop-down list is prefixed with the class name.

Default: 0

buttons.blockstyle.postfixLabelWithClassName

Property

buttons.blockstyle.postfixLabelWithClassName

Data type

boolean

Description

If set, the option name e in the block style drop-down list is postfixed with the class name.

Default: 0

buttons.blocktstyle.disableStyleOnOptionLabel

Property

buttons.blocktstyle.disableStyleOnOptionLabel

Data type

boolean

Description

If set, the styling is removed on the options block styling drop-down list.

Default: 0

See value property of RTE.classes array.

buttons.formattext.orderItems

Property

buttons.formattext.orderItems

Data type

list of id-strings

Description

Specifies the order in which the options, or inline element types, are presented in the text formating drop-down list.

If not set, the default order will be alphabetical, in the language of the current backend user.

buttons.formattext.removeItems

Property

buttons.formattext.removeItems

Data type

list of id-strings

Description

List of options to be removed from the text formating drop-down list using same names as toolbar elements.

buttons.formattext.prefixLabelWithTag

Property

buttons.formattext.prefixLabelWithTag

Data type

boolean

Description

If set, the option name in the text formating drop-down list is prefixed with the tagname.

Default: 0

buttons.formattext.postfixLabelWithTag

Property

buttons.formattext.postfixLabelWithTag

Data type

boolean

Description

If set, the option name e in the text formating drop-down list is postfixed with the tagname.

Default: 0

buttons.textstyle.tags.[ tag-name ].allowedClasses

Property

buttons.textstyle.tags.[ tag-name ].allowedClasses

Data type

list of id-strings

Description

Specifies the classes allowed for each inline element (tag) in the text styling drop-down list. Any string in the list may contain wild card characters. The wild card character is “*” and stands for any sequence of characters.

Supported tags are: abbr, acronym, b, bdo, big, cite, code, del, dfn, em, i, ins, kbd, q, samp, small, span, strike, strong, sub, sup, tt, u, var

The classes must also be defined in the CSS file specified by contentCSS property.

If the property is empty for any tag, classes associated with the given tag in the contentCSS file are used.

The classes are presented in the textstyle drop-down list in alphabetical order in the language used by the backend user.

buttons.textstyle.tags.all.allowedClasses

Property

buttons.textstyle.tags.all.allowedClasses

Data type

list of id-strings

Description

Specifies the classes allowed for all inline elements, in addition to the classes allowed for each specific element (see above).

The classes must also be defined in the CSS file specified by contentCSS property.

The classes are presented in the drop-down list in alphabetical order in the language used by the backend user.

buttons.textstyle.showTagFreeClasses

Property

buttons.textstyle.showTagFreeClasses

Data type

boolean

Description

Specifies that classes not associated with any tag in the contentCSS style sheet should be or should not be shown in the text styling drop- down list.

Default: 0

buttons.textstyle.prefixLabelWithClassName

Property

buttons.textstyle.prefixLabelWithClassName

Data type

boolean

Description

If set, the option name in the text styling drop-down list is prefixed with the class name.

Default: 0

buttons.textstyle.postfixLabelWithClassName

Property

buttons.textstyle.postfixLabelWithClassName

Data type

boolean

Description

If set, the option name e in the text styling drop-down list is postfixed with the class name.

Default: 0

buttons.textstyle.disableStyleOnOptionLabel

Property

buttons.textstyle.disableStyleOnOptionLabel

Data type

boolean

Description

If set, the styling is removed on the options text styling drop-down list.

Default: 0

See value property of RTE.classes array.

classesCharacter

Property

classesCharacter

DEPRECATED

Data type

list of id-strings

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use buttons.textstyle.tags.span.allowedClasses instead.

showTagFreeClasses

Property

showTagFreeClasses

DEPRECATED

Data type

boolean

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use buttons.blockstyle.showTagFreeClasses and buttons.textstyle.showTagFreeClasses instead.

disablePCexamples

Property

disablePCexamples

DEPRECATED

Data type

boolean

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use buttons.blockstyle.disableStyleOnOptionLabel and/or buttons.textstyle.disableStyleOnOptionLabel instead.

buttons.language.restrictToItems

Property

buttons.language.restrictToItems

Data type

list of strings

Description

List of language ISO codes to which the language marking drop-down list is limited to.

Note: If not set, all languages found in the static_languages table will appear in the drop-down list.

buttons.language.useLangAttribute

Property

buttons.language.useLangAttribute

Data type

boolean

Description

If set, the lang attribute is used fro language marks.

Default: 1

Note: If both useLangAttribute and useXmlLangAttribute are unset, the lang attribute will be used.

buttons.language.useXmlLangAttribute

Property

buttons.language.useXmlLangAttribute

Data type

boolean

Description

If set, the xml:lang attribute is used fro language marks.

Default: 0

buttons.language.prefixLabelWithCode

Property

buttons.language.prefixLabelWithCode

Data type

boolean

Description

If set, the option name e in the language marking drop-down list is prefixed with the language ISO code.

Default: 0

buttons.language.postfixLabelWithCode

Property

buttons.language.postfixLabelWithCode

Data type

boolean

Description

If set, the option name e in the language marking drop-down list is postfixed with the language ISO code.

Default: 0

buttons.spellcheck.enablePersonalDictionaries

Property

buttons.spellcheck.enablePersonalDictionaries

Data type

boolean

Description

If set, personal dictionaries are enabled.

Default: 0

Note: The feature must also be enabled in User TSConfig.

Note: Personal dictionaries are stored in subdirectories of uploads/tx_rtehtmlarea

buttons.spellcheck.dictionaries.restrictToItems

Property

buttons.spellcheck.dictionaries.restrictToItems

Data type

list-of-id-strings

Description

List of Aspell dictionary codes to which the drop-down list of dictionaries is limited in the spell checker dialogue.

Note: If not set, all dictionaries obtained from Aspell will appear in the drop-down list.

buttons.spellcheck.dictionaries.[ language-iso-code ].defaultValue

Property

buttons.spellcheck.dictionaries.[ language-iso-code ].defaultValue

Data type

string

Description

Aspell dictionary code of the dictionary to be used by default to spell check a content element in the language specified by the ISO code. The specified dictionary will be pre-selected in the drop-down list of dictionaries.

Default: the language ISO code.

disableTYPO3Browsers

Property

disableTYPO3Browsers

DEPRECATED

Data type

boolean

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use buttons.image.TYPO3Browser.disabled and buttons.link.TYPO3Browser.disabled instead.

classesImage

Property

classesImage

DEPRECATED

Data type

list of id-strings

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use buttons.image.properties.class.allowedClasses instead.

buttons.image.TYPO3Browser.disabled

Property

buttons.image.TYPO3Browser.disabled

Data type

boolean

Description

If set, the TYPO3 image browser is disabled.

Default: 0

Note: The TYPO3 image browser is never available when the editor is used in the frontend.

blindImageOptions

Property

blindImageOptions

DEPRECATED

Data type

list of strings

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use buttons.image.options.removeItems instead.

buttons.image.options.removeItems

Property

buttons.image.options.removeItems

Data type

list of strings

Description

List of tab items to remove from the dialog of the image button. Possible tab items are: magic, plain, dragdrop, image

Note: If key image is in the list, the properties editing tab for any current image will not be presented.

Note: More tabs may be provided by extensions such as DAM.

Note: dragdrop is not available in Opera.

buttons.image.options.orderItems

Property

buttons.image.options.orderItems

Data type

list of strings

Description

List of tab items in the order in which they should appear in the dialogue window. Items not in the list will not be available.

Note: Items that are removed will not be available (see buttons.image.options.removeItems).

Note: The default order is: image, magic, plain, dragdrop.

Note: The list may include items added by extensions such as DAM.

Note: The default order may be modified by extensions such as DAM.

buttons.image.options.magic.maxWidth

Property

buttons.image.options.magic.maxWidth

Data type

int+

Description

Maximum width of a magic image in pixels at the time of its initial insertion.

Default: 300

Note: The width of the magic image may be made larger when updating the image properties. However, the image is not recreated, only its HTML width attribute is updated.

buttons.image.options.magic.maxHeight

Property

buttons.image.options.magic.maxHeight

Data type

int+

Description

Maximum height of a magic image in pixels at the time of its initial insertion.

Default: 1000

Note: By setting a large enough height, images should be resized based on their width.

Note: The height of the magic image may be made larger when updating the image properties. However, the image is not recreated, only its HTML height attribute is updated.

buttons.image.options.plain.maxWidth

Property

buttons.image.options.plain.maxWidth

Data type

int+

Description

Maximum width of selectable plain images in pixels.

Default: 640

buttons.image.options.plain.maxHeight

Property

buttons.image.options.plain.maxHeight

Data type

int+

Description

Maximum height of selectable plain images in pixels.

Default: 680

buttons.image.title.useDAMColumn

Property

buttons.image.title.useDAMColumn

Data type

string

Description

Name of the column of the tx_dam table that will be used to set the image title attribute.

Default: caption

Note: This property is ignored if integration of DAM with the htmlArea RTE is not set in the DAM extension.

buttons.image.properties.removeItems

Property

buttons.image.properties.removeItems

Data type

list of strings

Description

List of properties to remove from the image properties editing window. Key list is align, alt, border, class, clickenlarge, float, height, paddingTop, paddingRight, paddingBottom, paddingLeft, title, width

Note: When a plain image is edited, if proc.plainImageMode is set to lockDimentions, lockRatio or lockRatioWhenSmaller, the height property is removed from the properties window. If proc.plainImageMode is set to lockDimensions, both the width and height properties are removed.

buttons.image.properties.class.allowedClasses

Property

buttons.image.properties.class.allowedClasses

Data type

list of id-strings

Description

Classes available in the Insert/Modify image dialogue.

Each of the listed classes must be defined in the CSS file specified by the contentCSS property.

buttons.image.properties.class.default

Property

buttons.image.properties.class.default

Data type

string

Description

Class to be assigned by default to an image when it is inserted in the RTE.

classesAnchor

Property

classesAnchor

DEPRECATED

Data type

list of id-strings

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use buttons.link.properties.class.allowedClasses instead.

classesAnchor.default.page

Property

classesAnchor.default.page

DEPRECATED

Data type

string

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use buttons.link.page.properties.class.default instead.

classesAnchor.default.url

Property

classesAnchor.default.url

DEPRECATED

Data type

string

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use buttons.link.url.properties.class.default instead.

classesAnchor.default.file

Property

classesAnchor.default.file

DEPRECATED

Data type

string

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use buttons.link.file.properties.class.default instead.

classesAnchor.default.mail

Property

classesAnchor.default.mail

DEPRECATED

Data type

string

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use buttons.link.mail.properties.class.default instead.

defaultLinkTarget

Property

defaultLinkTarget

DEPRECATED

Data type

string

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use buttons.link.properties.target.default instead.

blindLinkOptions

Property

blindLinkOptions

DEPRECATED

Data type

list of strings

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use buttons.link.options.removeItems instead.

buttons.acronym.pages

Property

buttons.acronym.pages

Data type

list of page id's

Description

List of page id's from which to obtain the acronym records.

Note: If not set, the list of current webmounts is used.

Note: If no acronym records are found in the specified page id's, the acronym button will not be present in the toolbar. If no records of type acronym or abreviation are found, the corresponding tab of the acronym dialogue will not be disabled.

Note: In IE, before IE7, the abreviation tab of the acronym dialogue is never shown.

buttons.acronym.recursive

Property

buttons.acronym.recursive

Data type

int

Description

The number of levels in the page tree, under each page listed in buttons.acronym.pages or under each webmount, from which acronyms are retrieved.

Default: 0

buttons.acronym. lockBeUserToDBmounts

Property

buttons.acronym. lockBeUserToDBmounts

Data type

boolean

Description

If set, the pid's listed under buttons.acronym.pages (see above) are validated against the user's current webmounts.

If not set or if the user is admin, buttons.acronym.pages is ignored and acronyms from all pages are retrieved.

Default: The default value of this property is the value of the property with same name in the backend section of theTYPO3 configuration as set by the Install Tool.

colors

Property

colors

Data type

list of id-strings

Description

Defines the specific colors generally available in the color selectors. The id-strings must be configured in the RTE.colors array (see description earlier).

Example:

RTE.default {
  colors = color1, color2,noColor
}
disableColorPicker

Property

disableColorPicker

Data type

boolean

Description

Disables the color picker matrix in all color dialogs. The color picker lets you select web-colors.

hideFontFaces

Property

hideFontFaces

DEPRECATED

Data type

list of id-numbers,

* removes all

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use buttons.fontstyle.removeItems instead.

fontFace

Property

fontFace

DEPRECATED

Data type

list of id-strings

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use buttons.fontstyle.addItems instead.

buttons.fontstyle.removeItems

Property

buttons.fontstyle.removeItems

Data type

list of id-numbers,

* removes all

Description

Lets you remove any of the default font faces in the Font Style selector. Values are ranging from 1 to 9. These are the possible options, and their respective name => value pairs, that you can remove:

1: Arial => Arial,sans-serif

2: Arial Black => 'Arial Black',sans-serif

3: Verdana => Verdana,Arial,sans-serif

4: 'Times New Roman' => 'Times New Roman',Times,serif

5: Garamond => Garamond

6: Lucida Handwriting => Lucida Handwriting

7: Courier => Courier

8: Webdings => Webdings

9: Wingdings => Wingdings

buttons.fontstyle.addItems

Property

buttons.fontstyle.addItems

Data type

list of id-strings

Description

Defines additional fonts available in the font selector. The id- strings must be configured in the RTE.fonts array (see description earlier).

buttons.fontstyle.defaultItem

Property

buttons.fontstyle.defaultItem

Data type

string

Description

Specifies the name of the default font style. The name is the name of one of the default font faces, or the name associated to one of fonts configured in the RTE.fonts array (see description earlier).

Note: The value associated to the default font style should be exactly the same as the value of the default font-family property specified in the site style sheet as referred to by property RTE.default.contentCSS.

hideFontSizes

Property

hideFontSizes

DEPRECATED

Data type

list of size-numbers,

* removes all

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use buttons.fontsize.removeItems instead.

fontSize

Property

fontSize

DEPRECATED

Data type

list of id-strings

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use buttons.fontsize.addItems instead.

buttons.fontsize.removeItems

Property

buttons.fontsize.removeItems

Data type

list of size-numbers,

* removes all

Description

Lets you disable any of the default font sizes available in the Font Size selector. Values are ranging from 1 to 7. These are the possible options, and their respective name => value pairs, that you can remove:

1: Extra small => 8px

2: Very small => 9px

3: Small => 10px

4: Medium => 12px

5: Large => 16px

6: Very large => 24px

7: Extra large => 32px

buttons.fontsize.addItems

Property

buttons.fontsize.addItems

Data type

list of id-strings

Description

Defines additional font sizes available in the font size selector. The id-strings must be configured in the RTE.fontSizes array (see description earlier).

buttons.fontsize.defaultItem

Property

buttons.fontsize.defaultItem

Data type

string

Description

Specifies the name of the default font size. The name is the name of one of the default font sizes, or the name associated to one of font sizes configured in the RTE.fontSizes array (see description earlier).

Note: The value associated to the default font size should be exactly the same as the value of the default font-size property specified in the site style sheet as referred to by property RTE.default.contentCSS. For correct behaviour in non-IE browsers, the value of the default font size should be specified in px units.

hideTableOperationsInToolbar

Property

hideTableOperationsInToolbar

Data type

boolean

Description

Specifies that table operations buttons should be hidden in the tool bar or not.

Default: 0

Note: If enabled, table operations will appear only in the context menu, provided that they may be enabled in the given context.

buttons.toggleborders.keepInToolbar

Property

buttons.toggleborders.keepInToolbar

Data type

boolean

Description

If set, the toggleborders button will be kept in the tool bar even if property hideTableOperationsInToolbar is set.

Default: 0

buttons.toggleborders.setOnTableCreation

Property

buttons.toggleborders.setOnTableCreation

Data type

boolean

Description

If set, and if the toggleborders button is enabled, the table borders will be toggled on when a new table is created.

Default : 0

buttons.toggleborders.setOnRTEOpen

Property

buttons.toggleborders.setOnRTEOpen

Data type

boolean

Description

If set, and if the toggleborders button is enabled, the table borders will be toggled on when the RTE opens.

Default : 0

buttons.[ button-name ].hotKey

Property

buttons.[ button-name ].hotKey

Data type

character

Description

A hotkey will be associated with the specified button-name.

Note: Care should be taken that the hotkey does not conflict with pre- defined hotkeys. If it does, the hotkey will override any previously registered hotkey.

buttons.[ button-name ].width

Property

buttons.[ button-name ].width

Data type

int+

Description

The width of the field in the toolbar when the button is a dropdown list.

buttons.[ button-name ].listWidth

Property

buttons.[ button-name ].listWidth

Data type

int+

Description

The width of the dropdown list when the button is a dropdown list.

Defauls to the width of the field in the toolbar.

buttons.[ button-name ].maxHeight

Property

buttons.[ button-name ].maxHeight

Data type

int+

Description

The maximum height of the dropdown list when the button is a dropdown list.

buttons.[ button-name ].dialogueWindow.width

Property

buttons.[ button-name ].dialogueWindow.width

Data type

int+

Description

The opening width of the dialogue window opened when the button is pressed.

buttons.[ button-name ].dialogueWindow.height

Property

buttons.[ button-name ].dialogueWindow.height

Data type

int+

Description

The opening height of the dialogue window opened when the button is pressed.

buttons.[ button-name ].dialogueWindow.positionFromTop

Property

buttons.[ button-name ].dialogueWindow.positionFromTop

Data type

int+

Description

The opening position from the top of the screen of the dialogue window opened when the button is pressed.

buttons.[ button-name ].dialogueWindow.positionFromLeft

Property

buttons.[ button-name ].dialogueWindow.positionFromLeft

Data type

int+

Description

The opening position from the left of the screen of the dialogue window opened when the button is pressed.

buttons.[ button-name ].dialogueWindow.doNotResize

Property

buttons.[ button-name ].dialogueWindow.doNotResize

Data type

boolean

Description

If set, the window that is opened when the button is pressed will not be resized to its contents.

Default: 0

buttons.[ button-name ].dialogueWindow.doNotCenter

Property

buttons.[ button-name ].dialogueWindow.doNotCenter

Data type

boolean

Description

If set, the window that is opened when the button is pressed will not be centered in the parent window.

Default: 0

mainStyleOverride

Property

mainStyleOverride

DEPRECATED

Data type

string

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use contentCSS instead.

By default the editor style section is set with the CSS-code below. However you may override this by this option.

Default:

body.htmlarea-content-body {
        font-family: Verdana,sans-serif;
        font-size: 12px;
        color: black;
        background-color: white;
}
td { }
div { }
pre { }
ol { }
ul { }
blockquote { }

Note: See also property ignoreMainStyleOverride.

mainStyleOverride_add.[ key ]

Property

mainStyleOverride_add.[ key ]

DEPRECATED

Data type

string (css-style)

Description

This property is DEPRECATED and will be removed in TYPO3 4.8. Use contentCSS instead.

Allows to add style configuration to the values above (for .mainStyleOverride above)

Keys are:

.P / .DIV / .TD /.BODY / .BLOCKQUOTE /.OL / .UL / .PRE / .Hx will all take values which are prepended to the above settings.

Note: See also property ignoreMainStyleOverride.

mainStyle_font

Property

mainStyle_font

mainStyle_size

mainStyle_color

mainStyle_bgcolor

DEPRECATED

Data type

string

Description

These properties are DEPRECATED and will be removed in TYPO3 4.8. Use contentCSS instead.

Setting the default font-family (verdana) , font-size (10px), font- color (black) and background color (white)

The default is shown in “.mainStyleOverride” above.

Note: See also property ignoreMainStyleOverride.

inlineStyle.[ any-keystring ]

Property

inlineStyle.[ any-keystring ]

DEPRECATED

Data type

string

Description

These properties are DEPRECATED and will be removed in TYPO3 4.8. Use contentCSS instead.

CSS code to be included in the editor style section. This will be included after the default code.

Note: See also property ignoreMainStyleOverride.

skin

Property

skin

Data type

resource

Description

The skin contains the CSS files and the images used to style the editor.

The skin is specified by specifying the location of the main CSS file to be used to style the editor. The folder containing the CSS file MUST also contain a structure of folders and files identical to the structure found in the folder of the default skin. All folder names and all file names must be identical.

Default: EXT:rtehtmlarea/htmlarea/skins/default/htmlarea.css

Note: these example skins do not work in Mozilla 1.3; if the property is set to one of them, the default skin will be used when the browser is Mozilla 1.3.

Note: See also property ignoreMainStyleOverride.

contentCSS

Property

contentCSS

Data type

resource

Description

The CSS file that contains the style definitions that should be applied to the edited contents.

The selectors defined in this file will also be used in the block style and text style selection lists.

Default: EXT:rtehtmlarea/res/contentcss/default.css

For example, this default could be overridden with: fileadmin/styles/my_contentCSS.css

Note: See also property ignoreMainStyleOverride.

ignoreMainStyleOverride

Property

ignoreMainStyleOverride

DEPRECATED

Data type

boolean

Description

These properties are DEPRECATED and will be removed in TYPO3 4.8. Use contentCSS instead.

If set, properties mainStyleOverride and inlineStyle are ignored.

Default: 0

Note: In htmlArea RTE, the following style sheets apply to the contents of the editing area and are linked in the following order:

1. the htmlarea-edited-content.css file from the skin being used (contains selectors for use in the editor but not intended to be applied in the frontend);

2. a css file generated from the mainStyleOverride and inlineStyle assignments;

  1. the css file specified by contentCSS in Page TSConfig.

When ignoreMainStyleOverride is enabled, the middle style sheet is ignored and only the first and third style sheets are used.

proc

Property

proc

Data type

->PROC

Description

Customization of the server processing of the content - also called 'transformations'.

See http://typo3.org/documentation/document-library/core- documentation/doc_core_api/current/view/5/2/

enableWordClean

Property

enableWordClean

Data type

boolean/

->HTMLparser

Description

Specifies that text pasted from external sources, presumably from Microsoft Word, should be “cleaned” or not.

Default: 0

Note:If no HTMLparser configuration is specified, a limited default cleaning operation will be performed. If a HTMLparser specification is specified, parsing will be performed on the server at the time of the paste operation.

Note: If an HTMLparser configuration is specified, care should be taken that span tags with id attribute are not removed by the cleaning operation. If they are removed, the cursor position will not be restored in non-IE browsers after the paste operation, and the cursor will then be positionned at the start of the text.

Note: Additional cleanup may be performed by the user when the removeformat button is enabled.

Note: Cleaning on paste cannot be performed in Opera.

Note: The same cleaning operation is performed with hotkey CTRL+0, including in Opera.

enableWordClean.hotKey

Property

enableWordClean.hotKey

Data type

character

Description

The default hotkey of the cleaning operation, CTRL+0, is replaced by CTRL+the specified character.

removeComments

Property

removeComments

Data type

boolean

Description

Specifies that html comments should be removed or not by the editor on save and on toggle to HTML source mode.

Default: 0

removeTags

Property

removeTags

Data type

list of tags

Description

List of tags that should be removed by the editor on save and on toggle to HTML source mode.

removeTagsAndContents

Property

removeTagsAndContents

Data type

list of tags

Description

List of tags that should be removed by the editor, contents included, on save and on toggle to HTML source mode. The tags and the contents inside the tags will be removed.

useCSS

Property

useCSS

Data type

boolean

Description

Specifies that Mozilla/Firefox should use style attributes or not. When enabled, Mozilla/Firefox use span tags with style attributes rather than tags such as b, i, font, etc.

Default: 0

disableEnterParagraphs

Property

disableEnterParagraphs

Data type

boolean

Description

Specifies that the insertion of paragraphs when hitting the Enter key in Mozilla/Firefox and Safari should be disabled.

Default: 0

Note: If NOT enabled, the behavior of Mozilla/Firefox and Safari is modified as follows: when the Enter key is pressed, instead of inserting a br tag, the behavior of Internet Explorer is simulated and a new paragraph is created.

Note: If enabled, the behavior of Mozilla/Firefox and Safari is not modified: a br tag is inserted when the Enter key is pressed.

disableObjectResizing

Property

disableObjectResizing

Data type

boolean

Description

Specifies that Mozilla/Firefox should not provide handles for resizing objects such as images and tables.

Default: 0

removeTrailingBR

Property

removeTrailingBR

Data type

boolean

Description

Specifies that trailing br tags should be removed from block elements.

Default: 0

Note: If set, any trailing br tag in a block element will be removed on save and/or change mode. However, multiple trailing br tags will be preserved.

Note: In Mozilla/Firefox/Netscape, whenever some text is entered in an empty block, a trailing br tag is added by the browser.

buttons.inserttag.denyTags

Property

buttons.inserttag.denyTags

Data type

list of tags

Description

List of tag names that should NOT be shown by the dialog of the inserttag button.

Note: Listed tag names should be among the following: a, abbr, acronym, address, b, big, blockquote, cite, code, div, em, fieldset, font, h1, h2, h3, h4, h5, h6, i, legend, li, ol, p, pre, q, small, span, strong, sub, sup, table, tt, ul

buttons.inserttag.allowedAttribs

Property

buttons.inserttag.allowedAttribs

Data type

list of attributes

Description

List of attribute names that should be shown for all tags in the dialog of the inserttag button.

Note: Listed attribute names should be among the following: class, dir, id, lang, onFocus, onBlur, onClick, onDblClick, onMouseDown, onMouseUp, onMouseOver, onMouseMove, onMouseOut, onKeyPress, onKeyDown, onKeyUp, style, title, xml:lang

buttons.inserttag.tags. [tagname] .allowedAttribs

Property

buttons.inserttag.tags. [tagname] .allowedAttribs

Data type

list of attributes

Description

List of attribute names that should be shown for the specified tagname in the dialog of the inserttag button, in addition to the attribute names specified by property buttons.inserttag.allowedAttribs.

buttons.table.disableEnterParagraphs

Property

buttons.table.disableEnterParagraphs

Data type

boolean

Description

If set, this property will prevent the insertion of paragraphs in table cells when the enter key is pressed.

Default: 0

buttons.table.enableHandles

Property

buttons.table.enableHandles

Data type

boolean

Description

If set, table handles will be enabled in Firefox. These Firefox- specific handles allow to delete/insert rows and columns using small handles displayed on table borders. However, insert operations also add a style attribute on inserted cells.

Default: 0

disableAlignmentFieldsetInTableOperations

Property

disableAlignmentFieldsetInTableOperations

disableSpacingFieldsetInTableOperations

disableColorFieldsetInTableOperations

disableLayoutFieldsetInTableOperations

disableBordersFieldsetInTableOperations

Data type

boolean

Description

Disables the corresponding fieldset in all table operations dialogues.

Default: 0

buttons.table.removeFieldsets

Property

buttons.table.removeFieldsets

Data type

list of strings

Description

List of fieldsets to remove from the table creation dialogue. Key list is alignment, borders, color, description, language, layout, spacing, style

buttons.tableproperties.removeFieldsets

Property

buttons.tableproperties.removeFieldsets

Data type

list of strings

Description

List of fieldsets to remove from the table properties edition dialogue. Key list is alignment, borders, color, description, language, layout, spacing, style

buttons.table.properties.required

Property

buttons.table.properties.required

Data type

list of strings

Description

List of fields for which a value is required in the table creation and table properties edition dialogues. Possible values are: caption, summary, captionOrSummary

buttons.table.properties.removed

Property

buttons.table.properties.removed

Data type

list of strings

Description

List of fields to remove from the table creation and table properties edition dialogues. Possible values are: width, height, float, headers, language, direction

buttons.table.properties.numberOfRows.defaultValue

Property

buttons.table.properties.numberOfRows.defaultValue

Data type

int+

Description

Default value for the number of rows to include in a table on creation.

Default: 2

buttons.table.properties.numberOfColumns.defaultValue

Property

buttons.table.properties.numberOfColumns.defaultValue

Data type

int+

Description

Default value for the number of columns to include in a table on creation.

Default: 4

buttons.table.properties.headers.defaultValue

Property

buttons.table.properties.headers.defaultValue

Data type

string

Description

Default selected option in the headers layout selector in the table creation dialogue. Possible values are: none, top, left, both

Default: top

buttons.table.properties.headers.removeItems

Property

buttons.table.properties.headers.removeItems

Data type

list of strings

Description

List of items to remove from the headers layout selector in the table creation dialogue. Key list is: none, top, left, both

Default: void

buttons.table.properties.headers.both.useHeaderClass

Property

buttons.table.properties.headers.both.useHeaderClass

Data type

list of strings

Description

A class to be assigned to the top row when the headers property specifies both.

Default: thead

buttons.table.properties.tableClass.defaultValue

Property

buttons.table.properties.tableClass.defaultValue

Data type

string

Description

Default selected class in the table class selector in the table creation dialogue.

Default: void

buttons.table.properties.width.defaultValue

Property

buttons.table.properties.width.defaultValue

Data type

+int

Description

Default value of the table wdth in the table creation dialogue.

Default: void

buttons.table.properties.widthUnit.defaultValue

Property

buttons.table.properties.widthUnit.defaultValue

Data type

string

Description

Default selected unit in the width unit selector in the table creation dialogue. Possible values are: %, px or em

Default: %

buttons.table.properties.widthUnit.removeItems

Property

buttons.table.properties.widthUnit.removeItems

Data type

list of strings

Description

List of items to remove from the table width unit selector in the table creation dialogue. Key list is: %, px, em

Default: void

buttons.table.properties.height.defaultValue

Property

buttons.table.properties.height.defaultValue

Data type

+int

Description

Default value of the table height in the table creation dialogue.

Default: void

buttons.table.properties.heightUnit.defaultValue

Property

buttons.table.properties.heightUnit.defaultValue

Data type

string

Description

Default selected unit in the height unit selector in the table creation dialogue. Possible values are: %, px or em

Default: %

buttons.table.properties.heightUnit.removeItems

Property

buttons.table.properties.heightUnit.removeItems

Data type

list of strings

Description

List of items to remove from the table height unit selector in the table creation dialogue. Key list is: %, px, em

Default: void

buttons.table.properties.float.defaultValue

Property

buttons.table.properties.float.defaultValue

Data type

string

Description

Default selected option in the table float selector in the table creation and properties edition dialogues.. Possible values are: not set, left, right

Default: not set

buttons.table.properties.float.left.useClass

Property

buttons.table.properties.float.left.useClass

Data type

string

Description

Class name to be assigned when left is selected in the table float selector in the table creation and properties edition dialogues.

Default: float-left

buttons.table.properties.float.right.useClass

Property

buttons.table.properties.float.right.useClass

Data type

string

Description

Class name to be assigned when right is selected in the table float selector in the table creation and properties edition dialogues.

Default: float-right

buttons.table.properties.float.removeItems

Property

buttons.table.properties.float.removeItems

Data type

list of strings

Description

List of items to remove from the table float selector in the table creation and properties edition dialogues. Key list is: not set, left, right

Default: void

buttons.table.properties.cellpadding.defaultValue

Property

buttons.table.properties.cellpadding.defaultValue

Data type

+int

Description

Default value of the table cellpadding attribute in the table creation and properties edition dialogues

Default: void

buttons.table.properties.cellspacing.defaultValue

Property

buttons.table.properties.cellspacing.defaultValue

Data type

+int

Description

Default value of the table cellspacing attribute in the table creation and properties edition dialogues .

Default: void

buttons.table.properties.borderWidth.defaultValue

Property

buttons.table.properties.borderWidth.defaultValue

Data type

+int

Description

Default value of the table border width attribute in the table creation and properties edition dialogues

Default: void

buttons.table.properties.borderStyle.defaultValue

Property

buttons.table.properties.borderStyle.defaultValue

Data type

string

Description

Default selected style in the border style selector in the table creation dialogue. Possible values are: not set, none, dotted, dashed, solid, double, groove, ridge, inset, outset

Default: not set

buttons.table.properties.borderStyle.removeItems

Property

buttons.table.properties.borderStyle.removeItems

Data type

list of strings

Description

List of items to remove from the table border style selector in the table creation dialogue. Key list is: not set, none, dotted, dashed, solid, double, groove, ridge, inset, outset

Default: void

buttons.rowproperties.removeFieldsets

Property

buttons.rowproperties.removeFieldsets

Data type

list of strings

Description

List of fieldsets to remove from the table row properties edition dialogue. Key list is alignment, borders, color, language, layout, rowgroup, style

Default: void

buttons.rowproperties.properties.removed

Property

buttons.rowproperties.properties.removed

Data type

list of strings

Description

List of fields to remove from the table row properties edition dialogue. Possible values are: width, height, language, direction

Default: void

buttons.rowproperties.properties.width.defaultValue

Property

buttons.rowproperties.properties.width.defaultValue

Data type

+int

Description

Default value of the row wdth in the table row properties edition dialogue.

Default: void

buttons.rowproperties.properties.widthUnit.defaultValue

Property

buttons.rowproperties.properties.widthUnit.defaultValue

Data type

string

Description

Default selected unit in the row width unit selector in the table row properties edition dialogue. Possible values are: %, px or em

Default: %

buttons.rowproperties.properties.widthUnit.removeItems

Property

buttons.rowproperties.properties.widthUnit.removeItems

Data type

list of strings

Description

List of items to remove from the row width unit selector in the table row properties edition dialogue. Key list is: %, px, em

Default: void

buttons.rowproperties.properties.height.defaultValue

Property

buttons.rowproperties.properties.height.defaultValue

Data type

+int

Description

Default value of the row height in the table row properties edition dialogue.

Default: void

buttons.rowproperties.properties.heightUnit.defaultValue

Property

buttons.rowproperties.properties.heightUnit.defaultValue

Data type

string

Description

Default selected unit in the row height unit selector iin the table row properties edition dialogue. Possible values are: %, px or em

Default: %

buttons.rowproperties.properties.heightUnit.removeItems

Property

buttons.rowproperties.properties.heightUnit.removeItems

Data type

list of strings

Description

List of items to remove from the row height unit selector in the table row properties edition dialogue. Key list is: %, px, em

Default: void

buttons.rowproperties.properties.borderStyle.removeItems

Property

buttons.rowproperties.properties.borderStyle.removeItems

Data type

list of strings

Description

List of items to remove from the row border style selector in the table row properties edition dialogue. Key list is: not set, none, dotted, dashed, solid, double, groove, ridge, inset, outset

Default: void

buttons.columnproperties.removeFieldsets

Property

buttons.columnproperties.removeFieldsets

Data type

list of strings

Description

List of fieldsets to remove from the column cells properties edition dialogue. Key list is alignment, borders, color, language, layout, style

buttons.cellproperties.removeFieldsets

Property

buttons.cellproperties.removeFieldsets

Data type

list of strings

Description

List of fieldsets to remove from the cell properties edition dialogue. Key list is alignment, borders, color, language, layout, style

buttons.cellproperties.properties.removed

Property

buttons.cellproperties.properties.removed

Data type

list of strings

Description

List of fields to remove from the cell properties and column cells properties edition dialogues. Possible values are: width, height, language, direction

Default: void

buttons.cellproperties.properties.width.defaultValue

Property

buttons.cellproperties.properties.width.defaultValue

Data type

+int

Description

Default value of the row wdth in the cell properties and column cells properties edition dialogues.

Default: void

buttons.cellproperties.properties.widthUnit.defaultValue

Property

buttons.cellproperties.properties.widthUnit.defaultValue

Data type

string

Description

Default selected unit in the row width unit selector in the cell properties and column cells properties edition dialogues. Possible values are: %, px or em

Default: %

buttons.cellproperties.properties.widthUnit.removeItems

Property

buttons.cellproperties.properties.widthUnit.removeItems

Data type

list of strings

Description

List of items to remove from the row width unit selector in the cell properties and column cells properties edition dialogues. Key list is: %, px, em

Default: void

buttons.cellproperties.properties.height.defaultValue

Property

buttons.cellproperties.properties.height.defaultValue

Data type

+int

Description

Default value of the row height in the cell properties and column cells properties edition dialogues.

Default: void

buttons.cellproperties.properties.heightUnit.defaultValue

Property

buttons.cellproperties.properties.heightUnit.defaultValue

Data type

string

Description

Default selected unit in the row height unit selector in the cell properties and column cells properties edition dialogues. Possible values are: %, px or em

Default: %

buttons.cellproperties.properties.heightUnit.removeItems

Property

buttons.cellproperties.properties.heightUnit.removeItems

Data type

list of strings

Description

List of items to remove from the row height unit selector in the cell properties and column cells properties edition dialogues. Key list is: %, px, em

Default: void

buttons.cellproperties.properties.borderStyle.removeItems

Property

buttons.cellproperties.properties.borderStyle.removeItems

Data type

list of strings

Description

List of items to remove from the cell border style selector in the cell properties and column cells properties edition dialogues. Key list is: not set, none, dotted, dashed, solid, double, groove, ridge, inset, outset

Default: void

buttons.paste.mozillaAllowClipboardUrl

Property

buttons.paste.mozillaAllowClipboardUrl

Data type

url

Description

The full absolute url of the AllowClipboard Helper extension for Mozilla/Firefox. The browser extension is used to allow the RTE to access the clipboard. The url is used to install the extension when required.

Default: http://typo3.org/fileadmin/allowclipboardhelper-0.6.xpi

buttons.pastetoggle.setActiveOnRteOpen

Property

buttons.pastetoggle.setActiveOnRteOpen

Data type

boolean

Description

If set, and if the pastetoggle button is enabled, the button is toggled to ON when the RTE opens.

Default : 0

buttons.pastetoggle.hidden

Property

buttons.pastetoggle.hidden

Data type

boolean

Description

If set, and if the pastetoggle button is enabled, the button is hidden in both the toolbar and the context menu. Hence, if buttons.pastetoggle.setActiveOnRteOpen is also set, all paste operations will be performed using the set clean paste behaviour.

Default : 0

Note: For BE operations, the default or overriding clean paste behaviour may be set in User TSConfig.

RTEHeightOverride

Property

RTEHeightOverride

Data type

int+

Description

If set, the specified value will override the calculated height of the RTE. This includes the height of the toolbar, of the editing area and of the status bar.

See also User TSConfig options.RTESmallHeight and options.RTELargeHeightIncrement

Note: This property may be overridden by the BE user configuration. See User TSConfig

RTEWidthOverride

Property

RTEWidthOverride

Data type

int+/%

Description

If set, the specified value will override the calculated width of the RTE editing area. Note that a percentage may be specified.

Note: The property is ignored in IE if the value is a percentage.

Note: This property may be overridden by the BE user configuration. See User TSConfig.

rteResize

Property

rteResize

Data type

boolean

Description

If set, the RTE is resizable.

Default: 0

Note: This property may be overridden by the BE user configuration. See User TSConfig.

rteMaxHeight

Property

rteMaxHeight

Data type

int+

Description

If the RTE is resizable, this is the maximal height of the RTE, including the tool bar, the editing area and the status bar.

Default: 2000

Note: This property may be overridden by the BE user configuration. See User TSConfig.

dialogueWindows.defaultPositionFromTop

Property

dialogueWindows.defaultPositionFromTop

Data type

int+

Description

The default opening position from the top of the screen of a dialogue window opened when a button is pressed.

Note: May be averridden by a specific button configuration.

dialogueWindows.defaultPositionFromLeft

Property

dialogueWindows.defaultPositionFromLeft

Data type

int+

Description

The default opening position from the left of the screen of a dialogue window opened when a button is pressed.

Note: May be averridden by a specific button configuration.

dialogueWindows.doNotResize

Property

dialogueWindows.doNotResize

Data type

boolean

Description

If set, the window that is opened when any button is pressed will not be resized to its contents.

Default: 0

dialogueWindows.doNotCenter

Property

dialogueWindows.doNotCenter

Data type

boolean

Description

If set, the window that is opened when any button is pressed will not be centered in the parent window.

Default: 0

userElements.[#]

Property

userElements.[#]

Data type

string/->userCategory

Description

Configuration of the categories of user elements

The string value sets the name of the category. Value is language- splitted (by |) to allow for multiple languages.

logDeprecatedProperties.disabled

Property

logDeprecatedProperties.disabled

Data type

boolean

Description

If set, usage of deprecated Page TS Config properties is not logged to the deprecation log.

Default: 0

logDeprecatedProperties.logAlsoToBELog

Property

logDeprecatedProperties.logAlsoToBELog

Data type

boolean

Description

If set, usage of deprecated Page TS Config properties is also logged to the BE log.

Default: 0

schema.sources.[#]

Property

schema.sources.[#]

Data type

array

Description

An array of filenames containing vocabulary definitions inXML/RDF format.

Default: schemaOrg = EXT:rtehtmlarea/extensions/MicrodataSchema/res/schemaOrgAll.rdf

[page:RTE.default/RTE.default.FE/RTE.config.(table).(field)/RTE.config .(table).(field).types.(type)]

classesAnchor:

The following property allows to configure the anchor accessibility feature:

classesAnchor.[ id-string ]

Property

classesAnchor.[ id-string ]

Description

Attaches special properties to the classes available in the Insert/Modify link dialog.

Properties:

.class = CSS-class-name: the name of the CSS class to which the properties are attached

.type = page, url, file, mail or spec: specifies that the class applies to anchors for internal pages, external URL's, files, email addresses or special user-defined links respectively; the class will be presented only in the corresponding tab of the 'Insert/Modify link' dialogue

.image = URL of an icon file that will prefix or postfix the content of the anchor when the class is applied to an anchor; the TYPO3 syntax EXT:extension-key/sub-directory/image-file-name may be used

.addIconAfterLink = boolean: if set, the content of the link is postfixed with the icon; default is to prefix the content of the link with the icon

.altText = the text that will be used as altText for the image when the class is applied to an anchor; may be language-splitted; the TYPO3 syntax LLL:EXT:extension-key/sub-directory/locallang.xml:label-index may also be used in order for the text to be localized to the language of the content using the specified language file and label index

.titleText = the text that will be used as title for the anchor when the class is applied to an anchor; may be language-splitted;the TYPO3 syntax LLL:EXT:extension-key/sub-directory/locallang.xml:label-index may also be used in order for the text to be localized to the language of the content using the specified language file and label index

.target = string; if set, this is the default value to be assigned to the target attribute of the link when the class is applied to the link

See the Demo default configuration for a complete example.

[page:RTE]

userCategory:

Properties of each user element category.

load

Property

load

Data type

string

Description

If set, the a predefined set of user element is loaded into this category. They are always loaded in the key starting with 100 and then forward in steps of 10.

Current options are:

“images_from_folder”: Loads gif,jpg,jpeg,png images from the specified folder (defined by the .path property)

merge

Property

merge

Data type

Boolean

Description

If set, then any manually configured user elements are merged onto the ones loaded by the .load operation.

path

Property

path

Data type

String

Description

(Applies for load=images_from_folder only)

Sets the path of the folder from which to fetch the images (gif,jpg,jpeg,png)

Example:

.path = fileadmin/istate/

[#]

Property

[#]

Data type

string/->userElements

Description

Configuration of the user elements.

The string value is the name of the user element. Language-splitted.

Example:

RTE.default.userElements {
    # Category with various elements
  10 = Various elements | Diverse elements
  10 {
      # An image is inserted
    1 = Logo 1 | Bomærke 1
    1.description = This is the logo number 1. | Dette er logo nummer 1
    1.content = <img src="###_URL###fileadmin/istate/curro.png">

      # The text-selection is wrapped with <sup> tags.
    2 = Subscript
    2.description = Selected text is wrapped in <sup>-tags.
    2.mode = wrap
    2.content = <sup>|</sup>

      # This submits the selected text content to the script, rte_cleaner.php
    5 = Strip all tags
    5.description = All HTML-codes are removed from selection.
    5.mode = processor
    5.submitToScript = typo3/rte_cleaner.php
  }

    # Category with images from the fileadmin/istate/ folder
  2.load = images_from_folder
  2.merge = 1
  2.path = fileadmin/istate/
    # here the logo from “Various elements” is included as well
  2.1 < .10.1
}
  # Show the user-button, if not existing
RTE.default.showButtons = user

[page:->userCategory]

userElements:

Properties of each user elements setup.

mode

Property

mode

Data type

string

Description

Which kind of object it is.

Options:

“wrap”: If a wrap, then the content is exploded by “|” and wrapped around the current text selection.

“processor”: The content is submitted to the php-script defined by .submitToScript. GPvar(“processContent”) carries the selection content of the RTE and GPvar(“returnUrl”) contains the return url. (The “content” property is not used here!)

default: The content is just inserted (pasted into) at the cursor or substituting any current selection.

description

Property

description

Data type

string

Description

A short description shown beneath the user element title (which is in bold)

content

Property

content

Data type

string

Description

The content inserted/wrapped into the RTE

submitToScript

Property

submitToScript

Data type

string

Description

(Applies only to mode=processor)

PHP script to which the current text selection of the RTE is submitted. The script must be relative to the site-url or a full url starting with http://...

Example:

.submitToScript = typo3/rte_cleaner.php

or

.submitToScript = http://www.domain.org/some_extenal_script.php
dontInsertSiteUrl

Property

dontInsertSiteUrl

Data type

boolean

Description

If set, the marker ###_URL### in the content property's content IS NOT substituted by the current site url. Normally you wish to do this for all image-references which must be prepended with the absolute url in order to display correctly in the RTE!

[page:->userElements]

userLinks:

Properties of user links

url

Property

url

Data type

string

Description

The url.

If set, the marker ###_URL### in the content property's content is substituted by the current site url.

description

Property

description

Data type

string

Description

A short description shown beneath the link title (which is in bold)

target

Property

target

Data type

string

Description

Default target (if isset())

[page:->userLinks]

Toolbar Elements

The following GUI elements may be configured in the RTE toolbar:

space

Name

space

Type

Control

Descripton

Insert a space between two toolbar elements

bar

Name

bar

Type

Control

Descripton

Insert a vertical bar in the toolbar, elements between bars being grouped

linebreak

Name

linebreak

Type

Control

Descripton

Insert a new line in the toolbar

blockstylelabel

Name

blockstylelabel

Type

Label

Descripton

Label for drop-down with CSS styles for block elements

blockstyle

Name

blockstyle

Type

Drop-down

Descripton

Selection of CSS styles for block elements

textstylelabel

Name

textstylelabel

Type

Label

Descripton

Label for drop-down with CSS styles inline elements

textstyle

Name

textstyle

Type

Drop-down

Descripton

Selection CSS styles for inline elements

fontstyle

Name

fontstyle

Type

Drop-down

Descripton

Selection of font family

fontsize

Name

fontsize

Type

Drop-down

Descripton

Selection of relative font size (very small, small, normal, etc.)

formatblock

Name

formatblock

Type

Drop-down

Descripton

Selection of block element (paragraph, heading, preformatted text, blockquote, etc.)

blockquote

Name

blockquote

Type

Button

Descripton

Insert/make current block element a blockquote

insertparagraphbefore

Name

insertparagraphbefore

Type

Button

Descripton

Insert a paragraph before the current block element

Insertparagraphafter

Name

Insertparagraphafter

Type

Button

Descripton

Insert a paragraph after the current block element

lefttoright

Name

lefttoright

Type

Button

Descripton

Set writing direction of current block element to left to right

righttoleft

Name

righttoleft

Type

Button

Descripton

Set writing direction of current block element to right to left

language

Name

language

Type

Button

Descripton

Mark selected text as the selected language

showlanguagemarks

Name

showlanguagemarks

Type

Toggle button

Descripton

Show/hide language markup of elements with language attribute

left

Name

left

Type

Button

Descripton

Left-justify current block element

center

Name

center

Type

Button

Descripton

Center current block element

justifyfull

Name

justifyfull

Type

Button

Descripton

Fully justify current block element

orderedlist

Name

orderedlist

Type

Button

Descripton

Insert/make current block element an ordered list (ol, li)

unorderedlist

Name

unorderedlist

Type

Button

Descripton

Insert/make current block element an unordered list (ul, li)

definitionlist

Name

definitionlist

Type

Button

Descripton

Insert/make current block element a definition list (dl)

definitionitem

Name

definitionitem

Type

Toggle button

Descripton

Toggle current definition list element between definition and explaination (dt, dd)

outdent

Name

outdent

Type

Button

Descripton

Decrease indentation of current block element

indent

Name

indent

Type

Button

Descripton

Increase indentation of current block element

formattext

Name

formattext

Type

Drop-down

Descripton

Selection of inline element

bidioverride

Name

bidioverride

Type

Button

Descripton

Change direction for marked text (bdo)

big

Name

big

Type

Button

Descripton

Set font size of marked text to big (big)

bold

Name

bold

Type

Button

Descripton

Set font style of marked text to bold (b)

citation

Name

citation

Type

Button

Descripton

Mark text as citation (cite)

code

Name

code

Type

Button

Descripton

Mark text as code (code)

definition

Name

definition

Type

Button

Descripton

Mark text as definition (dfn)

deletedtext

Name

deletedtext

Type

Button

Descripton

Mark text as deleted (del)

emphasis

Name

emphasis

Type

Button

Descripton

Mark text as emphasized (em)

insertedtext

Name

insertedtext

Type

Button

Descripton

Mark text as inserted (ins)

italic

Name

italic

Type

Button

Descripton

Set font style of marked text to italic (i)

keyboard

Name

keyboard

Type

Button

Descripton

Mark text as keyboard input (kbd)

monospaced

Name

monospaced

Type

Button

Descripton

Set font of marked text to non-proportional (tt)

quotation

Name

quotation

Type

Button

Descripton

Mark text as small quote (q)

sample

Name

sample

Type

Button

Descripton

Mark text as example (samp)

small

Name

small

Type

Button

Descripton

Set font size of marked text to small (small)

span

Name

span

Type

Button

Descripton

Enclose marked text in generic span (span)

strikethrough

Name

strikethrough

Type

Button

Descripton

Set font style of marked text to strike-through (strike)

strong

Name

strong

Type

Button

Descripton

Mark text as strongly emphasized (strong)

subscript

Name

subscript

Type

Button

Descripton

Set font style of marked text to subscript (sub)

superscript

Name

superscript

Type

Button

Descripton

Set font style of marked text to superscript (sup)

underline

Name

underline

Type

Button

Descripton

Set font style of marked text to underlined (u)

variable

Name

variable

Type

Button

Descripton

Mark text as variable (var)

textcolor

Name

textcolor

Type

Button

Descripton

Set font color of marked text or of element at cursor position

bgcolor

Name

bgcolor

Type

Button

Descripton

Set background color of marked text or of element at cursor position

textindicator

Name

textindicator

Type

Indicator

Descripton

Show font and background color of text at cursor position

editelement

Name

editelement

Type

Button

Descripton

Edit general attributes such as "id", "name", "lang" and other universal attributes on any element of the content

emoticon

Name

emoticon

Type

Button

Descripton

Insert an emoticon

insertcharacter

Name

insertcharacter

Type

Button

Descripton

Insert a special character

insertsofthyphen

Name

insertsofthyphen

Type

Button

Descripton

Insert a soft hyphen

line

Name

line

Type

Button

Descripton

Insert an horizontal line (hr)

image

Name

image

Type

Button

Descripton

Insert an image at the cursor position (img)

table

Name

table

Type

Button

Descripton

Insert a table at the cursor position (table)

user

Name

user

Type

Button

Descripton

Insert a customized tag at the cursor position

acronym

Name

acronym

Type

Button

Descripton

Mark the text as acronym or abbreviation (acronym, abbr)

findreplace

Name

findreplace

Type

Button

Descripton

Open search and replace tool

spellcheck

Name

spellcheck

Type

Button

Descripton

Open spellchecker

chMode

Name

chMode

Type

Button

Descripton

Switch between WYSIWYG and HTML code view

inserttag

Name

inserttag

Type

Button

Descripton

Insert a tag

removeformat

Name

removeformat

Type

Button

Descripton

Open the text cleaning tool

copy

Name

copy

Type

Button

Descripton

Copy marked content to the clipboard

cut

Name

cut

Type

Button

Descripton

Copy marked content to the clipboard and delete marked text

paste

Name

paste

Type

Button

Descripton

Paste content of the clipboard at cursor position

pastetoggle

Name

pastetoggle

Type

Toggle button

Descripton

Toggle between normal paste behaviour and alternative paste behaviour

pastebehaviour

Name

pastebehaviour

Type

Button

Descripton

Select alternative paste behaviour

undo

Name

undo

Type

Button

Descripton

Undo a change

redo

Name

redo

Type

Button

Descripton

Redo an undone change

about

Name

about

Type

Button

Descripton

Show info about the RTE

toggleborders

Name

toggleborders

Type

Toggle button

Descripton

Show/hide table borders

tableproperties

Name

tableproperties

Type

Button

Descripton

Open table properties dialogue

tablerestyle

Name

tablerestyle

Type

Button

Descripton

Re-apply alternating/numbering styles to all rows, columns and cells

rowproperties

Name

rowproperties

Type

Button

Descripton

Open table row properties dialogue

rowinsertabove

Name

rowinsertabove

Type

Button

Descripton

Insert a table row above the current one

rowinsertunder

Name

rowinsertunder

Type

Button

Descripton

Insert a table row below the current one

rowdelete

Name

rowdelete

Type

Button

Descripton

Delete the current row

rowsplit

Name

rowsplit

Type

Button

Descripton

Divide the current table row

columnproperties

Name

columnproperties

Type

Button

Descripton

Open table column properties dialogue

columninsertbefore

Name

columninsertbefore

Type

Button

Descripton

Insert a table column before the current one

columninsertafter

Name

columninsertafter

Type

Button

Descripton

Insert a table column after the current one

columndelete

Name

columndelete

Type

Button

Descripton

Delete the current table column

columnsplit

Name

columnsplit

Type

Button

Descripton

Split the current table column into

cellproperties

Name

cellproperties

Type

Button

Descripton

Open table cell properties dialog

cellinsertbefore

Name

cellinsertbefore

Type

Button

Descripton

Insert a table cell before the current one

cellinsertafter

Name

cellinsertafter

Type

Button

Descripton

Insert a table cell after the current one

celldelete

Name

celldelete

Type

Button

Descripton

Delete the current table cell

cellsplit

Name

cellsplit

Type

Button

Descripton

Split the current table cell into

cellmerge

Name

cellmerge

Type

Button

Descripton

Merge the selected table cells

Static Template: Clickenlarge Rendering

In order for the click-enlarge property of images inserted in the RTE to be rendered on the frontend, static template «Clickenlarge Rendering (rtehtmlarea)» must be included in the TypoScript template. This static template must be included after static template CSS Styled Content (css_styled_content).

Note that stdWrap property may be applied to the generated link tag by configuring the property in TS template setup:

lib.parseFunc_RTE.tags.img.postUserFunc.stdWrap.

This may be used, for examble, to add additional attributes to the generated link tag.

Default Website Language

If you enable the Spell Checker feature, make sure you have created a Website Language record for the default language of your site, even if your TypoScript template does not refer to it.

Server Configuration

Internet Explorer has caching problems that may affect the performance of the htmlArea RTE. These problems may be worked around with the following server configuration recommendations.

((generated))

Apache configuration:

Add the following lines to your Apache httpd.conf file or in the .htaccess file of the root directory of your site:

BrowserMatch "MSIE" brokenvary=1
BrowserMatch "Mozilla/4.[0-9]{2}" brokenvary=1
BrowserMatch "Opera" !brokenvary
SetEnvIf brokenvary 1 force-no-vary

ExpiresActive On
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/png "access plus 1 month"

The last two statements require the mod_expires Apache module to be installed. For information on this module, see:

http://httpd.apache.org/docs/1.3/mod/mod_expires.html

More information:

For more information on this subject, see the following articles:

http://dean.edwards.name/my/flicker.html

http://httpd.apache.org/docs/1.3/mod/mod_expires.html

http://fivesevensix.com/studies/ie6flicker/

See also the Troubleshooting section of the present document for information on IE caching problems in relation with the Apache mod_gzip module.

Installing multiple RTE's

You can install as many RTE's has you wish. Their availability will be checked in the order in which they are loaded, that is in the order they are installed.

Using htmlArea RTE in a front end plugin

If you are a TYPO3 front end extension developer, your extensions may use the htmlArea RTE API to enable rich text editing of text fields. You will find the the htmlArea RTE API Manual on the TYPO3 Extension Repository (extension key: rtehtmlarea_api_manual)

Note that the TYPO3 Image, TYPO3 Link , User Elements and Acronym features are not available when the RTE is used in the TYPO3 front end.

Configuring the anchor accessibility feature

The anchor accessibility feature allows to attach special accessibility features to CSS classes when they are applied to links with the TYPO3 element browser. For example, icons may be inserted in front or at the end of links when configured classes are assigned to the links.

The Extension Manager must be used to enable the feature.

The TYPO3 element browser must be enabled in the 'Insert/Modify link' dialogue by setting property buttons.link.TYPO3Browser.disabled to 0 in Page TSConfig. The TYPO3 element browser is enabled by default in the backend, but never available in the frontend.

The classes should first be defined in the CSS file specified by RTE.default.contentCSS.

The classes should be part of the list specified by property RTE.default.classesAnchor.

The accessibility features attached to the classes are specified by property RTE.classesAnchor.

Default Configurations

htmlArea RTE offers four default configurations:

  • Typical: sets Page TSConfig and User TSConfig with most commonly used features representing a good start for typical sites and for most situations;
  • Minimal: sets Page TSConfig and User TSConfig with minimal features; this is for advanced administrators who are familiar with the features of the RTE and understand well how to configure the RTE using Page TSConfig;
  • Demo: sets Page TSConfig and User TSConfig with as many features as possible for users who want to explore the features of the RTE; this is not recommended for a production environment;
  • Image: adds support for images to the Typical default configuration.

The default configuration may be chosen in the installation dialog of the htmlArea RTE extension presented by the Extension Manager. If not otherwise specified, the Typical default configuration will be used.

All default configurations share the same default configuration of RTE content transformation.

Default configuration of RTE content transformation

This default configuration establishes default settings in Page TSConfig for RTE content transformation.

For documentation of RTE tranformations, see: http://typo3.org/documentation/document-library/core- documentation/doc_core_api/4.1.0/view/5/2/

For documentation of Page TSConfig configuration of RTE processing, see: http://typo3.org/documentation/document- library/references/doc_core_tsconfig/current/view/1/3/

For documentation of the HTMLparser, see: http://typo3.org/documentation/document- library/references/doc_core_tsref/current/view/5/17/

For documentation of RTE settings in TCA, see: http://typo3.org/documentation/document-library/core- documentation/doc_core_api/4.1.0/view/4/3/#id3665895

((generated))

The following is inserted in Page TSConfig:

## Default RTE processing rules

RTE.default.proc {

## TRANSFORMATION METHOD

## We assume that CSS Styled Content is used.

overruleMode = ts_css

## DO NOT CONVERT BR TAGS INTO LINEBREAKS

## br tags in the content are assumed to be intentional.

dontConvBRtoParagraph = 1

## PRESERVE DIV SECTIONS - DO NOT REMAP TO P

preserveDIVSections = 1

## TAGS ALLOWED OUTSIDE P & DIV

allowTagsOutside = address, article, aside, blockquote, footer, header, hr, nav, section

## TAGS ALLOWED

## Added to the default internal list: b,i,u,a,img,br,div,center,pre,f ont,hr,sub,sup,p,strong,em,li,ul,ol,blockquote,strike,span

## But, for the sake of clarity, we use a complete list in alphabetic order.

## center, font, link, meta, o:p, strike, sdfield, style, title and u will be removed on entry (see below).

## b and i will be remapped on exit (see below).

## Note that the link accessibility feature of htmlArea RTE does insert img tags.

allowTags (
             a, abbr, acronym, address, article, aside, b, bdo, big, blockquote, br, caption, center, cite, code, col, colgroup, dd, del, dfn, dl, div, dt, em, font, footer,
             header, h1, h2, h3, h4, h5, h6, hr, i, img, ins, kbd, label, li, link, meta, nav, ol, p, pre, q, samp, sdfield, section, small,
             span, strike, strong, style, sub, sup, table, thead, tbody, tfoot, td, th, tr, title, tt, u, ul, var
             )

## TAGS DENIED

## Make sure we can set rules on any tag listed in allowTags.

denyTags >

## ALLOWED P & DIV ATTRIBUTES

## Attributes class and align are always preserved

## Align attribute will be unset on entry (see below)

## This is a list of additional attributes to keep

keepPDIVattribs = id, title, dir, lang, xml:lang, itemscope, itemtype, itemprop

## ALLOW TO WRITE ABOUT HTML

dontUndoHSC_db = 1
     dontHSC_rte = 1

## CONTENT TO DATABASE

entryHTMLparser_db = 1
     entryHTMLparser_db {

## TAGS ALLOWED

## Always use the same list of allowed tags.

allowTags < RTE.default.proc.allowTags

## TAGS DENIED

## Make sure we can set rules on any tag listed in allowTags.

denyTags >

## AVOID CONTENT BEING HSC'ed TWICE

htmlSpecialChars = 0
tags {

## REMOVE IMG TAGS

img.allowedAttribs = 0
     img.rmTagIfNoAttrib = 1

## CLEAN ATTRIBUTES ON THE FOLLOWING TAGS

   span.fixAttrib.style.unset = 1
        span.allowedAttribs = id, title, dir, lang, xml:lang, class, itemscope, itemtype, itemprop
        span.rmTagIfNoAttrib = 1
        p {
                allowedAttribs = id, title, dir, lang, xml:lang, class, itemscope, itemtype, itemprop
                fixAttrib.align.unset = 1
        }
        div < .p
        hr.allowedAttribs = class
        b.allowedAttribs  < .span.allowedAttribs
        bdo.allowedAttribs  < .span.allowedAttribs
        big.allowedAttribs  < .span.allowedAttribs
        blockquote.allowedAttribs  < .span.allowedAttribs
        cite.allowedAttribs  < .span.allowedAttribs
        code.allowedAttribs  < .span.allowedAttribs
        del.allowedAttribs  < .span.allowedAttribs
        dfn.allowedAttribs  < .span.allowedAttribs
        em.allowedAttribs  < .span.allowedAttribs
        i.allowedAttribs  < .span.allowedAttribs
        ins.allowedAttribs  < .span.allowedAttribs
        kbd.allowedAttribs  < .span.allowedAttribs
        label.allowedAttribs  < .span.allowedAttribs
        q.allowedAttribs  < .span.allowedAttribs
        samp.allowedAttribs  < .span.allowedAttribs
        small.allowedAttribs  < .span.allowedAttribs
        strike.allowedAttribs  < .span.allowedAttribs
        strong.allowedAttribs  < .span.allowedAttribs
        sub.allowedAttribs  < .span.allowedAttribs
        sup.allowedAttribs  < .span.allowedAttribs
        tt.allowedAttribs  < .span.allowedAttribs
        u.allowedAttribs  < .span.allowedAttribs
        var.allowedAttribs  < .span.allowedAttribs
}

## REMOVE OPEN OFFICE META DATA TAGS, WORD 2003 TAGS, LINK, META, STYLE AND TITLE TAGS, AND DEPRECATED HTML TAGS

## We use this rule instead of the denyTags rule so that we can protect custom tags without protecting these unwanted tags.

removeTags = center, font, link, o:p, sdfield, meta, style, title, strike, u

## PROTECT CUSTOM TAGS

   keepNonMatchedTags = protect
}
HTMLparser_db {

## STRIP ALL ATTRIBUTES FROM THESE TAGS

## If this list of tags is not set, it will default to: b,i,u,br,center,hr,sub,sup,strong,em,li,ul,ol,blockquote,strike.

## However, we want to keep xml:lang attribute on most tags and tags from the default list where cleaned on entry.

noAttrib = br

## XHTML COMPLIANCE

## Note that applying xhtml_cleaning on exit would break non-standard attributes of typolink tags

   xhtml_cleaning = 1
}
exitHTMLparser_db = 1
     exitHTMLparser_db {

## KEEP ALL TAGS

## Unwanted tags were removed on entry.

## Without this rule, the parser will remove all tags! Presumably, this rule will be more efficient than repeating the allowTags rule

keepNonMatchedTags = 1

## AVOID CONTENT BEING HSC'ed TWICE

           htmlSpecialChars = 0
        }
}

## Use same RTE processing rules in FE

RTE.default.FE.proc < RTE.default.proc

## RTE processing rules for bodytext column of tt_content table

## Erase settings from other extensions

RTE.config.tt_content.bodytext >

## Make sure we use ts_css transformation

RTE.config.tt_content.bodytext.proc.overruleMode = ts_css
RTE.config.tt_content.bodytext.types.text.proc.overruleMode = ts_css
RTE.config.tt_content.bodytext.types.textpic.proc.overruleMode = ts_css

Typical default configuration

This default configuration establishes default settings in Page TSConfig and User TSConfig with most commonly used features representing a good start for typical sites.

((generated))

The following is inserted in Page TSConfig:

## Define labels and styles to be applied to class selectors in the interface of the RTE

## The examples included here make partial re-use of color scheme and frame scheme from CSS Styled Content extension

RTE.classes {
        align-left {
                name = LLL:EXT:rtehtmlarea/htmlarea/locallang_tooltips.xml:justifyleft
                value = text-align: left;
        }
        align-center {
                name = LLL:EXT:rtehtmlarea/htmlarea/locallang_tooltips.xml:justifycenter
                value = text-align: center;
        }
        align-right {
                name = LLL:EXT:rtehtmlarea/htmlarea/locallang_tooltips.xml:justifyright
                value = text-align: right;
        }
        csc-frame-frame1 {
                name = LLL:EXT:rtehtmlarea/res/contentcss/locallang.xml:frame-frame1
                value = background-color: #EDEBF1; border: 1px solid #333333;
        }
        csc-frame-frame2 {
                name = LLL:EXT:rtehtmlarea/res/contentcss/locallang.xml:frame-frame2
                value = background-color: #F5FFAA; border: 1px solid #333333;
        }
        important {
                name = LLL:EXT:rtehtmlarea/res/contentcss/locallang.xml:important
                value = color: #8A0020;
        }
        name-of-person {
                name = LLL:EXT:rtehtmlarea/res/contentcss/locallang.xml:name-of-person
                value = color: #10007B;
        }
        detail {
                name = LLL:EXT:rtehtmlarea/res/contentcss/locallang.xml:detail
                value = color: #186900;
        }
        component-items {
                name = LLL:EXT:rtehtmlarea/res/contentcss/locallang.xml:component-items
                value = color: #186900;
        }
        action-items {
                name = LLL:EXT:rtehtmlarea/res/contentcss/locallang.xml:action-items
                value = color: #8A0020;
        }
        component-items-ordered {
                name = LLL:EXT:rtehtmlarea/res/contentcss/locallang.xml:component-items
                value = color: #186900;
        }
        action-items-ordered {
                name = LLL:EXT:rtehtmlarea/res/contentcss/locallang.xml:action-items
                value = color: #8A0020;
        }
}

## Anchor classes configuration for use by the anchor accesibility feature

RTE.classesAnchor {
        externalLink {
                class = external-link
                type = url
                titleText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:external_link_titleText
        }
        externalLinkInNewWindow {
                class = external-link-new-window
                type = url
                titleText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:external_link_new_window_titleText
        }
        internalLink {
                class = internal-link
                type = page
                titleText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:internal_link_titleText
        }
        internalLinkInNewWindow {
                class = internal-link-new-window
                type = page
                titleText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:internal_link_new_window_titleText
        }
        download {
                class = download
                type = file
                titleText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:download_titleText
        }
        mail {
                class = mail
                type = mail
                titleText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:mail_titleText
        }
}

## Default RTE configuration

RTE.default {

## Markup options

enableWordClean = 1
     removeTrailingBR = 1
     removeComments = 1
     removeTags = center, font, o:p, sdfield, strike, u
     removeTagsAndContents = link, meta, script, style, title

## Toolbar options

## The TCA configuration may add buttons to the toolbar

showButtons (
             blockstylelabel, blockstyle, textstylelabel, textstyle,
             formatblock, bold, italic, subscript, superscript,
             orderedlist, unorderedlist, outdent, indent, textindicator,
             insertcharacter, link, table, findreplace, chMode, removeformat, undo, redo, about,
             toggleborders, tableproperties,
             rowproperties, rowinsertabove, rowinsertunder, rowdelete, rowsplit,
             columninsertbefore, columninsertafter, columndelete, columnsplit,
             cellproperties, cellinsertbefore, cellinsertafter, celldelete, cellsplit, cellmerge
     )

## More toolbar options

keepButtonGroupTogether = 1

## Enable status bar

showStatusBar =  1

## Hide infrequently used block types in the block formatting selector

buttons.formatblock.removeItems = pre,address

## Property ignoreMainStyleOverride is DEPRECATED as of TYPO3 4.6 and will be removed in TYPO3 4.8

## Use stylesheet file rather than mainStyleOverride and inlineStyle properties to style the contents

## When RTE.default.contentCSS is not specified, file EXT:rtehtmlarea/res/contentcsss/default.css is used.

ignoreMainStyleOverride = 1

## List all class selectors that are allowed on the way to the database

proc.allowedClasses (
             external-link, external-link-new-window, internal-link, internal-link-new-window, download, mail,
             align-left, align-center, align-right, align-justify,
             csc-frame-frame1, csc-frame-frame2,
             component-items, action-items,
             component-items-ordered, action-items-ordered,
             important, name-of-person, detail,
             indent
     )

## Restrict the list of class selectors presented by the RTE to the following for the specified tags:

buttons.blockstyle.tags.div.allowedClasses (
             align-left, align-center, align-right,
             csc-frame-frame1, csc-frame-frame2
     )
     buttons.blockstyle.tags.table.allowedClasses = csc-frame-frame1, csc-frame-frame2
     buttons.blockstyle.tags.td.allowedClasses = align-left, align-center, align-right
     buttons.textstyle.tags.span.allowedClasses = important, name-of-person, detail

## Configuration of classes for links

## These classes should also be in the list proc.allowedClasses

buttons.link.properties.class.allowedClasses = external-link, external-link-new-window, internal-link, internal-link-new-window, download, mail
     buttons.link.page.properties.class.default = internal-link
     buttons.link.url.properties.class.default = external-link-new-window
     buttons.link.file.properties.class.default = download
     buttons.link.mail.properties.class.default = mail

## Configuration specific to the TableOperations feature

## Remove the following fieldsets from the properties popups

disableAlignmentFieldsetInTableOperations = 1
     disableSpacingFieldsetInTableOperations = 1
     disableColorFieldsetInTableOperations = 1
     disableLayoutFieldsetInTableOperations = 1

## Show borders on table creation

buttons.toggleborders.setOnTableCreation = 1

## Configuration specific to the bold and italic buttons

## Add hotkeys associated with bold and italic buttons

buttons.bold.hotKey = b
     buttons.italic.hotKey = i

## Configuration of microdata schema

   schema {
                sources {
                        schemaOrg = EXT:rtehtmlarea/extensions/MicrodataSchema/res/schemaOrgAll.rdf
                }
        }
}

## front end RTE configuration for the general public

RTE.default.FE < RTE.default
RTE.default.FE.showStatusBar = 0
RTE.default.FE.hideButtons = chMode, blockstyle, textstyle, underline, strikethrough, subscript, superscript, lefttoright, righttoleft, left, center, right, justifyfull, table, inserttag, findreplace, removeformat, copy, cut, paste
RTE.default.FE.userElements >
RTE.default.FE.userLinks >

## tt_content TCEFORM configuration

## Let use all the space available for more comfort.

TCEFORM.tt_content.bodytext.RTEfullScreenWidth= 100%
The following is inserted in User TSConfig:

## Enable the RTE by default for all users

setup.default.edit_RTE = 1

Minimal default configuration

This default configuration establishes default settings in Page TSConfig and User TSConfig with minimal features. This is for advanced administrators with good knowledge of RTE configuration in Page TSConfig.

((generated))

The following is inserted in Page TSConfig:

## Default RTE configuration

RTE.default {

## Toolbar options applicable to all RTE's

## The TCA configuration may add buttons to the toolbar

   showButtons =  bold,italic,undo,redo,about
}

## front end RTE configuration for the general public

RTE.default.FE < RTE.default
The following is inserted in User TSConfig:

## Enable the RTE by default for all users

setup.default.edit_RTE = 1

Demo default configuration

This default configuration sets Page TSConfig and User TSConfig with as many features as possible for users who want to explore the features of the RTE. This is not recommended for production environments.

((generated))

The following is inserted in Page TSConfig:

## Define labels and styles to be applied to class selectors in the interface of the RTE

## Partial re-use of color scheme and frame scheme from CSS Styled Content extension

RTE.classes {
        align-left {
                name = LLL:EXT:rtehtmlarea/htmlarea/locallang_tooltips.xml:justifyleft
                value = text-align: left;
        }
        align-center {
                name = LLL:EXT:rtehtmlarea/htmlarea/locallang_tooltips.xml:justifycenter
                value = text-align: center;
        }
        align-right {
                name = LLL:EXT:rtehtmlarea/htmlarea/locallang_tooltips.xml:justifyright
                value = text-align: right;
        }
        csc-frame-frame1 {
                name = LLL:EXT:rtehtmlarea/res/contentcss/locallang.xml:frame-frame1
                value = background-color: #EDEBF1; border: 1px solid #333333;
        }
        csc-frame-frame2 {
                name = LLL:EXT:rtehtmlarea/res/contentcss/locallang.xml:frame-frame2
                value = background-color: #F5FFAA; border: 1px solid #333333;
        }
        important {
                name = LLL:EXT:rtehtmlarea/res/contentcss/locallang.xml:important
                value = color: #8A0020;
        }
        name-of-person {
                name = LLL:EXT:rtehtmlarea/res/contentcss/locallang.xml:name-of-person
                value = color: #10007B;
        }
        detail {
                name = LLL:EXT:rtehtmlarea/res/contentcss/locallang.xml:detail
                value = color: #186900;
        }
        component-items {
                name = LLL:EXT:rtehtmlarea/res/contentcss/locallang.xml:component-items
                value = color: #186900;
        }
        action-items {
                name = LLL:EXT:rtehtmlarea/res/contentcss/locallang.xml:action-items
                value = color: #8A0020;
        }
        component-items-ordered {
                name = LLL:EXT:rtehtmlarea/res/contentcss/locallang.xml:component-items
                value = color: #186900;
        }
        action-items-ordered {
                name = LLL:EXT:rtehtmlarea/res/contentcss/locallang.xml:action-items
                value = color: #8A0020;
        }
}

## Anchor classes configuration for use by the anchor accessibility feature

RTE.classesAnchor {
        externalLink {
                class = external-link
                type = url
                image = EXT:rtehtmlarea/res/accessibilityicons/img/external_link.gif
                altText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:external_link_altText
                titleText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:external_link_titleText
        }
        externalLinkInNewWindow {
                class = external-link-new-window
                type = url
                image = EXT:rtehtmlarea/res/accessibilityicons/img/external_link_new_window.gif
                altText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:external_link_new_window_altText
                titleText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:external_link_new_window_titleText
        }
        internalLink {
                class = internal-link
                type = page
                image = EXT:rtehtmlarea/res/accessibilityicons/img/internal_link.gif
                altText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:internal_link_altText
                titleText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:internal_link_titleText
        }
        internalLinkInNewWindow {
                class = internal-link-new-window
                type = page
                image = EXT:rtehtmlarea/res/accessibilityicons/img/internal_link_new_window.gif
                altText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:internal_link_new_window_altText
                titleText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:internal_link_new_window_titleText
        }
        download {
                class = download
                type = file
                image = EXT:rtehtmlarea/res/accessibilityicons/img/download.gif
                altText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:download_altText
                titleText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:download_titleText
        }
        mail {
                class = mail
                type = mail
                image = EXT:rtehtmlarea/res/accessibilityicons/img/mail.gif
                altText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:mail_altText
                titleText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:mail_titleText
        }
}

## Default RTE configuration

RTE.default {

## Markup options

enableWordClean = 1
     removeTrailingBR = 1
     removeComments = 1
     removeTags = center, o:p, sdfield
     removeTagsAndContents = link, meta, script, style, title

## Allow img tags

proc.entryHTMLparser_db.tags.img >

## Allow style attributes on p and span tags

proc.entryHTMLparser_db.tags {
             p.allowedAttribs := addToList(style)
             span.fixAttrib.style.unset >
     }

## Toolbar options

showButtons = *

## More toolbar options

keepButtonGroupTogether = 1

## Enable status bar

showStatusBar =  1

     )

## Property ignoreMainStyleOverride is DEPRECATED as of TYPO3 4.6 and will be removed in TYPO3 4.8

## Use stylesheet file rather than mainStyleOverride and inlineStyle properties to style the contents

## When RTE.default.contentCSS is not specified, file EXT:rtehtmlarea/res/contentcsss/default.css is used.

ignoreMainStyleOverride = 1

## For this demo, do not remove font, strike and u tags

proc.entryHTMLparser_db.removeTags := removeFromList(font,strike,u)

## List all class selectors that are allowed on the way to the database

proc.allowedClasses (
             external-link, external-link-new-window, internal-link, internal-link-new-window, download, mail,
             align-left, align-center, align-right, align-justify,
             csc-frame-frame1, csc-frame-frame2,
             component-items, action-items,
             component-items-ordered, action-items-ordered,
             important, name-of-person, detail,
             indent
     )

## Restrict the list of class selectors presented by the RTE to the following for the specified tags:

buttons.blockstyle.tags.div.allowedClasses (
             align-left, align-center, align-right,
             csc-frame-frame1, csc-frame-frame2
     )
     buttons.blockstyle.tags.table.allowedClasses = csc-frame-frame1, csc-frame-frame2
     buttons.blockstyle.tags.td.allowedClasses = align-left, align-center, align-right
     buttons.textstyle.tags.span.allowedClasses = important, name-of-person, detail

## Configuration of classes for links

## These classes should also be in the list proc.allowedClasses

buttons.link.properties.class.allowedClasses = external-link, external-link-new-window, internal-link, internal-link-new-window, download, mail
     buttons.link.page.properties.class.default = internal-link
     buttons.link.url.properties.class.default = external-link-new-window
     buttons.link.file.properties.class.default = download
     buttons.link.mail.properties.class.default = mail

## Show all applicable class selectors available in the style sheet file

buttons.blockstyle.showTagFreeClasses = 1
     buttons.textstyle.showTagFreeClasses = 1

## Configuration specific to the table button or TableOperations feature

## Use the context menu instead of the toolbar for table operations, but keep toggleborders button in toolbar

## Show borders on table creation

hideTableOperationsInToolbar = 1
     buttons.toggleborders.keepInToolbar = 1
     buttons.toggleborders.setOnTableCreation = 1

## Configuration specific to the inserttag button or QuickTag feature

## Do not allow insertion of the following tags

buttons.inserttag.denyTags = font, underline, strike, table

## Configuration specific to the bold and italic buttons

## Add hotkeys associated with bold, italic, strikethrough and underline buttons

buttons.bold.hotKey = b
     buttons.italic.hotKey = i
     buttons.strikethrough.hotKey = s
     buttons.underline.hotkey = u

## Configuration specific to the spellcheck button or SpellCheck feature

## Enable the use of personal dictionaries

buttons.spellcheck.enablePersonalDictionaries = 1

## Configuration of microdata schema

   schema {
                sources {
                        schemaOrg = EXT:rtehtmlarea/extensions/MicrodataSchema/res/schemaOrgAll.rdf
                }
        }
}

## Use same processing as on entry to database to clean content pasted into the editor

RTE.default.enableWordClean.HTMLparser < RTE.default.proc.entryHTMLparser_db

## front end RTE configuration

RTE.default.FE < RTE.default
RTE.default.FE.userElements >
RTE.default.FE.userLinks >

## tt_content TCEFORM configuration

## Let use all the space available for more comfort.

TCEFORM.tt_content.bodytext.RTEfullScreenWidth= 100%
The following is inserted in User TSConfig:

## Enable the RTE by default for all users

setup.default.edit_RTE = 1

## Enable the file upload feature of the element browser by default for all users

options.uploadFieldsInTopOfEB = 1

## Set the default spelling ability of the check speller for all users

options.HTMLAreaPspellMode = bad-spellers

## Enable the personal dictionary feature of the check speller by default for all users

options.enablePersonalDicts = 1

Image default configuration

This default configuration establishes support for images in Page TSConfig. This is for use in addition to the Typical default configuration.

((generated))

The following is inserted in Page TSConfig:

## Anchor classes configuration for use by the anchor accesibility feature

## Add inline icons to the links

RTE.classesAnchor {
        externalLink {
                image = EXT:rtehtmlarea/res/accessibilityicons/img/external_link.gif
                altText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:external_link_altText
        }
        externalLinkInNewWindow {
                image = EXT:rtehtmlarea/res/accessibilityicons/img/external_link_new_window.gif
                altText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:external_link_new_window_altText
        }
        internalLink {
                image = EXT:rtehtmlarea/res/accessibilityicons/img/internal_link.gif
                altText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:internal_link_altText
        }
        internalLinkInNewWindow {
                image = EXT:rtehtmlarea/res/accessibilityicons/img/internal_link_new_window.gif
                altText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:internal_link_new_window_altText
        }
        download {
                image = EXT:rtehtmlarea/res/accessibilityicons/img/download.gif
                altText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:download_altText
        }
        mail {
                image = EXT:rtehtmlarea/res/accessibilityicons/img/mail.gif
                altText = LLL:EXT:rtehtmlarea/res/accessibilityicons/locallang.xml:mail_altText
        }
}

## Default RTE configuration

RTE.default {

                ## Enable the image button
        showButtons := addToList(image)

                ## Tags allowed outside p and div
                ## Adding img tag to the default list
        proc.allowTagsOutside := addToList(img)

                ## Do not remove img tags
        proc.entryHTMLparser_db.tags.img >
}

RTE.default.FE.showButtons < RTE.default.showButtons
RTE.default.FE.proc.allowTagsOutside < RTE.default.proc.allowTagsOutside
RTE.default.FE.proc.entryHTMLparser_db.tags.img >

Troubleshooting

Internet Explorer caching problem with Apache mod_gzip module

This article by Jan Wulff describes the problems encountered with Internet Explorer 4/5/6 and the Apache server with mod_gzip activated. It describes how to work around these problems.

((generated))

Problem:

If the Apache module mod_gzip is activated on your server, you may encounter the problem that Internet Explorer denies any caching for the whole site, thus stopping the block style and text style selctor lists of htmlArea RTE to work correctly. Besides, it may even slow down some other features of TYPO3, like graphical JavaScript menus. This effect does not depend on the gzip compression itself. Internet Explorer is indeed able to handle compressed files. The problem is IE's handling of one of the HTTP response headers sent with every served document.

Background:

The HTTP Vary response header indicates whether a cache is permitted to use the response to reply to a subsequent request without re- validating the document. This is necessary if a document is not suitable for all clients and is served in multiple different versions according to the HTTP headers the client sends with his request.

For example, with activated mod_gzip, every document is at least available in two versions, compressed and uncompressed. If a browser with gzip support requests such a document, it will receive the compressed version. A proxy between the client and the server may cache this file. Now, another browser without gzip support requests the same document via the same proxy. Without the Vary header the proxy would not know if the compressed document may be delivered to the new client, because it can't compare the HTTP headers of the second browser with the Vary header. If it would nevertheless serve it, the client would receive a bunch of data, without any idea, how to process it. Therefore mod_gzip sends a Vary header with each response with at least 'Accept-Encoding' as content.

The problems arise when the Internet Explorer enters the stage. IE 4, 5 and 6 recognizes only one kind of Vary header: 'User-agent', used to distinguish between versions for different browsers. Every other Vary header will be interpreted as it would have a single '*' as content. Because this does not compare with the headers send by any client, it forbids any caching of documents received with this header.

Solution:

There is more than one approach to handle this problem. The following configuration directives all have to be set in the Apache configuration file or in a .htaccess file which has to be located in your TYPO3 root.

Easy going:

So, you have no need for any gzip support? Fine, just deactivate the module and your problems are gone. Use this directive:

mod_gzip_on No

Complex approach:

You do have a lot of big code or text files, or you have to save as much transfer bandwidth as possible? Anyway, deactivating mod_gzip is no option for you? Then, you should first check what release of mod_gzip your server is using. If you don't know how, ask your provider, or just use the solution for releases from 1.3.19.2a till 1.3.26.1a.

mod_gzip release < 1.3.19.2a

Releases before this version didn't send Vary headers, so there shouldn't be any problem. But because you're reading this, you most probably don't use these versions.

mod_gzip release 1.3.19.2a <> 1.3.26.1a

These releases all use Vary headers. However, they send these headers without verifying if the document is really checked for compression. The only recommended way to get around this, is to deactivate mod_gzip. But thanks to Apache, you can deactivate mod_gzip separately for chosen files, and let it do it's work for the rest. You could use this to deactivate mod_gzip for all css files:

<FilesMatch "\.css$">
mod_gzip_on No
</FilesMatch>

Or going even further, you could also include image files:

<FilesMatch "\.(css|gif|jpe?g|png)$">
mod_gzip_on No
</FilesMatch>

By the way, there is another possibility. You could deactivate Vary headers in mod_gzip with this:

mod_gzip_send_vary Off

But there is a reason why mod_gzip, since 1.3.19.2a, uses Vary headers. As described above, you could badly mess up proxy servers, by serving compressed files without Vary headers. Therefore, I strongly discourage this approach.

mod_gzip release > 1.3.26.1a

Since release 1.3.26.1a, mod_gzip is a bit more discriminate. It only sends Vary headers with documents which were checked for compression. So you can tell mod_gzip to exclude some files. This approach is not so much different from the former solution, but it is cleaner because it addresses mod_gzip firsthand. To exclude CSS files from compression, use this directive:

mod_gzip_item_exclude file \.css$

If you would like to add images and Javascript files, you could use this:

mod_gzip_item_exclude file \.css$
mod_gzip_item_exclude file \.png$
mod_gzip_item_exclude file \.gif$
mod_gzip_item_exclude file \.jpg$
mod_gzip_item_exclude file \.jpeg$
mod_gzip_item_exclude file \.js$

This is just a short survey of the caching problems with Internet Explorer and mod_gzip. I wrote it with best intent and hope it may be helpful. If you find any mistakes, please let me know at <messages@janwulff.de>. I'm in no way responsible for any consequences that may come forth by the use of this information.

Internet Explorer and HTML tag abbr

Before IE7, Internet Explorer did not support HTML tag abbr. If a content element containing this tag is edited with htmlArea RTE in IE6, the tag may be broken. Therefore, abbr tags are transformed to acronym tags if IE6 is used.

Security error when accessing the stylesheets

This article by Carsten Emde describes a problem taht may arise when the RTE tries to access the stylesheets.

((generated))

Problem:

In Firefox, the following error message is written to the JavaScript console:

"[A security error occurred. Make sure all stylesheets are accessed from the same domain/subdomain and using the same protocol as the current script."

Background:

In order to prevent the error, everything of a web page needs to be in the same domain, in the same subdomain and, more importantly, be transmitted with the same protocol. This is not a special feature of Firefox; IE8, Safari, Chrome, Opera and friends are behaving similarly.

Initially, a user is connecting to our Web site "http://www.mydomain.org", and the content of the Web site including CSS files is loaded. In order to use the calendar and trouble ticket extensions, the user needs to login. As required for this purpose, the login page is accessed via https and some content is then transmitted using this protocol. Any further attempt to run RTE in this situation, irrespective of whether subsequent content is transmitted via http or https, crashes with the security error. This is the result of the browser storing the transmission protocol and the domain of the content, so it can refuse to load dynamic pages, if they do not match the available content, or if there is no coherent origin and protocol of the content.

Solution:

I therefore changed the baseURL of the page to "https://www.mydomain.org" to force a coherent protocol throughout an entire session - even when it is not needed. Unfortunately, it still did not work, because I simply forgot to flush the browser cache. Of course, I flushed the server caches (as always), but in this special case, it is important that the browser cache be flushed as well to remove any non-https content at the client site. Only if the entire content of a Web page has been transmitted using the same protocol, it is considered safe. After I flushed the browser cache, RTE popped up and started to work as I was used to it from the backend experience.

Issue with Firefox extension NoScript

((generated))

Problem:

When the Firefox extension NoScript is installed, images served by a server on localhost may not be displayed in the RTE.

Solution:

The problem may be solved by modifying the ABE configuration of the NoScript extension.

Go to NoScript Options -> Advanced -> ABE -> SYSTEM .

Modify the existing ruleset so that it looks as follows:

Site LOCAL

Accept from LOCAL about:blank

Deny

img-1 TSComnfig EXT: htmlArea RTE - 60