Configure the HTML editor

  • 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.

In path /Site/Editor you can also create a javascript-file named globalConfig.js that will be executed together with all the other configuration files to be able to set site specific settings, example the "CKEDITOR.config.allowedContent = true;" to tell the editor to not strip away non text formatting html-tags like script.

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.ckeditor.com/#!/guide/dev_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.

Is this page helpful?
Thank you for your feedback!