> ## Documentation Index
> Fetch the complete documentation index at: https://prismeai-legacy.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# BlocksList Block

> Display a group of blocks.

## Minimal usage

```yaml theme={null}
# Page/Block
- slug: BlocksList
  blocks:
    - slug: RichText
      content: Hello
    - slug: RichText
      content: World
```

This block allows to group many blocks in a same container that you can style in
css to have them displayed in column or row. It's just a div.

[Demo](https://demo.pages.prisme.ai/en/BlocksList#minimal-usage)

### Display blocks as a row

```yaml theme={null}
# Page/Block
- slug: BlocksList
  blocks:
    - slug: RichText
      content: Hello
    - slug: RichText
      content: World
  css: |-
    :block {
      display: flex;
      flex-direction: row;
    }
```

[Demo](https://demo.pages.prisme.ai/en/BlocksList#blocks-as-row)

## Advanced usage

`tag` is the name of the html tag containing child blocks. Default is a div.
It can take any valid html tag and `fragment`.
This one generate a HTML Fragment, which don't add any tag in DOM.

Displays an unordered list:

```yaml theme={null}
# Page/Block
- slug: BlocksList
  tag: ul
  blocks:
    - slug: RichText
      tag: li
      content: Hello
    - slug: RichText
      tag: li
      content: World
```

Displays only two parapgaphes:

```yaml theme={null}
# Page/Block
- slug: BlocksList
  tag: fragment
  blocks:
    - slug: RichText
      content: Hello
    - slug: RichText
      content: World
```

[Demo](https://demo.pages.prisme.ai/en/BlocksList#advanced-usage)