For the setup of this site, I knew that I needed a good way to display source code in stories. I assumed that Drupal would already have a good way to deal with source code in a post, but I found out that this required quite a lot of manual configuration. In addition to just displaying source code nicely, I wanted to be able to use source code in FCKeditor.
During my research, I came across a module called GeSHi Filter, which was exactly what I was looking for to display source code. This module integrates the third party PHP library GeSHi (Generic Syntax Highlighter) into Drupal. Installing this module was straightforward, except for the fact that the readme didn’t mention that I needed to activate the filter in Drupal’s input filters.
GeSHi takes care of displaying source code within the
In order to use the
There’s 2 caveats:
- In order for FCKeditor to not screw up the code after switching back to rich text editing mode, the following line needs to be added to fckeditor.config.js:
FCKConfig.ProtectedSource.Add( / /gi );
- According to the FCKeditor documentation, protected code is not being displayed at all in rich text mode. However, that code will be displayed when viewing the node.
Unfortunately, I wasn’t able to find a better way to integrate the two. This integration works for now, but I hope that the a future release of FCKeditor will offer a better method for source code highlighting.