A headless Kirby CMS starter where everything is a block.
| If you want to… | This starter provides… |
|---|---|
| Build a headless Kirby + Nuxt site | Pre-configured Kirby Headless setup |
| Use Kirby's page structure as the source of truth | Block-first architecture with layouts |
| Avoid duplicating routes in your frontend | Single page query that works for all pages |
| Still use custom blueprints when needed | Flexibility to create custom Nuxt pages with KQL |
This starter is based on the Kirby Headless Starter and pairs with the Cacao Kit frontend.
Block-first approach: Every page-related component is a block. The frontend fetches the same page query for every page and renders blocks or layouts accordingly. The backend defines the content structure, so routing doesn't need to be re-implemented in the frontend.
You can also use custom Kirby fields in your blueprints and create dedicated Nuxt pages with custom KQL queries. See the about page for an example.
- PHP 8.2+
Kirby is not free software. However, you can try Kirby and the Starterkit on your local machine or on a test server as long as you need to make sure it is the right tool for your next project. … and when you’re convinced, buy your license.
Kirby-related dependencies are managed via Composer and located in the vendor directory. To install them, run:
composer installDuplicate the .env.development.example as .env:
cp .env.development.example .envIt's recommended to secure your API with a token. To do so, set the environment variable KIRBY_HEADLESS_API_TOKEN to a token string of your choice.
Also, to enable the preview button in the frontend, set the environment variable KIRBY_HEADLESS_FRONTEND_URL to the URL of your frontend deployment:
Tip
📖 Read the Cacao Kit frontend documentation or 📖 read the Kirby Headless Starter documentation, on which this starter is based.
By default, every page-related component is a block. The blocks field blueprint defines the blocks that are available for each page. It contains page-building blocks like a notes grid, and other custom blocks.
If you don't want to nest blocks, you can add Kirby's built-in block fieldsets to the blocks field blueprint.
- Create a new blueprint in
site/blueprints/blocks - Add the block to the
blocksfield blueprint - Follow the frontend block guide to create the matching component
Note
If the block contains a files field and you want to resolve image UUIDs to file objects, see the toResolvedBlocks() field method guide.
Note
See ploi-deploy.sh for exemplary deployment instructions.
Some hosting environments require uncommenting RewriteBase / in .htaccess to make site links work.
MIT License © 2023-PRESENT Johann Schopplich