PHPackages                             johannschopplich/kirby-highlighter - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. johannschopplich/kirby-highlighter

AbandonedArchivedKirby-plugin

johannschopplich/kirby-highlighter
==================================

Server-side syntax highlighting for Kirby CMS

3.2.0(1y ago)212.3k4[2 issues](https://github.com/johannschopplich/kirby-highlighter/issues)MITPHP

Since Jul 19Pushed 1y ago2 watchersCompare

[ Source](https://github.com/johannschopplich/kirby-highlighter)[ Packagist](https://packagist.org/packages/johannschopplich/kirby-highlighter)[ Docs](https://github.com/johannschopplich/kirby-highlighter#readme)[ RSS](/packages/johannschopplich-kirby-highlighter/feed)WikiDiscussions main Synced 1mo ago

READMEChangelog (10)Dependencies (5)Versions (22)Used By (0)

Note

This package is deprecated in favor of [Kirby Code Highlighter](https://github.com/bogdancondorachi/kirby-code-highlighter) – powered by [Phiki](https://github.com/phikiphp/phiki), that uses TextMate grammars and VS Code themes to generate syntax-highlighted code within Kirby's code block and KirbyText.

Kirby Highlighter
=================

[](#kirby-highlighter)

Server-side code highlighting available as [custom block](https://getkirby.com/docs/reference/panel/fields/blocks) and for [KirbyText](https://getkirby.com/docs/guide/content/text-formatting#kirbytext).

Built upon [highlight.php](http://www.highlightjs.org) which itself is a port of [highlight.js](http://www.highlightjs.org).

Key Features
------------

[](#key-features)

- 🏗 Works with Kirby's [`code` block](https://getkirby.com/docs/reference/panel/blocks/code)
- 🏳️‍🌈 Supports 189 languages
- 💫 94 styles available
- ⛳️ Automatic language detection for KirbyText

Requirements
------------

[](#requirements)

- Kirby 3.8+

Installation
------------

[](#installation)

### Composer

[](#composer)

```
composer require johannschopplich/kirby-highlighter
```

### Download

[](#download)

Download and copy this repository to `/site/plugins/kirby-highlighter`.

Usage
-----

[](#usage)

### With Kirby Blocks Field

[](#with-kirby-blocks-field)

This plugin overwrites Kirby's internal [`code` block](https://getkirby.com/docs/reference/panel/blocks/code). Thus, you won't have to change a thing.

Use the `code` block just like before, the output will be highlighted automatically:

```
fields:
    example:
        label: Paste code here
        type: blocks
        fieldsets:
            - code
```

### Within KirbyText

[](#within-kirbytext)

Create a code block in your KirbyText field and optionally set the code language:

```
```css
.currentColor {
  color: currentColor;
}
```

```

Or use the new `code`-KirbyTag from this plugin with a base64 encoded code string:

```
(code: LmN1cnJlbnRDb2xvciB7CiAgY29sb3I6IGN1cnJlbnRDb2xvcjsKfQ== lang: css)

```

Which outputs:

```
.currentColor {
    color: currentColor;
}
```

The syntax highlighting functionality can be changed. You can choose between two highlighting modes:

1. Explicit mode (default)
2. Automatic language detection mode (opt-in)

#### Explicit Mode

[](#explicit-mode)

In explicit mode, you have to define which language the code block is. Otherwise highlighting will be skipped.

#### Automatic Language Detection

[](#automatic-language-detection)

Alternatively you can use the automatic detection mode, which highlights your code with the language the library thinks is best. It is highly recommended you explicitly choose the language or limit the number of languages to automatically detect from. This reduces the number of inaccuracies and skips this extremely inefficient selection process.

To enable automatic language detection, set:

- `johannschopplich.highlighter.autodetect` to `true`
- `johannschopplich.highlighter.languages` to an array of names from which languages should be chosen

Options
-------

[](#options)

Option DefaultDescription`johannschopplich.highlighter.class``hljs`Style class for Highlight to be added to the `pre` element.`johannschopplich.highlighter.autodetect``false`Indicates if the library should define which language thinks is best. Only applies when no language was set on the KirbyText code block.`johannschopplich.highlighter.languages``[]`Array of language names to be auto-detected. If empty, every language will be auto-detectable.`johannschopplich.highlighter.line-numbering``false`Indicates if the library should split up the highlighted code on each new line and wrap it in a `` element.`johannschopplich.highlighter.line-numbering-class``hljs-code-line`CSS class applied to highlighted code lines, respectively `` elements.Styling in the Frontend
-----------------------

[](#styling-in-the-frontend)

Since this plugin handles highlighting code only and thus just wraps span's around code, you have to link styles in your frontend yourself. I recommend choosing one of the available themes directly from the highlight.js project: [highlight.js/src/styles/](https://github.com/highlightjs/highlight.js/tree/master/src/styles)

The CSS files over at the repository are maintained and new ones arrive from time to time, therefore it would be redundant to include a copy in this repository.

One of my favorite themes is [Night Owl by Sarah Drasner](https://github.com/highlightjs/highlight.js/blob/master/src/styles/night-owl.css). For example you could download the CSS file and save it in your Kirby project under `assets/css/hljs-night-owl.css`. Now you just have to include it in your template ``. Alternatively, use a CSS bundler of your choice.

### Line Numbering

[](#line-numbering)

If you choose to activate the line numbering option, you will need to include additional CSS style to display line numbering.

A basic example using [pseudo-elements](https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-elements):

```
pre.hljs .hljs-code-line {
    counter-increment: line;
}

pre.hljs .hljs-code-line::before {
    content: counter(line);
    display: inline-block;
    margin-right: 1em;
    opacity: 0.5;
}
```

Credits
-------

[](#credits)

- Geert Bergman and contributors for the awesome [highlight.php](https://github.com/scrivo/highlight.php) port.
- Martin Folkers for his [Kirby Highlight](https://github.com/S1SYPHOS/kirby3-highlight) plugin which built the base of this package.

License
-------

[](#license)

[MIT](./LICENSE) License © 2020-PRESENT [Johann Schopplich](https://github.com/johannschopplich)

###  Health Score

41

—

FairBetter than 89% of packages

Maintenance39

Infrequent updates — may be unmaintained

Popularity30

Limited adoption so far

Community17

Small or concentrated contributor base

Maturity64

Established project with proven stability

 Bus Factor1

Top contributor holds 88.9% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~73 days

Recently: every ~144 days

Total

21

Last Release

663d ago

Major Versions

v1.4.1 → v2.0.02021-09-02

2.1.0 → 3.0.02022-12-18

### Community

Maintainers

![](https://www.gravatar.com/avatar/b9be5bf8dd3a36f63c00f92a115f1109567745fb3b068617341ffc8a90755d6c?d=identicon)[johannschopplich](/maintainers/johannschopplich)

---

Top Contributors

[![johannschopplich](https://avatars.githubusercontent.com/u/27850750?v=4)](https://github.com/johannschopplich "johannschopplich (64 commits)")[![bogdancondorachi](https://avatars.githubusercontent.com/u/39380741?v=4)](https://github.com/bogdancondorachi "bogdancondorachi (3 commits)")[![FabienYt](https://avatars.githubusercontent.com/u/101272997?v=4)](https://github.com/FabienYt "FabienYt (1 commits)")[![bnomei](https://avatars.githubusercontent.com/u/3265642?v=4)](https://github.com/bnomei "bnomei (1 commits)")[![mtsknn](https://avatars.githubusercontent.com/u/2226144?v=4)](https://github.com/mtsknn "mtsknn (1 commits)")[![ro-ka](https://avatars.githubusercontent.com/u/840022?v=4)](https://github.com/ro-ka "ro-ka (1 commits)")[![schrockwell](https://avatars.githubusercontent.com/u/30214?v=4)](https://github.com/schrockwell "schrockwell (1 commits)")

---

Tags

kirbykirby-cmskirby-pluginkirby-themekirby4kirby5highlightkirbyhighlighterhljs

###  Code Quality

TestsPHPUnit

Code StylePHP CS Fixer

### Embed Badge

![Health badge](/badges/johannschopplich-kirby-highlighter/health.svg)

```
[![Health](https://phpackages.com/badges/johannschopplich-kirby-highlighter/health.svg)](https://phpackages.com/packages/johannschopplich-kirby-highlighter)
```

###  Alternatives

[getkirby/cms

The Kirby core

1.5k535.5k352](/packages/getkirby-cms)[mzur/kirby-uniform

A versatile Kirby plugin to handle web form actions.

26068.3k13](/packages/mzur-kirby-uniform)[easybook/geshi

GeSHi - Generic Syntax Highlighter. This is an unmodified port of GeSHi project code found on SourceForge.

211.0M10](/packages/easybook-geshi)[bnomei/kirby3-dotenv

Kirby Plugin for environment variables from .env

4144.1k1](/packages/bnomei-kirby3-dotenv)[tobimori/kirby-icon-field

A simple Icon field plugin for Kirby CMS

5117.1k1](/packages/tobimori-kirby-icon-field)[tobimori/kirby-tailwind-merge

Tailwind Merge for Kirby CMS

276.3k](/packages/tobimori-kirby-tailwind-merge)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)