(Article contents added) |
(Link to UG added) |
||
| Line 1: | Line 1: | ||
{{#CUSTOMTITLE:How Do I Detach the CKEditor Toolbar from the Editing Area?}} | {{#CUSTOMTITLE:How Do I Detach the CKEditor Toolbar from the Editing Area?}} | ||
| − | Use the <code>[http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html#.sharedSpaces sharedSpaces]</code> configuration value to define the page element that will contain the toolbar, and pass it in the <code>top</code> parameter. With this configuration the toolbar can be moved to any page element, not just a <code>textarea</code> element. | + | Use the <code>[http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html#.sharedSpaces sharedSpaces]</code> configuration value to define the page element that will contain the [[CKEditor_3.x/Users_Guide/Interface/Toolbar|toolbar]], and pass it in the <code>top</code> parameter. With this configuration the toolbar can be moved to any page element, not just a <code>textarea</code> element. |
<source lang="javascript"> | <source lang="javascript"> | ||
Latest revision as of 17:32, 9 March 2011
Use the sharedSpaces configuration value to define the page element that will contain the toolbar, and pass it in the top parameter. With this configuration the toolbar can be moved to any page element, not just a textarea element.
// Place the toolbar inside the element with an ID of "myToolbar".
config.sharedSpaces =
{
top : 'myToolbar'
};
For a full working example of detaching the editor interface from the editing area and sharing the interface between multiple CKEditor instances refer to the Shared Toolbars (sharedspaces.html) sample located in the _samples folder of the CKEditor installation package.