From 9933b920f9fe6041a506d735cba7d938fc066864 Mon Sep 17 00:00:00 2001 From: Ricardo Artemio Morales Date: Sun, 16 Jun 2024 20:05:28 +0200 Subject: [PATCH] Clarify what is needed to get the example working --- .../block-tutorial/extending-the-query-loop-block.md | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/docs/how-to-guides/block-tutorial/extending-the-query-loop-block.md b/docs/how-to-guides/block-tutorial/extending-the-query-loop-block.md index bf48c5db4e9bb9..9e7d9f311b836a 100644 --- a/docs/how-to-guides/block-tutorial/extending-the-query-loop-block.md +++ b/docs/how-to-guides/block-tutorial/extending-the-query-loop-block.md @@ -14,7 +14,7 @@ With the block variations API you can provide the default settings that make the Let's go on a journey, for example, of setting up a variation for a plugin which registers a `book` [custom post type](https://developer.wordpress.org/plugins/post-types/). -### Offer sensible defaults +### 1. Offer sensible defaults Your first step would be to create a variation which will be set up in such a way to provide a block variation which will display by default a list of books instead of blog posts. The full variation code will look something like this: @@ -91,7 +91,9 @@ In this way, your block will show up just like any other block while the user is At this point, your custom variation will be virtually indistinguishable from a stand-alone block. Completely branded to your plugin, easy to discover and directly available to the user as a drop in. -### Customize your variation layout +However, your query loop variation won't work just yet — we still need to define a layout so that it can render properly. + +### 2. Customize your variation layout Please note that the Query Loop block supports `'block'` as a string in the `scope` property. In theory, that's to allow the variation to be picked up after inserting the block itself. Read more about the Block Variation Picker [here](https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-variation-picker/README.md). @@ -125,7 +127,7 @@ In order for a variation to be connected to another Query Loop variation we need For example, if we have a Query Loop variation exposed to the inserter(`scope: ['inserter']`) with the name `products`, we can connect a scoped `block` variation by setting its `namespace` attribute to `['products']`. If the user selects this variation after having clicked `Start blank`, the namespace attribute will be overridden by the main inserter variation. -### Making Gutenberg recognize your variation +### 3. Making Gutenberg recognize your variation There is one slight problem you might have realized after implementing this variation: while it is transparent to the user as they are inserting it, Gutenberg will still recognize the variation as a Query Loop block at its core and so, after its insertion, it will show up as a Query Loop block in the tree view of the editor, for instance.