99fad4c broke syntax highlighting via code injection

I’ve been using highlightjs via code-inject on my Ghost blog:

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-light.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>

This used to work fine, but I noticed that it’s been broken last few months (e.g. https://floatingsun.net/ghosting-medium/). Doing some debugging, I was able to trace this to this commit – Fix colors in code blocks · TryGhost/Casper@99fad4c · GitHub

Reverting that fixes the problem.

I’m guessing this impacts other highlighters as well. How are people solving this?

Version 1.22.2
Environment production
Database mysql
Casper version: 2.2.0

Have you tried inserting direct into <head> ?

Highlight.js does not have specific enough CSS to override Casper’s styles. You have a few options:

  1. Make changes to your theme (this is what themes are for after all :smile:)
  2. Switch to a different highlighting library. Prism.js works fine
  3. Fix highlight.js

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.