Markdown Highlight

Addon by Rias.be

Markdown Highlight Main Screenshot

Icon

Latest Version

Markdown Highlight

Markdown Syntax Highlighting for Statamic 3.

This Addon provides pre-rendered syntax highlighting based on Shiki, so no need for any extra JavaScript to get some color in your code samples!

Screenshot

Installation

Require it using Composer.

composer require rias/statamic-markdown-highlight

In your project, you should have the JavaScript package shiki installed. You can install it via npm

npm install shiki

or Yarn

yarn add shiki

Using Markdown Highlight

Fieldtype

Add the fieldtype to your fieldset.

sections:
  main:
    display: Main
    fields:
      -
        handle: code
        field:
          type: markdown_highlight
          display: Code

For other options, this fieldtype extends the default Statamic Markdown fieldtype.

Highlighting lines and other functionalities

Under the hood this package uses spatie/commonmark-shiki-highlighter, you can read those docs to see what else is possible.


Brought to you by Rias