A more user (and developer) friendly FCKEditor

Login to vote

One of the selling points of a content management system has always been “If you can use Microsoft Word, you can maintain a website.” FCKEditor is one of the primary touch points customers will use to interact with your Kentico application and if it isn’t tuned properly you and your customer will get frustrated. Ideally we spend some time to educate the customer on basic HTML (which if you’re looking for training, DATA, Inc. has incredible online Kentico training) but in the end what they see on screen is what they expect. This WYSIWYG approach has to be balanced with well formed HTML.

Following are a few simple tweaks I’d recommend implementing before any site content is loaded.

  1. By default in FCKEditor, hitting Enter inserts a <br /> tag while Shift + Enter inserts <p> whereas Microsoft Word does the opposite. To correct this open /CMSAdminControls/FCKeditor/fckconfig.js and search for the following two lines (usually around lines 210 - 216) and update them as such:

    FCKConfig.EnterMode = 'p';         // p | div | br
    FCKConfig.ShiftEnterMode = 'br';     // p | div | br
  2. Approximately 80 lines lower in the same fckconfig.js, update the following configuration as below:

    FCKConfig.CustomStyles =

    We’re removing this custom style so that we can organize all of our custom style configurations in one place.

  3. In the same folder (/CMSAdminControls/FCKeditor/) open fckstyles.xml. This file can be combed through and any styles you think are extraneous should be removed. I’ll often remove “Marker: Yellow” and “Marker: Green” and leave the rest.

    I’ll also add a custom style like below and reference it in my stylesheet to have some text stand out.

Posted by Josh Gipper on 5/31/2011 11:12:51 AM
Filed under: CSS, FCKEditor, HTML, WYSIWYG
just be aware of updates of kentico if they change something on this files. there is no cool solution to make it update friendly.
7/28/2011 5:42:01 AM