Battle of the Drupal 7 Modules: CKEditor vs WYSIWYG

February 1, 2012
CKEditor for Drupal logo

CKEditor is the WYSIWYG (What You See Is What You Get) editor of choice around the Digett office. While some may bemoan the use of a WYSIWYG editor at all, even an experienced developer can usually save a lot of time during content entry by using one. Drupal does not come with a built-in editor but there are many excellent options; CKEditor is the cream of the crop.

The CKEditor 3rd-party Software

There are always two parts to an HTML editor, the 3rd-party software and the Drupal module that integrates it with Drupal. As with any 3rd-party software, that component must be downloaded separately from its own site (not Drupal.org) and integrated with your Drupal site using a Drupal module downloaded from Drupal.org.

Some advantages of CKEditor over many of the other HTML editors available include:

  • Time-tested - CKEditor started out as FCKeditor in 2003.
  • Actively developed - There is a new incremental release at least every few months.
  • Popular - CKEditor/FCKeditor is by far the most used WYSIWYG editor on Drupal sites.
  • Extensible - There are many plugins specifically for Drupal that can be easily added. (e.g. IMCE, Media, Drupal Teaser Break, etc.)

Drupal Modules

Once you’ve reached the decision that CKEditor is your WYSIWYG of choice, you have two options for integrating it into your Drupal site.

  1. There is a module called Wysiwyg, which was built as a universal integration for all of the various HTML editors available for Drupal.
  2. The other module is called CKEditor - WYSIWYG HTML editor, and was designed to integrate only the CKEditor software into Drupal.

Wysiwyg Module

Since its creation, the Wysiwyg module has gained tremendous support as one of the most installed modules in all of Drupal. The feat that it accomplishes of allowing a site to use any WYSIWYG editor is impressive; it will even allow you to run multiple editors on the same site based on the input/text format chosen for a particular textarea. If you find yourself in need of this kind of feature, the WYSIWYG editor is the integration module for you.

CKEditor module

The CKEditor module (in the form of FCKeditor module) has been around since November 2006. Since it is specifically designed for the CKEditor HTML editor, the settings available are much more complete; nearly any setting that could be manipulated in the CKEditor config files is available in the user interface of this module. We find that it’s easier to setup and make adjustments with this module over the Wysiwg module. Some nice features are:

  • There is a drag and drop interface for the buttons that are displayed on the toolbar.
  • Each user can configure their own settings (if given permission).
  • The Styles select box can be added in each theme.
  • The editor is skinable.
  • Custom configuration settings can be added through the GUI.

Drupal 6 note from the project page: “In version 6.x users were forced to define the set of include/exclude rules based on the ID of textarea or the path to the page. In Drupal 7 things are [simplified]. All you have to do is to pick up the input formats where CKEditor should be enabled.”

Since the CKEditor module has so many settings, I highly recommend following the installation instructions in the README file that come with the module. There are some settings that need to be changed in the ‘Filtered HTML’ text format in order to make CKEditor function correctly and eliminate the need to give users permission to use the ‘Full HTML’ format.

Results

We have chosen to use the CKEditor module with all of our Drupal 7 installations. Until the WYSIWYG module catches up on the feature set the CKEditor module will keep going strong, and it will continue to be my recommendation. If you have experience with or opinions about either of these modules, let us know in the comments.

Comments

Few words on integration with

Few words on integration with media/link management modules would make comparison much better.

Have been using nothing but

Have been using nothing but CKEditor, even more so with Drupal 7 sites.

WYSIWYG API with CKEditor and TinyMCE didn't work well with the panels overlay whereas CKEditor module works a lot better.

Combined with IMCE it makes a pretty solid WYSIWYG interface although still falls shy of the Wordpress WYSIWYG editor which uses TinyMCE I believe.

Also the improved toolbar button chooser for CKEditor is great.

How much of a difference does

How much of a difference does Media & Link make?

As far as editors go I have always been very happy with CKeditor and dont know why I would need a framework to use others simultaneously.

I guess if the Media module makes a big difference it might warrant the move and sacrifice some CKeditor specific configuration options....

@mansspams &@Mark West: We

@mansspams &@Mark West: We use Media and Link modules with the CKEditor module. Seems to work fine. No issues here. In fact the integration is seamless.

I vote for using the WYSIWYG

I vote for using the WYSIWYG module.

Pingback

[...] 16.Battle of the Drupal 7 Modules: CKEditor vs WYSIWYG | Digett Feb 1, 2012 … CKEditor is the most commonly used HTML editor in Drupal, but each site … If you have experience with or opinions about either of these … http://www.digett.com/blog/02/01/2012/battle-drupal-7-modules-ckeditor-v... [...]

"There are some settings that

"There are some settings that need to be changed in the ‘Filtered HTML’ text format in order to make CKEditor function correctly..."

And there you mention the problem I have with CKeditor... It should function correctly from the start.

@Ron: We agree completely! We

@Ron: We agree completely! We have reversed our opinion and now favor the WYSIWYG module with CKEditor over the CKEditor module. I think a follow up post is in order to further go into our opinion reversal :)

While I'd previously been

While I'd previously been using CKEditor module and quite comfortable with installation, configuration, and tweaking, both for my own sites & that of clients & friends, there's one big thing that got me to switch over to Wysiwyg, and that is support for the Footnotes module, an essential must-have for the types of reference documents I'm frequently writing.