tinyMCE - adding a class to the 'pre' format

[neildaemond]

i wanted to use SyntaxHighlighter(http://alexgorbatchev.com/SyntaxHighlighter/manual/installation.html) on my page.

The section of code to be highlighted should be wrapped with the <pre> tag, but also with a class like:

<pre class="brush: js">code</pre>

I know selecting the 'pre' format form the dropdox box will surround my text with <pre>,  but is there a way to add more options to that dropbox which will also add the appropriate class?

Thanks in advance,

[ryan]

There are a way to do it with TinyMCE only (using styleselect in the buttons1, using theme_advanced_styles and modifying TinyMCE content.css), but I think it's simpler just to apply it at render time in ProcessWire, like this:

$page->body = str_replace("<pre>", "<pre class='brush: js'>", $page->body); 

You could do that before outputting your $page->body field.

[neildaemond]

A nice and simple solution!

And I guess if I want to be able to select different 'brush' classes, then I'd have to go the way you mentioned... "(using styleselect in the buttons1, using theme_advanced_styles and modifying TinyMCE content.css)"

I ended up just sticking with the basic <pre> tag, however... BUT, perhaps when I start blogging more about code, I'll look back into syntax highlighting.. and update this post with my results.

Thanks again!