I'm trying to simply change a few things regarding the code highlighting in my Jekyll pages on github and have been unable to get anything to work.
After reading a lot of pages/questions, I've tried:
- Adding various random seeming scss files (_base.scss, _highlights.scss, _syntax_highlighting.scss)
.highlight {
...
}
- Adding main.css and syntax.css
---
# Some Jekyll nonsense... (not needed in other scss files).
---
@import "syntax";
- Adding the following snippet to _config.yml
# Jekyll 3 now only supports Kramdown for Markdown
kramdown:
# Use GitHub flavored markdown, including triple backtick fenced code blocks
input: GFM
# Jekyll 3 and GitHub Pages now only support rouge for syntax highlighting
syntax_highlighter: rouge
syntax_highlighter_opts:
# Use existing pygments syntax highlighting css
css_class: 'highlight'
sass:
style: compressed
I've looked at: Jekyll Import Syntax Highlighting Colour Scheme But this didn't work when I tried it and isn't what I'm after (just c&p whole files doesn't feel like real solution to me). I suspect this answer is out-of-date now but I have no way to know for sure.
The main issue is that I've never found documentation that just explains, to a Jekyll n00b, what the basic processing steps are. So I've got zero intuition of what to change were to affect things.
For example:
- Do I need to copy all of the theme I'm using (just-the-docs) before any modifications will take effect?
- Can I add just one
.scssfile and have the system inherit the remaining ones? - Is adding
main.cssenough to trigger it being processed or do I need to change how I run Jekyll? - Is the fact I'm using the
just-the-docstheme messing up my ability to change code highlighting?
All in all it's very poor documented and most "answers" to questions I've found boil down to telling people to cut & paste X into Y (and since Jekyll seems to have had some breaking changes between versions a lot of these don't age well).
The pages are at: https://github.com/hagbard/the-flogger-manual/tree/main/docs https://hagbard.github.io/the-flogger-manual/
I'm just using standard triple-backticks + language to specify a code block (though some pages suggest other approaches, but again I suspect they are out-of-date).
Ideally I'd want to be able to easily download and install one of the color schemes in: http://jwarby.github.io/jekyll-pygments-themes/languages/javascript.html
but even just getting one small thing to change in the syntax highlighting would probably be enough to get me started.