Aloha Editor toolbar
After reading this guide, you will be able to:
- Configure Aloha Editor toolbar
This guide is currently a draft for the Aloha Editor jQuery UI, which is supposed to be the next generation UI for Aloha Editor. Your feedback is welcome!
1 Toolbar concept
The Toolbar provides tabs and groups. You may add ui components to groups. There ist only one instance of a the toolbar and it changes its items depending on the acitvated editable.
2 Toolbar integration
You may embed the toolbar in a given container in your site or let it float. If you don’t provide a container the toolbar will append a div element as last element of the documents body and position the toolbar as defined.
Aloha.ui.toolbar.appendTo('#aloha-toolbar');
3 Component configuration
You may define the name of your tabs and groups as key. The following example defines a toolbar with the 3 tabs format, insert and link. The name of the tabs and groups is passed to i18n
which translates them to the currently displayed language. The format tab has the two groups inline and paragraph. You may define the components that should be rendered by the group.
Aloha.settings.toolbar = { tabs: { format : { inline: [ 'bold', 'italic', 'striketrough', 'abbreviation', 'spacer', 'metaview' ] paragraph: [ 'formatparagraph' ] }, insert: { general: [ 'insertable', 'charakterpicker', 'insertlink' ] media: [ 'image', 'video' ] }, link: { link: [ 'editlink' ] } } };
4 Behavior configuration
- September 1, 2011: Initial version by Haymo Meran and Scott Gonzales