Syntax highlighter

This module integrates the SyntaxHighlighter Javascript Library into Drupal for source code list syntax highlighting within any Drupal contents.

Note: the Javascript Library is not included and must be downloaded and installed in sites/all/libraries. See README.txt for more details. This module is compatible with both the 2.x and 3.x versions of the Javascript library.

To markup your code, you can use this native <pre> tag format:

The native <pre> tag format is only suitable for the Full HTML format. This is because of the unusual class string format (i.e. class="brush:php;gutter:false"), both the HTML filter and the WYSIWYG Filter filter out the class string as something illegal and not allowed. The final output end up with no class attribute. The solution this problem is to enable the Syntaxhighlighter filter and use the filter format for markup:

If you use the 3.x library, you can make use of the optional title attribute using the full attribute assignment:

This filter format makes things compatible with the built-in HTML filter and the WYSIWYG Filter.

Very important!!!: ordered the input format filters as follow:

1. HTML filter or Wysiwyg filter or whatever HTML filter you use
2. Syntax highlighter
3. Line break converter

Note: using the filter format, you do not need to convert the < and > characters to HTML entity encoding as required by the JS lib. Just paste the code verbatim, the filter will take care of the conversion. However, with the <pre> raw tag format, you still have to do this.

TinyMCE wysiwyg editor integration:

• Wysiwyg editor module.
• Wysiwyg tinymce syntaxhighlighter integration module.

See #617758: Integration with wysiwyg module

Read this blog post on how to setup this.

Several key things to remember when setting this up:

1. Must enable the Syntax Highlighter tinyMCE plugin in the wysiwyg profile(s) (path admin/settings/wysiwyg.)
2. Must enable the Syntax Highlighter filter in the input format(s).
3. Re-arrange the filters to make sure the Syntax Highlighter filter is after the HTML filter or the wysiwyg_filter (if you use the tinyMCE editor, you really have no choice but to use the wysiwyg_filter)
4. In the HTML Filter or the wysiwyg_filter, allow the <pre> tag

See more details and a demo of this module.

Install the Multicolumncheckboxesradios module and the checkall module to enhance the settings form.

Alternative:

• GeSHi: performs syntax highlight rendering on the server side, whereas this module does rendering on the client browser.

Downloads