Make html source in CKEditor in Drupal 7 easier to read

CodeMirror can be installed to make the HTML source in CKEditor easier to read and maintain.

Tested with ckeditor_codemirror 7.1.2 and CKEditor-CodeMirror-Plugin 1.17.8.

cd sites/all/modules

drush dl ckeditor_codemirror

cd ../libraries

drush ccmd

Version 1.17.8 of the plugin differs from previous plugins. You may have to update the regular expression check in the module file to locate the version number so that install check will succeed.

If you get a “plugin not found” error on the Status report page, look at the ckeditor_codemirror.module file around line 18 and change:

'pattern' => '@version:\s+\'{0,1}([0-9a-zA-Z\.-]+)\'{0,1}@',


'pattern' => '@version:\s+[\'\"]{0,1}([0-9a-zA-Z\.-]+)[\'\"]{0,1}@',

Once installed, go to CKEditor settings, select a profile, and under Editor appearance select CodeMirror (Source) Syntax Highlighting.

The toolbar must contain the Source button.

Then, you will see