README

This Kirby plugin adds a welcoming font picker to the Panel so editors can drop in a favorite web font without touching code. It focuses on simplicity, opinionated defaults, and privacy-friendly integrations like Bunny Fonts to keep typography tweaks approachable for anyone working with predefined templates or themes.

Installation

Composer

composer require lemmon/kirby-fontpicker

Git Submodule

git submodule add https://github.com/lemmon/kirby-plugin-fontpicker.git site/plugins/fontpicker

Manual

Download the plugin and extract it to /site/plugins/fontpicker.

Usage

Add the field to a blueprint and configure defaults as needed:

fields:
    website_font:
        label: Website Font
        type: fontpicker

Use the stored value to inject fonts and CSS variables in your templates or snippets. A typical pattern is to inject the link tag in a snippet used by head.php and share variables via Kirby’s global data or site options.

<?php if ($font = $page->website_font())->isValidFont(): ?>
  <link rel="preconnect" href="https://fonts.bunny.net">
  <link rel="stylesheet" href="<?= $font->toFontStylesheetUrl() ?>">
  <style>
    :root {
      --website-font: "<?= $font->toFontFamilyName() ?>";
    }
  </style>
<?php endif; ?>

Reference the shared variable in your styles (fallback to theme defaults when unset):

html {
    font-family: var(--website-font, var(--default-font));
}

Configuration

Option	Default	Purpose
`lemmon.fontpicker.weights`	`null`	Restrict the Bunny weights emitted in the stylesheet URL. Leave `null` to request every available weight; set to values like `[400, 700]` to keep the CSS lean.
`lemmon.fontpicker.cacheTtl`	`10080`	Cache the Bunny catalog for the given number of minutes (default seven days). Set to `0` to skip caching.
`lemmon.fontpicker.includeItalics`	`true`	Control whether italic variants are requested when available. Set to `false` to emit upright styles only (fonts with no upright style still include italics for safety).
`lemmon.fontpicker.disableRemoteCatalog`	`false`	Skip fetching `https://fonts.bunny.net/list` and rely solely on the bundled catalog snapshot. Useful for offline or air-gapped environments.

License

MIT License. See LICENSE for details.

Questions, issues, or ideas? File them in the repository or reach out; this plugin is designed to be extended.

Roadmap

Let editors enter a simple font name or slug instead of a full URL.
Build a Panel preview that renders the selected font inline for quick feedback.
Add a command to refresh the Bunny catalog cache on demand.
Extend toFontStylesheetUrl() with optional weights and italics parameters for per-slot overrides.
Surface validation errors in the Panel when a font selection cannot be resolved, with actionable guidance.
Offer variable-style font choices once Bunny Fonts makes them dependable.
Combine multiple font selections into a single Bunny stylesheet link for leaner page heads.

lemmon / kirby-fontpicker

Maintainers

Details