PHPackages                             junohamburg/kirby-block-preview-fields - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility &amp; Helpers](/categories/utility)
4. /
5. junohamburg/kirby-block-preview-fields

AbandonedArchivedKirby-plugin[Utility &amp; Helpers](/categories/utility)

junohamburg/kirby-block-preview-fields
======================================

Kirby Block Preview Fields

1.0.7(2y ago)201.4k1MITJavaScript

Since May 2Pushed 2y ago2 watchersCompare

[ Source](https://github.com/junohamburg/kirby-block-preview-fields)[ Packagist](https://packagist.org/packages/junohamburg/kirby-block-preview-fields)[ RSS](/packages/junohamburg-kirby-block-preview-fields/feed)WikiDiscussions main Synced 1mo ago

READMEChangelog (8)Dependencies (1)Versions (9)Used By (0)

Kirby Block Preview Fields
==========================

[](#kirby-block-preview-fields)

This plugin for **Kirby 3** displays the block fields directly in the block preview, including tabs.

[![Block Preview Fields](https://private-user-images.githubusercontent.com/77532479/237324191-39e559e4-f342-4110-b915-fcaf5fa5e095.jpg?jwt=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3NzUxMTkzNTQsIm5iZiI6MTc3NTExOTA1NCwicGF0aCI6Ii83NzUzMjQ3OS8yMzczMjQxOTEtMzllNTU5ZTQtZjM0Mi00MTEwLWI5MTUtZmNhZjVmYTVlMDk1LmpwZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNjA0MDIlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjYwNDAyVDA4MzczNFomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTE5YTkwODZjYjE1NGY4ZDgwMzNhZjFlZmUwOWQ0NTkyNDhhZDU5ZWNlM2ZhYThhMWE1MzEyMzA3ZTdmOTA1MWEmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.MduELxQSthhew7O038lk-dgtrmcaK8WGCf6Zuh9FVhg)](https://private-user-images.githubusercontent.com/77532479/237324191-39e559e4-f342-4110-b915-fcaf5fa5e095.jpg?jwt=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3NzUxMTkzNTQsIm5iZiI6MTc3NTExOTA1NCwicGF0aCI6Ii83NzUzMjQ3OS8yMzczMjQxOTEtMzllNTU5ZTQtZjM0Mi00MTEwLWI5MTUtZmNhZjVmYTVlMDk1LmpwZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNjA0MDIlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjYwNDAyVDA4MzczNFomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTE5YTkwODZjYjE1NGY4ZDgwMzNhZjFlZmUwOWQ0NTkyNDhhZDU5ZWNlM2ZhYThhMWE1MzEyMzA3ZTdmOTA1MWEmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0In0.MduELxQSthhew7O038lk-dgtrmcaK8WGCf6Zuh9FVhg)

Inspired by the [Kirby Fields Block](https://github.com/jongacnik/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 .

Installation
------------

[](#installation)

### Download

[](#download)

Download and copy this repository to `/site/plugins/kirby-block-preview-fields`.

### Composer

[](#composer)

```
composer require junohamburg/kirby-block-preview-fields

```

### Git submodule

[](#git-submodule)

```
git submodule add https://github.com/junohamburg/kirby-block-preview-fields.git site/plugins/kirby-block-preview-fields

```

Setup
-----

[](#setup)

In your custom block blueprint:

1. Add `preview: fields` to display the block fields.
2. 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
-----------------

[](#available-options)

1. **Hide block icons**. This is helpful if you are using our [Kirby Visual Block Selector](https://github.com/junohamburg/kirby-visual-block-selector).
2. **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**

```
