---
type: open_source
id: 4bwsx3izozie328d
title: Callouts (Kirby CMS Plugin)
url: >
  https://www.jakubpelak.com/opensource/callouts-kirby-cms-plugin
section: projects
package: kirby-plugin-callouts
repository: >
  https://github.com/lemmon/kirby-plugin-callouts
---

# Callouts (Kirby CMS Plugin)

Bring GitHub-style callouts (a.k.a. admonitions) to Kirby using the familiar `[!TYPE]` Markdown syntax. Your editors keep writing Markdown or KirbyText, and your site gets polished, theme-ready callouts.

I’ve built this plugin because, while Kirby’s Blocks field is great for structured layouts, I often prefer writing pure Markdown. Callouts make long-form content easier to scan and more expressive without leaving the keyboard. I first needed them for writing documentation on [tablo.supply](https://tablo.supply/), and I couldn’t find any existing implementation for Kirby.

> [!NOTE]
> The plugin actually powers this note. It scans your Markdown for `[!TYPE]` patterns and turns them into BEM-structured HTML elements.

Under the hood, it extends KirbyText parsing and performs a lightweight pass for callouts while leaving the rest to Kirby’s own Markdown engine. The output is theme-agnostic and uses predictable class names like `callout--note` or `callout--warning`. Two optional default styles are included, but you’re free to replace them entirely.

The syntax is identical to GitHub’s admonitions. You just start a blockquote with a type tag:

```markdown
> [!TIP]
> You can use any callout type you want — even custom ones like `[!COFFEE]` — and style them however your theme requires.
```

Although most useful in documentation or knowledge-base content, callouts can enhance almost any type of text. In future versions, I plan to include a dedicated Callout block for the Blocks field, translations, and optional Tailwind support. For now, you can already insert them inside Markdown blocks.

Head over to [github.com/lemmon/kirby-plugin-callouts](https://github.com/lemmon/kirby-plugin-callouts), drop it into your Kirby project, and watch your Markdown stand out with a bit more character.
