Editor: Block breaks editor

The CMS Questions
1

Hey,

I’ve been fiddling around a lot with the editor and keep running into issues unfortunately.
I just created another block plugin and it unfortunately breaks the whole editor. The usual editor area in the panel is simply replaced by a message saying ‘The field type “body” does not exist’

Screenshot 2020-01-02 at 19.10.52
Screenshot 2020-01-02 at 19.10.521684×188 4.48 KB

“Body” in this case refers to the underlying .yml file which looks like this.
(I know it’s that because if I change “body” to something else, the error message also changes)

fields:
  methods:
    type: text
    width: 1/2
  body:
    type: editor
    size: huge

However, I just cannot find the error in the block plugin I’ve created.

index.php

Kirby::plugin('smiddyburbon/card-block', [
    'snippets' => [
        'editor/card' => __DIR__ . '/snippets/card.php'
    ]
]);

index.js

editor.block("card", {
  extends: "paragraph",

  // will appear as title in the blocks dropdown
  label: "Card",

  // icon for the blocks dropdown
  icon: "text",
});

snippets/card.php

<p class="card"><?= $content ?></p>

I’ve already tried replacing the name “card” with something else but that didn’t help either. It’s really weird since I’ve created 4 or 5 other plugins before and that worked okay actually.
Could you please take a look?

Thank you, much appreciated.

Best,
Dennis

2

The issue is the loading order of plugins. In your case, with a plugin folder called card, this is loaded before the editor plugin itself, which then results in the error.

If you change the plugin’s folder name to something like editorcard-block, you can work around this issue.

3

Cool, this worked, thank you!

I noticed that I can’t make line breaks in any of the block plugins I created (by line break I mean Shift + Enter or <br />) – only new paragraphs but this will obviously create a new block. Do you by any chance know why?

4

No, I don’t. Line breaks work fine in the default paragraph block, though…

5

Yep, but that’s not enough for me. :frowning: Submitted an issue in Github as it doesn’t even work in the intro example block provided.
Thank you for your support!

6

I had a look at the source code, you have to add breaks: true to make it work:

editor.block("card", {
  extends: "paragraph",

  // will appear as title in the blocks dropdown
  label: "Card",

  // icon for the blocks dropdown
  icon: "text",
  breaks: true
});
1 Like
7

Oh, this is so awesome! Thanks a lot, this made my day – not exaggerating. :slight_smile:

1 Like