Restrict editing options for default block type "text"

Kirby 3 Solved ✅
,
1

Hi there.

First of all, thank you for the great new block field in Kirby. I’m currently working on a website and would like to extend the default block type “text” so that only “bold” and “link” are available as editing options. Unfortunately, I haven’t found a way to do this. It also looks like the Default Vue Component is not made for it. With the “text” field (writer) for the default block type “heading”, for example, this works perfect!
Is there a reason why the restriction of this formatting option for the default block type “text” is apparently not intended, or am I doing something fundamentally wrong?

I’ve already tried this:

type: blocks 
filedsets:
    heading:
        .... # works perfect
    text:
        extends: blocks/text
        fields:
            text:
                marks: # doesn't work
                    - bold
                    - link

Ask for your support!
Greetings Robert

1 Like
2

You can overwrite the default text block blueprint, the same options as for the writer field should be available.

3

Hi texnixe,
thanks for your quick answer.

Unfortunately that’s the problem that it doesn’t seem to work. Overwriting works with the text in the heading block type and I think so with the writer field.
Only with the text block type it doesn’t work…

4

Have you actually tried with a blocks blueprint in /site/blueprints/blocks?

5

I have now created the file “text.yml” in the folder “site/blueprints/blocks” with the following content:

name: field.blocks.text.name
icon: text
preview: text
fields:
   text:
      type: writer
         nodes: false
         placeholder: field.blocks.text.placeholder
         marks:
            - bold
            - link

However, the restricted editing field is now only displayed in the pop-up window (on the right side when i’m editing the field). in the field itself I have the complete editor available…

6

Hi.

Has someone found a solution for this issue or does someone have the same problem?
In addition to the block for headlines, the restricted formatting options also work for the list element … unfortunately this does not seem to work for the text element. Am I doing something wrong, or is a solution planned?

Best regards,
Robert

7

Hello again …
I’m even working on a project where I want to restrict the formatting in the text element of the block field for the customer as I wrote it above. The project should go online this month. Is there a solution to my “problem”? Am I doing something wrong with expanding the text block?
Ask again for help or at least a hint.

Best regards,
Robert

8

Which version are you using?

9

The problem is that you can set the marks in a custom site/blueprints/blocks/text.yml blueprint and the changes are reflected when editing the field in the drawer.

name: field.blocks.text.name
icon: text
preview: text
fields:
  text:
    type: writer
    nodes: false
    placeholder: field.blocks.text.placeholder
    marks:
      - bold

However, the preview for the field ignores those blueprint settings. So I guess that you would have to overwrite the preview as well.

(Tested with 3.5.3)

10

@ byybora

Today I made an update today from 3.5.1 to 3.5.3

@ texnixe

This is my first project with Kirby. I have been working with ProcessWire for about 5 years (as already written in an other post) and before that I used Redaxo for my customer projects for about 5 years. However, I’ve been interested in Kirby for a long time, and personally I think the panel is awesome and kirby is today genearlly more suitable for my needs . With the new Blocks fields at the core, I have now decided to use Kirby as a preference for my customer projects.
So I’m not a total newcomer to CMS, but I would be very grateful for a short tip on how to overwrite the preview too… Everything is going really well with Kirby, but I currently don’t have the capacity to to get an even deeper insight into the Kirby documentation.

Best regards,
Robert

11

The basic documentation is here: Blocks | Kirby

However, you would also have to dive into the source code and look at the Text.vue. Looks, like something like this works:

index.js

panel.plugin("texnixe/blocks", {
  blocks: {
    text: `
    <template>
    <k-writer
      ref="input"
      :nodes="false"
      :marks="['bold', 'italic']"
      :value="content.text"
      class="k-block-type-text-input"
      @input="update({ text: $event })"
    />
  </template>
    `
  }
});

Although hardcoding the marks here is probably not a good idea, because you could end up with two different results for the drawer and the preview. But I don’t really know how to fetch the marks from the blueprint here.

Bildschirmfoto 2021-02-14 um 22.37.39
Bildschirmfoto 2021-02-14 um 22.37.39758×244 20 KB

And don’t forget the index.php to register the plugin.

1 Like
12

Thanks for your advice!

I’ve already read the documentation for blocks. I’ll have a deeper look at the part with the Text.vue and how to manage js files in a plugin asap. Maybe this function will soon be in the core anyway? It would be a pity if that only works for headlines and lists in the future …

Many thanks and best regards,
Robert

13

Here you go:

// site/plugins/better-text-block/index.js

panel.plugin("my/better-text-block", {
  blocks: {
    text: {
      computed: {
        placeholder() {
          return this.field("text", {}).placeholder;
        },
        marks() {
          return this.field("text", {}).marks;
        },
      },
      methods: {
        focus() {
          this.$refs.input.focus();
        }
      },
      template: `
        <k-writer
          ref="input"
          :nodes="false"
          :marks="marks"
          :placeholder="placeholder"
          :value="content.text"
          class="k-block-type-text-input"
          @input="update({ text: $event })"
        />
      `
    }
  }
});

This way the placeholder and marks will be dynamic.

FYI: I guess this will be fixed in the core very soon. Ahmed already added an issue here.

3 Likes
14

Awesome!
Thanks for your answer!

Robert