Getting the code highlighter to work

[dubs]

Hi everyone,

I'm trying to use the syntax highlighting apparently available for the "code" content element. I can see when you have a code element in an article Contao loads some extra stylesheets. What I can't get it to do is to actually trigger the highlighting. I'd expect a snippet of Javascript somewhere, in the same way that slimbox scans for lightbox links, but I can't see anything and no highlighting is happening.

Has anyone else got the code highlighter to work, and if so what's the trick to this? Do certain mootools scripts need to be included in the template, etc?

Thanks!
H.

[Ruud]

It indeed uses javascript to highlight the code. However, I tested this in Contao 3.0.6 in which you do not need to include any Mootools or jQuery... What version of Contao are you using?

Can you create a new layout and use the default template. Then create a new page that uses the new layout. Add code highlighter there. If that works you can introduce all other elements you have in the other page untill the code highlighter stops working. Then you've found the culprit and you can start debugging.

[dubs]

Hi Ruud, thanks for your reply.

I got to the bottom of the problem in the end. I'm using the 2.9 branch of Contao and there's a known issue where when you include a code element using an insert tag rather than inside an article natively. In that case Contao doesn't include the necessary headers to make the code highlighter work.

My workaround was to include in the containing page an extra but hidden code element. I'd hide it by assigning it an invisible CSS class and just put one dummy line of code in. This is enough to trigger contao to correctly include the highlighting CSS and Javascript. Alternatively I could have added the code in universally to the page template.

Cheers,
dubs.

[Ruud]

Good workaround, to sum up with Contao lingo; you added the code content element via a contao insert tag. That does not include the required js code in the html. There are at least two workarounds.

1. Add a code content element in an article on the same page
2. Add the js that the code content element would normally generate the the page template (fe_page.html5)