Formatting Text with the eZ Publish Online Editor

When the Online Editor is enabled, it will be displayed every time you edit text that is stored using the XML block datatype. Note that the Online Editor is not a standalone text editor; in other words, you can only edit eZ Publish content with it, and only when you are logged in to the system. We briefly introduced the Online Editor in the second article of this series.

The Online Editor has five elements, three of which are shown in the screenshot below:

Components of the Online Editor

1. The OE text area contains an editable visualization of XML code as formatted text.
2. The context-sensitive pop-up menu can be accessed by right-clicking anywhere in the OE text area. In addition to standard commands like undo, cut, copy and so on, the pop-up menu contains specific items that can be used to manipulate the selected / current element.
3. Modal dialogs (pop-up windows for entering specific kinds of data) provide access to additional editing tools, depending on the current setting.
4. The OE status bar, located directly below the OE text area, displays useful information about the element where the cursor is currently located.
5. The OE toolbar contains tools for editing the content that is displayed in the OE text area. The buttons are very similar to those found in many word processors. The following screenshot shows the different buttons:

OE Toolbar

Hover your mouse over the buttons in the OE Toolbar to display tooltips describing each button's function.

When a particular button is disabled, this means that the button's function is not applicable in the current context.

The Actions area of the OE toolbar contains buttons to undo or redo the last operations. These buttons work similarly to those in popular word processing applications. The Undo button can be used to reverse the last operation or to remove the last entry that was typed. Keep clicking this button to reverse multiple operations. The Redo button can be used to reverse (or restore) the last undo operation. Keep clicking this button in order to restore multiple operations.

The Special character button is located in the Special Tools area of the OE toolbar, and is symbolized with an alpha letter. This button allows you to insert special characters that may not normally be found on your keyboard (such as the copyright symbol or characters from languages other than your system's default language). Position the cursor at the location within the OE text area where you wish to insert a special character. Then, click the Special character button to bring up a modal dialog with a table of special characters. To insert a character, simply click on it inside the modal dialog.

The Literal text button is located in the Special Tools area of the OE toolbar. This button can be used to create an area where you can input unformatted text such as program source code, HTML code and XML content. Everything that is inside a literal block will be rendered in the same way (character by character) when the final output is generated.

The current element is determined by the cursor's position. Selected elements refer to highlighted (or otherwise selected) content. To perform an operation on the current or selected element, use the OE toolbar and the context-sensitive pop-up menu.