I hoping to be able to use the toha theme for my website, but syntax highlighting with styles from the gallery is not working correctly. The
monokai theme looks fine but other styles are definitely not correct.
Since the author is too busy to fix all of the issues with this popular theme, is there a way I can track down the problem
.css myself and try to fix it? Or else how can I use the
markup.highlight.noClasses = false setting and use my own generated
Here is the relevant part of my
config.yaml for the site:
Here is what the syntax highlighting looks like with the
Instead of using Hugo’s built-in syntax highlighter (chroma), the toha theme performs syntax highlighting via highlight.js. That means that the
markup.highlight settings in your site configuration are irrelevant.
Either use a different theme, or override the following templates by copying them to your project’s layout directory (retain the relative path):
In each of the files above, remove the lines referring to highlight.js (there are two in each file: one stylesheet, and one script).
For the posts, it seems that the first one is relevant:
However, as soon as I turn off the highlighting, extra space is added at the start messing up the code block. This is especially visible with line numbering on:
There should not be an empty line at the top of the code.
Any idea why this is happening?
Not without seeing your code.
Please post a link to the public repository for your project.
Let us see your code
Include a link to the source code repository of your project, because we really need the context of seeing your templates and partials to be able to help you. It is trivial to do a quick
git clone on your repo, then run
hugo server in your project, to help you out. On the other hand, recreating your code from screenshots, or sort of guessing at it, is not.
If you can’t share your repository for whatever reason, consider creating a dummy repo that you can share, which reproduces the problem you’re experiencing.
OK, got it.
The is the repo with a minimal example.
Here is the deployed example (for now).
I noticed this is dependent on the Hugo version. Before I set the version in
netlify.toml to match my local hugo, it was “less bad” but still not correctly rendered.
Yes, that fixed it. The fixed webpage is has been pushed to the repo.
I’m not a web developer (obviously) but I was surprised that this seemed to make no difference in the developer tools display of the
This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.