Rouge inserts <pre> tag and highlights code in index.html "for" loop

I have been working to clean up my templates and move all layouts to inherit from the file default.html. I use Rouge to highlight code and have found that it will consistently insert a <highlight> tag or preformatted block inside the posts “for loop” on my index.html when the site is generated.

As a result, extra markup appears in each entry and class attributes used to style them are rejected.

Is this a bug in Rouge or how should go about I changing my layouts to remove this markup?

I’m guessing the first screenshot is from a Markdown file? In Markdown, indenting by 4 spaces signals a code block. Removing the spaces would avoid the problem.

1 Like

Oy.

I should have noticed this, as I only indented in this way to make the distinction clear between Liquid and regular HTML.

Note to self: Blindly copying a loop may be quicker, but pay attention - there be dragons.

1 Like