Gutenberg & Pre-formatted Templates: Core Block Attributes

admin管理员组

文章数量:1130349

The Gutenberg Handbook currently has a short entry for creating whole templates of blocks, e.g. used for Custom Post Types or just pre-formatting posts.

/

It seems to be missing a comprehensive overview of the core/-blocks though. Especially the available attributes are interesting here. Is there a reference-entry I am just missing?

To elaborate:

By playing around, I found out a few things. E.g. preformatted blocks do take the formatting of a php file like line breaks, indends and tabs, which makes them a bit sensitive..

array( 'core/preformatted', array(
                            'content' => 'Grundlegende Fakten:

Operator: Max Mustermann
Wo: City, Country
Wer: 99999 Kinder
Wieviel: 99999 Angestellte',
                            ) ),

This does translate into: (note that every tab or indent before later lines would have been taken over as well)

So - what other possibilities do i have to modify the 'content' and 'placeholder' attributes? Is there documentation anywhere? Can I make use of the fact that they are arrays and insert selectors or other html? Like .. This does NOT work:

array( 'core/preformatted', array(
    'content' => array('selector' => 'h1', 'content' => 'Does this do anything?'),
) ),

..But this does:

array( 'core/preformatted', array(
    'content' => array('Does', 'this', 'do', 'anything?'),
) ),

And where can I find a comprehensive list of first order attributes, since e.g it's not always clear whether a core/block will take a 'text'-string or a 'content'-array and so on..

The Gutenberg Handbook currently has a short entry for creating whole templates of blocks, e.g. used for Custom Post Types or just pre-formatting posts.

https://wordpress/gutenberg/handbook/templates/

It seems to be missing a comprehensive overview of the core/-blocks though. Especially the available attributes are interesting here. Is there a reference-entry I am just missing?

To elaborate:

By playing around, I found out a few things. E.g. preformatted blocks do take the formatting of a php file like line breaks, indends and tabs, which makes them a bit sensitive..

array( 'core/preformatted', array(
                            'content' => 'Grundlegende Fakten:

Operator: Max Mustermann
Wo: City, Country
Wer: 99999 Kinder
Wieviel: 99999 Angestellte',
                            ) ),

This does translate into: (note that every tab or indent before later lines would have been taken over as well)

So - what other possibilities do i have to modify the 'content' and 'placeholder' attributes? Is there documentation anywhere? Can I make use of the fact that they are arrays and insert selectors or other html? Like .. This does NOT work:

array( 'core/preformatted', array(
    'content' => array('selector' => 'h1', 'content' => 'Does this do anything?'),
) ),

..But this does:

array( 'core/preformatted', array(
    'content' => array('Does', 'this', 'do', 'anything?'),
) ),

And where can I find a comprehensive list of first order attributes, since e.g it's not always clear whether a core/block will take a 'text'-string or a 'content'-array and so on..

• templates
• block-editor
• documentation

Share Improve this question asked Nov 28, 2018 at 14:17 PlaynaryPlaynary 32533 silver badges1212 bronze badges 2

• I'm not sure what you're hoping to achieve by passing a dictionary array to content, what do you expect to happen if 'selector' => 'h1' worked? Keep in mind that the pre-formatted block has no UI for a built in h1 tag, it would be ebtter to just use a heading block. – Tom J Nowell ♦ Commented Nov 28, 2018 at 15:06
• Yeah, I figured that by now, but that's exactly what I was looking for: A place where I can look into the data structure of the core blocks to find out how exactly I can address them. To pass content as an array was something I found in an example some on obscure blog post and at first I thought there's a reason for it - but I couldn't find anything official on it. – Playnary Commented Nov 28, 2018 at 15:48

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 3

To partly answer my own question:

As mentioned in this git issue you can use

console.log(wp.blocks.getBlockTypes());

in the browser console after all the Gutenberg magic loaded (e.g. in the editor window of a post) to show all currently registered blocks, inluding their attributes.

---

Another Info-Source:

The Git-Project of Gutenberg holds all core blocks and their properties can be accessed by

Name-of-Block*/index.js

