#Ckeditor toolbar items how to#
#Ckeditor toolbar items full#

To use the browser's context menu instead of the CKEditor-specific one, render the editing area in an iframe instead of a div (see above). Also remove the CKEditor plugins that trigger the context menu.

That plugin is not part of the Bloomreach Experience Manager CKEditor distribution, but can be added to a project in the same way as a custom CKEditor plugin. It's also worthwhile to include the Document Properties CKEditor Plugin in the project. title, link, etc.) the HTML cleaner configuration (both client-side and server-side) needs to be adjusted. If additional tags in the HTML head are needed (e.g.

Also enable full page editing in the CKEditor configuration. including html, head, body, etc.), render the editing area in an iframe instead of a div (see above). To enable editing of full HTML pages (e.g. Please note that the 'forms' plugin will take care of adding all form related elements to be excluded from client-side HTML cleaning, but this is not the case for the server-side HTML cleaner. Next we use the following configuration snippet to enable the 'forms' plugin and add it's buttons to the toolbar. This is because the HTML specification does not allow nested form elements and (unfortunately) the CMS document editor is already a form on it's own.įirst we need to render the editing area in an iframe, see the previous example. To enable the forms plugin, the CKEditor instance has to be running inside an iframe. Fix it by including your own copy of the default styles that do not scope the CSS rules to these classes. This configuration will break the default styling of the HTML fields because the default CSS rules are scoped to '.cke_wysiwyg_div.cke_editable' (so they only apply to the div). Use the following CKEditor configuration to render the editing area in an iframe instead of a div: However, some CKEditor customizations only work when the editing area is rendered in an iframe. with big document types or many open documents). Using divs makes the DOM lighter and results in better performance when many editors are instantiated (e.g. } Render the editing area in an iframe instead of a divīy default, Bloomreach Experience Manager uses the CKEditor plugin 'divarea' to render each editing area in a div instead of an iframe. RemovePlugins: 'sourcearea,sourcedialog,codemirror' Prevent users from editing the HTML source by removing the CKEditor plugins for source mode editing.

This page shows how to achieve common CKEditor customizations via configuration.

#Ckeditor toolbar items full#

#Ckeditor toolbar items how to#