Jekyll: div class not in CSS

I am currently building a blog using the Jekyll static site generator and Github Pages. I would like to eventually work directly on the CSS and HTML and get rid of Jekyll altogether.

In one of the div elements in my site I see that the class language-plaintext is assigned. However this class does not occur in the CSS. Where does this class come from ?

Answer

The language-plaintext class is applied to Markdown code blocks [1] by Jekyll build process. An example of Markdown code block

```
Hello World!
```

Jekyll provides a pluggable system [2] for giving code blocks CSS styling based on the code block language (e.g JavaScript, Python). I believe this code highlighting feature is what uses the language-plaintext class.

Here is an example with javascript code block

```javascript
hello world
```

generates

<div class="language-javascript highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="nx">hello</span> <span class="nx">world</span>

Note the class="language-javascript

[1] https://www.markdownguide.org/extended-syntax/#fenced-code-blocks

[2] https://jekyllrb.com/docs/configuration/markdown/

Leave a Reply

Your email address will not be published. Required fields are marked *