README

This plugin for Kirby 5 replaces the block selector with a customized version that displays a preview image for each block.

Please note: If you are using Kirby 4, please install v2.1.0. If you are using Kirby 3, please install v1.1.2.

Installation

Download and copy this repository to /site/plugins/kirby-visual-block-selector.

composer require junohamburg/kirby-visual-block-selector

git submodule add https://github.com/junohamburg/kirby-visual-block-selector.git site/plugins/kirby-visual-block-selector

Create the block preview images in 480×270 pixel. The images are displayed in a fixed aspect ratio of 16/9.
Create the folder assets/block-previews.
Save the images in the assets/block-previews folder with the same name as the block. For example, the preview image of heading.yml is heading.png. Any image format (png, jpg, gif, svg) should work.

Tip: You can define fieldset groups for the blocks field: Kirby docs

⚠️ Please note: If there are no preview images for a blocks field, the default Kirby block selector will be displayed.

MIT