CODEWITHSUNDEEP
cssgithubjekyllsyntax-highlightinggithub-pages
DaveRGP
DaveRGP

Reputation: 1480

What have I missed in jekyll and github pages to make syntax highlighting work?

Disclaimer: This is my first ever website project, in order to learn about html, css etc. I probably need a 'for idiots' guide'

I have a jekyll/github pages site here. I have read the jekyll documentation here, which suggests all you need to do is stick the liquid tag in. Which I have, for example here.

Further research has pointed out I need to set up my config file, like this which I have here. I also have a .css I copied from a site called sciviews which is here and I've made a link into the .css to call it here.

However, my page still displays in black on white in code blocks. What have I missed?

EDIT: I believe I've made another error, the source of my syntac .css was (i think) here. Is .scss maybe not compatible with this process as I've implemented it?

Upvotes: 1

Views: 331

Answers (1)

elad.chen
elad.chen

Reputation: 2425

In your html ( inside the head tag ), you are referencing an incorrect path to "syntax.css"

Change:

<link rel="stylesheet" href="/css/syntax.css" type="text/css">

To:

<link rel="stylesheet" href="/Pokemon_FieldStudies/css/syntax.css" type="text/css">

Edit

Following your edit, it seems the code inside syntax.css is a raw scss file. Such files need to be processed before they could be served to the client.

I suggest you read about SCSS and how to compile it ( A simple google search will yield more than enough tutorials ).

In case you're interested in a shortcut, you can use an online compiler such as http://www.sassmeister.com/ but that will require you to define a value for some of the missing variables defined in the scss file.

Upvotes: 5

Related Questions