This module adds a syntax highlighting function to the tinyMCE editor.

This project bridges the wysiwyg module api, the tinyMCE editor and the syntaxhighlighter module. After installation of this module and its dependencies, you will be able to enable a syntax highlighting button in the tinyMCE rich text editor, which will provide code syntax highlighting support to your drupal published content.

The module has been tested with the latest Chrome, Firefox and IE8.

Note, when using IE8, the syntax highlighted blocks will be encoded as tags and not the {syntaxhighlighter} macro blocks. This is because it has been difficult to force IE to not collapse whitespace. You will still get syntax highlighted code blocks, but the HTML stored in the DB will be , not {syntaxhighlighter}

This module depends on the following components:
===============================

wysiwyg module (http://drupal.org/project/wysiwyg)
tinyMCE editor installed per wysiwyg instructions
syntaxhighlighter module (http://drupal.org/project/syntaxhighlighter)

How it works
========
The plugin will recognize 'PRE' style syntax highlighting blocks and '{}' macro style syntax blocks on your drupal page and will allow you to edit that code from within the tinyMCE editor.

When editing in tinyMCE, you can easily create new code syntax blocks, as well as edit pre-existing blocks (PRE-style or {}-style). Editing code that has already been highlighted should be done with in the syntax highlighting dialog popup only, as editing inside the main tinyMCE editor window can be problematic.

When saving the node, syntax blocks will be converted to {}-style macro blocks which will, in turn, be picked up by the syntaxhighlighter module and turned into syntax highlighted code blocks, EXCEPT on Internet Explorer, which will ALWAYS save blocks as PRE tags (they still get highlighted fine).

Project Information

Downloads