Home » Getting started » Configuring » General » Configure the HTML editor
Three modules (Web Publishing, Product Catalog, and Newsletter) uses its own editor and therefore it is possible to configure it separately. Litium Studio 4.5.2 has a new editor (CKEditor) with better performance loading than the old FCKEditor used in previous versions. The size of the CKEditor can be adjusted by the user which can be useful when editor is placed in a grid.
- Configuration is done with the new format that is used in ck-editor (the old files from fck-editor cannot be used).
- webSiteId is the ID for the website without dash (-) and brackets ({ or })
Define your own configuration
When defining your own configuration for a site you should use a configuration-file for the module:
- Styles sets are configured in /Site/module/Editor/config.js
- CMS can have different configuration files for each website, webSiteId is used in the file name
If /site/CMS/Editor/config_[websiteid].js exists this file will be loaded instead of the above file.
Define your own styles
When defining your own styles for a site you should use the style-set name “litium” in a configuration-file for the module (configuration is done as it is described in http://docs.cksource.com/CKEditor_3.x/Developers_Guide/Styles)
- Styles sets are configured in /Site/module/Editor/styles.js
- CMS can have different configuration files for each website, webSiteId is used in filename.
If /site/CMS/Editor/styles_[websiteid].js exists this file will be loaded instead of file above.
CKEDITOR.stylesSet.add( 'litium',
[
// Block-level styles
{ name : 'Blue Title', element : 'h2', styles : { 'color' : 'Blue' } },
{ name : 'Red Title' , element : 'h3', styles : { 'color' : 'Red' } },
// Inline styles
{ name : 'CSS Style', element : 'span', attributes : { 'class' : 'my_style' } },
{ name : 'Marker: Yellow', element : 'span', styles : { 'background-color' : 'Yellow' } }
]);
Define your own templates
When defining your own templates for a site you should use the template-set name “default” in a configuration-file for the module (configuration is done as it is described in http://docs.cksource.com/CKEditor_3.x/Developers_Guide/Templates)
- Templates are configured in /Site/module/Editor/templates.js with template-name default
- CMS can have different configuration files for each website, webSiteId is used in filename.
If /site/CMS/Editor/templates _[websiteid].js exists this file will be loaded instead of file above.
// Register a template definition set named "default".
CKEDITOR.addTemplates( 'default',
{
// The name of the subfolder that contains the preview images of the templates.
imagesPath : CKEDITOR.getUrl( CKEDITOR.plugins.getPath( 'templates' ) + 'templates/images/' ),
// Template definitions.
templates :
[
{
title: 'My Template 1',
image: 'template1.gif',
description: 'Description of My Template 1.',
html:
'<h2>Template 1</h2>' +
'<p><img src="/logo.png" style="float:left" />Type your text here.</p>'
},
{
title: 'My Template 2',
html:
'<h3>Template 2</h3>' +
'<p>Type your text here.</p>'
}
] });
Define your own content style sheet (CSS)
When defining your own content style sheets for a site you should use the stylesheet-file for the module.
- Styles are configured in /Site/module/Editor/editor.css
- CMS can have different configuration files for each website, webSiteId is used in filename.
If /site/CMS/Editor/editor_[websiteid].css exists this file will be loaded instead of file above.
Comments made
No comments are made
You need to be logged in to make a comment