How Do I Get Multiple CKEditor Instances to Share the Same Toolbar?

This website contains links to software which is either no longer maintained or will be supported only until the end of 2019 (CKFinder 2). For the latest documentation about current CKSource projects, including software like CKEditor 4/CKEditor 5, CKFinder 3, Cloud Services, Letters, Accessibility Checker, please visit the new documentation website.

If you look for an information about very old versions of CKEditor, FCKeditor and CKFinder check also the CKEditor forum, which was closed in 2015. If not, please head to StackOverflow for support.

Use the sharedSpaces configuration value to define the page element that will contain the shared toolbar (top) and the elements path (bottom) for the editor instances.

// Place the toolbar inside the element with an ID of "myToolbar" and the elements path
// in the element with an ID of "myElementsPath".
config.sharedSpaces =
{
	top : 'myToolbar',
	bottom : 'myElementsPath'
};

Remember that you can share either both the toolbar and the elements path or just one of these elements. You can also combine editor instances with different configurations (with shared elements and without them) on one page.

important note

If multiple editor instances are to share some parts of the interface, the sharedSpaces setting has to be defined for each of them separately.


For a full working example of sharing the editor interface refer to the Shared Toolbars (sharedspaces.html) sample located in the _samples folder of the CKEditor installation package.

This page was last edited on 9 March 2011, at 16:37.