Skip to content
/ kirby-blaupause Public template

Kirby Blaupause: A Starter Template for Kirby CMS

Notifications You must be signed in to change notification settings

femundfilou/kirby-blaupause

Repository files navigation

Kirby Blaupause – Kirby CMS Starter Kit

Kirby Blaupause – A Template for Kirby CMS

This template is a starter for new projects, mainly developed out of personal needs and inspired by the awesome Kirby Baukausten. It's based on the tools and technologies we work with and might be an inspiration for others.

Frontend setup

The frontend uses pnpm, is built using Vite with lightingcss as css transformer and minifier. cleacss is preinstalled as css framework. Scripts are handled by Typescript, svelte and taxi are preconfigured if needed.

Preinstalled plugins

  • distantnative/retour-for-kirby
  • femundfilou/kirby-asset-manager
  • femundfilou/kirby-image-snippet
  • getkirby/cli
  • getkirby/staticache
  • lukaskleinschmidt/kirby-laravel-vite
  • tobimori/kirby-seo
  • genxbe/kirby3-ray
  • johannschopplich/kirby-plausible
  • bnomei/kirby3-dotenv

Prebuild blocks

This template comes with some prebuild blocks and block extensions.

  • Since we don't use the built-in layouts feature but rely on layout-blocks (see fullwidth.yml)
  • simple button block
  • spacer block to add clearances
  • video block that supports local videos
  • jumpmark as a target for buttons and links

Custom folder setup

This template uses a custom folder setup. The kirby installation is divided by two individual folders public and backend to keep kirby's internal files out of the domain root. Since we're often using pipelines to deploy website updates, the storage folder keeps all static things available, like content, accounts, sessions, logs and license, that don't always change on a website update.

The frontend is the last folder remaining and it's the home of all frontend source files. We're using Vite to build assets and a manifest.json to public/build, where they're consumed by kirby.

Getting started

  • Run nvm use to switch to the correct node version
  • Run pnpm install to install frontend dependencies
  • Run pnpm build to make an initial assets build
  • Run composer install to install backend dependencies
  • Optional: You can run kirby init to get rid of some of the boilerplate code and naming conventions. The script will guide you through the steps. You have to install the Kirby CLI (globally) to use that command.

License

MIT

Credits