Working with Rich Text Editor - Custom Configuration, Toolbars and Plugins - Part 2

Modifying the Enter key (line breaking) behavior:

There was a question in the OTN forum asking if we could alter the default behavior of the ENTER key in the context of the CKEditor (RTE field) content area. Say, we want to change it to insert a line break <br/> element instead of the default paragraph <p> element?

We can refer to the following resource for the configuration change that is required:
Enter Key | CKEditor.com

In my previous post on CKEditor and RTE fields in PeopleSoft, I detailed how we can reference a custom configuration for RTE fields.

Assuming that we already have a custom configuration associated with our RTE field, we just need to add this line to our configuration (HTML) to change the ENTER key behavior to <br/> instead of <p>.

CKEDITOR.config.enterMode = CKEDITOR.ENTER_BR;

Setting a Default Style (Font) for the CKEditor:

There was also a follow up question asked which was removed by the author later. I am assuming that the author found a solution/workaround. But I have a copy of the question which describes the requirement.

If we enter any text in the Rich Text Editor as follows:

It gets stored in the database without any default styling:

This behavior might be desired in most cases but the requirement is to set a default font for the paragraph element so that it gets stored as follows (without users having to manually select the default font every time):

I tried to search for a custom configuration that allows us to set a default font to the editor and found the following useful resources:

http://ckeditor.com/forums/CKEditor-3.x/Setting-Default-Font-and-FontSize-Setting-Default-Labels
http://ckeditor.com/forums/CKEditor-3.x/CSS-style-sheet-for-content-area
http://ckeditor.com/forums/CKEditor-3.x/How-do-you-set-default-font-and-default-font-size
https://www.cotonti.com/forums?m=posts&q=6421

Based on a popular suggestion, I tried adding the following line to the custom RTE configuration:
CKEDITOR.config.font_defaultLabel = 'Arial';

But font_defaultLabel property only sets the default label for the Font in the RTE Toolbar but it does not affect the contents of the editor in any way unless we explicitly select the Font (manually).

The only workaround that I found was to write a 'script' to initialize a placeholder text and wrap it around a <span> attribute with the desired styling. This would make sure that the content area gets initialized with a default font.

Refer: http://stackoverflow.com/questions/16339258/ckeditor-4-how-to-set-default-font

I adjusted the 'script' to only trigger the default font initialization when there is no existing content in the editor (on add mode). This would ensure that we are not overwriting any of the existing contents with the placeholder text.

Script for reference:

CKEDITOR.on( 'instanceReady', function( ev ) {

     if (ev.editor.getData() == '') {
             ev.editor.setData('<span style="font-family:georgia,serif">PlaceHolder&nbsp;Text</span>');     
     };
});

Custom RTE Configuration:

Results - On Add Mode:

Results - After replacing the place holder text:

Results - Contents in the database:

Results - On Update Mode: