WiscWeb CMS - Responsive Template (rst) - New Features of CK Editor

This document highlights the features available with the CK editor versus the default text editor. This option is only available in projects built in the responsive template.

Updated View

The most obvious difference between the CK Editor and default editor is the updated look and feel. The CK Editor's icons are much more modern and overall, the view is cleaner. Buttons are stacked in three rows instead of two and they appear slightly larger for easier clicking and viewing. The new editor also chooses standard dark gray icons to represent functions, versus the multi-colored options in the old editor.

Image of CK Editor Icons

Icon Differences

The following are a few of the noteworthy icon differences between the CK Editor and the Default Editor.

 Description  Default Editor Icon
 CK Editor Icon
Select All Button *NEW*
 Allows you to select all text in the editor
 None available
 Image of Select All Button
Show Blocks Button *NEW*
Blocks all content in the editor for easy viewing and content searching
 None available
 Image of Show Blocks Button
Insert Image Button
 Allows you to upload an image
 Image of Old Image Button  Image of Image Button
Insert Table Button
 Places a table in the text area
 Image of Old Table Button Image of Table Button
Insert Horizontal Line Button
 Places a horizontal line in the text area after your cursor
 Image of Old Horizontal Line Button Image of Horizontal Line Button
Insert/Edit Link Button
 Inserts a link into your text
 Old Insert or Edit Link Button Image of Insert or Edit Link Button
Remove Link Button
 Removes a link from text
 Image of Old Remove Link Button Image of Remove Link Button
Source Code/View Button
 Allows users to toggle between design view and source/code view.
 Image of Old Source Code Button Image of Source View Button

Source View Upgrades

There are a few changes to the source/code view that users will find extremely helpful. The first change is that users can switch to source view in Google Chrome when using CK Editor. This feature is currently not available in Chrome with the Default Editor. The second notable change is that the code in source view is much easier to peruse and edit due to its more indented layout. Below is an example of the new look.

Image of Source Code View

Changes to Inserting Images

The process of inserting images has changed slightly in CK Editor, but mostly for the better. Users will still place their cursor where they would like the image to appear and then click the image button. Here's where the changes come in. The properties view is quite different looking in CK Editor and there are a few very nice options.

Image of Image Properties

The most noteworthy change is the live preview of the image where you can demo changes immediately before saving. For example, in the image below, the image was resized, Hspace and Vspace were added, and it was aligned left so that text would flow around it. All of this is visible in the Preview box.

Image of Image Properties with Example

Changes to Inserting Links

As with the image properties box, the link properties box has a cleaner, more modern feel.

Image of Link Properties View

Another important change is that the type of link can now be chosen from a dropdown. For instance, those looking to link some text to another page in the CMS will choose to link a "Page from Management Server". Those looking to link an asset will choose "Asset from Management Server".

Image of Link Properties Dropdown

Changes to Inserting Tables

As you may have guessed, the process for adding and editing tables has also changed for the better. Firstly, the table properties buttons are available right at the top of the CK Editor (they used to be located in a table button dropdown). This makes tasks like adding a new row/column or deleting a row/column much more readily available.

Image of Table Properties Buttons

Additionally, the more updated view makes it easier to find and edit the elements of the table.

Image of Table Properties Box

Keywords:CK Editor Text Editor Responsive Template   Doc ID:59358
Owner:Jenna K.Group:WiscWeb CMS
Created:2016-01-06 13:13 CDTUpdated:2016-03-15 11:50 CDT
Sites:WiscWeb CMS
Feedback:  0   0