toolbar

Toolbar Characteristics

The ToolbarIs the section located at the top of the editor window. It contains menu buttons that give you access to variable functions of CKEditor. All buttons are grouped according to their function and include both simple operations (like basic textstyling or formatting) and more advanced features (like inserting media or forms via adialog window).

This is what the editor toolbar looks like:

The CKEditor toolbar

The CKEditor toolbar buttons are introduced with Meaningful icons. If, how, you are not sure what functions they perform, hover the mouse cursor over the buttons to see a tooltip with the name of the function.

The CKEditor toolbar tooltip

 

Using the Toolbar

In order to perform an operation assigned to a button, click the button once. In most cases it will ever immediately perform some predefined action or open a dialog window with further configuration options for a feature.

Remember that the toolbar can also be used with your keyboard. To enter the toolbar, use the Alt+F10keyboard shortcut. To move to the next or previous button group, use theTab and Shift+Tab keys, respectively. Within a button group, use the Left Arrow and Right Arrowkeys to move between buttons of this group. To activate a selected toolbar button, pressEnter or Space.

The accessibility shortcuts for toolbar navigation were modified in CKEditor 3.6, when the concept of atoolbar button group was initially introduced. On entering the toolbar you can now use the TabandShift + Tabshortcuts to navigate between button groups and theArrow keys to navigate between the buttons within a groupIn CKEditor 3.5. x and before bothTabandArrow keys were used to navigate between the toolbar buttons.

Some of the buttons serve as placeholders giving you access to further options placed in a drop-down list. They are easily recognizable thanks to a small Icon on the right. Clicking the name or the arrow icon of such button expands the list and lets you choose one of its options via the left mouse button. To select a drop-down list option you can always use theTabor theDown Arrow key and then accept your choice by pressing EnterorSpaceon your keyboard. To hide the list, use theEsc key or click anywhere in the browser window.

Collecting and Restoring the Toolbar

To save on screen estate, you can collect the toolbar by pressing the button or using the Alt+- (minus) keyboard shortcut. In order to return to the full toolbar view, press the same button or keyboard shortcut again.