Syntax Highlighting

Code blocks in Markdown are automatically syntax highlighted.

Usage

Use fenced code blocks with a language identifier:

```javascript
function greet(name) {
  console.log(`Hello, ${name}!`);
}
```

Supported Languages

Common languages:

Language	Identifiers
JavaScript	javascript, js
TypeScript	typescript, ts
Python	python, py
Ruby	ruby, rb
Go	go, golang
Rust	rust, rs
Crystal	crystal, cr
HTML	html
CSS	css
JSON	json
YAML	yaml, yml
TOML	toml
Markdown	markdown, md
Shell	bash, sh, shell
SQL	sql

Configuration

Configure in config.toml:

[highlight]
enabled = true
theme = "github-dark"
use_cdn = true

Key	Type	Default	Description
enabled	bool	true	Enable syntax highlighting
theme	string	"github"	Highlight.js theme name
use_cdn	bool	true	Load assets from CDN (false = local files)

Themes

Hwaro uses Highlight.js themes. Any valid Highlight.js theme name works. Popular choices:

github — Light GitHub style (default)
github-dark — Dark GitHub style
github-dark-dimmed — Dimmed dark GitHub style
monokai — Classic dark theme
dracula — Dark purple theme
solarized-dark — Solarized dark
solarized-light — Solarized light
nord — Arctic color palette
tokyo-night-dark — Tokyo Night dark

Browse all available themes at highlightjs.org/demo.

CDN vs Local

When use_cdn = true (default), assets are loaded from cdnjs:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/github-dark.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>

When use_cdn = false, assets are loaded from local paths:

<link rel="stylesheet" href="/assets/css/highlight/github-dark.min.css">
<script src="/assets/js/highlight.min.js"></script>

You must provide the local files yourself when using use_cdn = false.

Template Integration

Include highlighting assets in templates:

<head>
  {{ highlight_css | safe }}
</head>
<body>
  ...
  {{ highlight_js | safe }}
</body>

Or combined:

<head>
  {{ highlight_tags | safe }}
</head>

Build Options

Disable highlighting for faster builds:

hwaro build --skip-highlighting

Plain Text Blocks

For no highlighting, omit the language or use text:

```text
Plain text content
No highlighting applied
```

Inline Code

Inline code uses backticks and is not highlighted:

Use the `console.log()` function.