junohamburg / kirby-block-preview-fields
Kirby Block Preview Fields
Installs: 1 293
Dependents: 0
Suggesters: 0
Security: 0
Stars: 21
Watchers: 2
Forks: 2
Open Issues: 0
Language:JavaScript
Type:kirby-plugin
Requires
README
This plugin for Kirby 3 displays the block fields directly in the block preview, including tabs.
Inspired by the Kirby Fields Block, but this block preview supports tabs and the design aligns more closely with the Kirby UI.
Please note: In Kirby 4, there is now a native implementation of preview: fields
, see https://getkirby.com/releases/4.0#block-field-improvements.
Installation
Download
Download and copy this repository to /site/plugins/kirby-block-preview-fields
.
Composer
composer require junohamburg/kirby-block-preview-fields
Git submodule
git submodule add https://github.com/junohamburg/kirby-block-preview-fields.git site/plugins/kirby-block-preview-fields
Setup
In your custom block blueprint:
- Add
preview: fields
to display the block fields. - Add
wysiwyg: true
to prevent the drawer from opening automatically after creating a new block.
Example: site/blueprints/blocks/custom-block.yml
name: Block Name preview: fields wysiwyg: true tabs: content: label: Content fields: ... settings: label: Settings fields: ...
Available options
- Hide block icons. This is helpful if you are using our Kirby Visual Block Selector.
- Disable equal height tabs. By default, the largest tab sets the overall height, so there are no jumps when switching between tabs.
site/config/config.php
<?php return [ 'junohamburg.block-preview-fields' => [ 'icon' => false, // default: true 'equalHeightTabs' => false // default: true ], ];
Please note: These options apply to all block previews. It is currently not possible / very difficult to add custom options to block previews.
Known issues
- This block preview uses the
angle-down
icon to expand a collapsed block preview. The Kirbylayout
field uses theangle-down
icon to open a dropdown with options.
License
MIT