Selective Code Rendering to Support Gitlab Markdown

support
1

Heya -

I’m trying to render our Gitlab Flavoured Markdown files - with Hugo.

I thought I could write a theme that polyfills the mermaid and KaTeX functionality. Crucially - we do not want to change the syntax, as we use GL’s preview when writing new content.

Gitlab supports “math" and "mermaid” code blocks. I thought I could get it working by using javascript to hunt down these delimiters and replace the content accordingly - but I think HUGO uses server side preprocessing to convert these to formatted code blocks, before the JS has a chance.

My current option is to disable all code preprocessing and use a JS only solution for all - like prism or monaco, but would rather keep the preprocessing. Which leads me to the question - Is there a way to tell Hugo/BlackFriday to ignore certain code blocks - Ie. give it a list of ["math", "mermaid"] and the resulting output would keep the original formatting to allow the JS to process it instead?

Thanks,
W

1 Like
2

It’s not possible to tell Hugo to ignore some code blocks. But you can create a custom shortcode (see here for how), just like the default highlight shortcode. Then you use the regular code blocks for regular cases, and the custom shortcode to highlight the code that you’d otherwise want to tell Hugo to ignore.

In your case you probably want to use a special HTML class in that shortcode that your JavaScript syntax highlighter looks for.

3

Hey Jura - Thanks, I’ll likely open a feature request, as I don’t have the ability to change the markdown files.