Then find: const blockAttributes =

The Gutenberg Handbook currently has a short entry for creating whole templates of blocks, e.g. used for Custom Post Types or just pre-formatting posts.

/

It seems to be missing a comprehensive overview of the core/-blocks though. Especially the available attributes are interesting here. Is there a reference-entry I am just missing?

To elaborate:

By playing around, I found out a few things. E.g. preformatted blocks do take the formatting of a php file like line breaks, indends and tabs, which makes them a bit sensitive..

array( 'core/preformatted', array(
                            'content' => 'Grundlegende Fakten:

Operator: Max Mustermann
Wo: City, Country
Wer: 99999 Kinder
Wieviel: 99999 Angestellte',
                            ) ),

This does translate into: (note that every tab or indent before later lines would have been taken over as well)

So - what other possibilities do i have to modify the 'content' and 'placeholder' attributes? Is there documentation anywhere? Can I make use of the fact that they are arrays and insert selectors or other html? Like .. This does NOT work:

array( 'core/preformatted', array(
    'content' => array('selector' => 'h1', 'content' => 'Does this do anything?'),
) ),

..But this does:

array( 'core/preformatted', array(
    'content' => array('Does', 'this', 'do', 'anything?'),
) ),

And where can I find a comprehensive list of first order attributes, since e.g it's not always clear whether a core/block will take a 'text'-string or a 'content'-array and so on..

The Gutenberg Handbook currently has a short entry for creating whole templates of blocks, e.g. used for Custom Post Types or just pre-formatting posts.

https://wordpress/gutenberg/handbook/templates/

It seems to be missing a comprehensive overview of the core/-blocks though. Especially the available attributes are interesting here. Is there a reference-entry I am just missing?

To elaborate:

By playing around, I found out a few things. E.g. preformatted blocks do take the formatting of a php file like line breaks, indends and tabs, which makes them a bit sensitive..

array( 'core/preformatted', array(
                            'content' => 'Grundlegende Fakten:

Operator: Max Mustermann
Wo: City, Country
Wer: 99999 Kinder
Wieviel: 99999 Angestellte',
                            ) ),

This does translate into: (note that every tab or indent before later lines would have been taken over as well)

So - what other possibilities do i have to modify the 'content' and 'placeholder' attributes? Is there documentation anywhere? Can I make use of the fact that they are arrays and insert selectors or other html? Like .. This does NOT work:

array( 'core/preformatted', array(
    'content' => array('selector' => 'h1', 'content' => 'Does this do anything?'),
) ),

..But this does:

array( 'core/preformatted', array(
    'content' => array('Does', 'this', 'do', 'anything?'),
) ),

And where can I find a comprehensive list of first order attributes, since e.g it's not always clear whether a core/block will take a 'text'-string or a 'content'-array and so on..

• templates
• block-editor
• documentation

Share Improve this question asked Nov 28, 2018 at 14:17 PlaynaryPlaynary 32533 silver badges1212 bronze badges 2

• I'm not sure what you're hoping to achieve by passing a dictionary array to content, what do you expect to happen if 'selector' => 'h1' worked? Keep in mind that the pre-formatted block has no UI for a built in h1 tag, it would be ebtter to just use a heading block. – Tom J Nowell ♦ Commented Nov 28, 2018 at 15:06
• Yeah, I figured that by now, but that's exactly what I was looking for: A place where I can look into the data structure of the core blocks to find out how exactly I can address them. To pass content as an array was something I found in an example some on obscure blog post and at first I thought there's a reason for it - but I couldn't find anything official on it. – Playnary Commented Nov 28, 2018 at 15:48

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 3

To partly answer my own question:

As mentioned in this git issue you can use

console.log(wp.blocks.getBlockTypes());

in the browser console after all the Gutenberg magic loaded (e.g. in the editor window of a post) to show all currently registered blocks, inluding their attributes.

---

Another Info-Source:

The Git-Project of Gutenberg holds all core blocks and their properties can be accessed by

Name-of-Block*/index.js

Then find: const blockAttributes =

本文标签： Gutenberg amp Preformatted Templates Core Block Attributes