---
title: "Slot ViewHelper <f:slot>"
manual: "Fluid Explained"
version: "main"
permalink: "https://docs.typo3.org/permalink/fluid:typo3fluid-fluid-slot"
source: "ViewHelpers/Fluid/Slot.rst"
rendered: "2026-10-08T14:12:40+00:00"
---

# Slot ViewHelper `<f:slot>` {#typo3fluid-fluid-slot}

> [!NOTE]
> This reference is part of the documentation of Fluid Standalone.
> If you are working with Fluid in TYPO3 CMS, please refer to
> [TYPO3's ViewHelper reference](https://docs.typo3.org/other/typo3/view-helper-reference/14.3/en-us/Global/Slot.html) instead.

`f:slot` allows a template that is called as a component to access and render
the child content of the calling component tag. This makes nesting of components
possible.

Most importantly, the `f:slot` ViewHelper makes sure that the right level of
HTML escaping happens automatically, in line with the escaping in other parts of
Fluid: If HTML is used directly, it is not escaped. However, if a variable is
used within the child content that contains a HTML string, that HTML is escaped
because it might be from an unknown source.

In combination with the [\<f:fragment> ViewHelper](https://docs.typo3.org/permalink/fluid:typo3fluid-fluid-fragment),
multiple slots can be used in one component.

If a slot is defined, this ViewHelper will always attempt to return a string,
regardless of the original type of the content. If a slot is not defined, the
ViewHelper will return `null`.

## Basic Example {#basic-example}

If the following template `Text.html`:

```xml
<f:argument name="title" type="string" />

<div class="textComponent">
    <h2>{title}</h2>
    <div class="textComponent__content">
        <f:slot />
    </div>
</div>
```

is rendered with the following component call:

```xml
<my:text title="My title">
    <p>My first paragraph</p>
    <p>My second paragraph</p>
</my:text>
```

it will result in the following output:

```xml
<div class="textComponent">
    <h2>My title</h2>
    <div class="textComponent__content">
        <p>My first paragraph</p>
        <p>My second paragraph</p>
    </div>
</div>
```

## Escaping Example {#escaping-example}

If the same component is called like this:

```xml
<f:variable name="htmlString">
    <p>My first paragraph</p>
    <p>My second paragraph</p>
</f:variable>
<my:text title="My title">{htmlString}</my:text>
```

it would result in escaped HTML:

```xml
<div class="textComponent">
    <h2>My title</h2>
    <div class="textComponent__content">
        &lt;p&gt;My first paragraph&lt;/p&gt;
        &lt;p&gt;My second paragraph&lt;/p&gt;
    </div>
</div>
```

If you want to avoid escaping in this use case, you need to use `f:format.raw` on
the variable when it's passed to the component. Please be aware that depending on
the source of the input, this might have security implications!

## Component Nesting Example {#component-nesting-example}

Nesting of multiple components is possible. The following template `Paragraphs.html`:

```xml
<p>My first paragraph</p>
<p>My second paragraph</p>
```

can be called as a component and nested into the text component described above:

```xml
<my:text title="My title">
    <my:paragraphs />
</my:text>
```

which would lead to unescaped output, since components are always expected to return HTML:

```xml
<div class="textComponent">
    <h2>My title</h2>
    <div class="textComponent__content">
        <p>My first paragraph</p>
        <p>My second paragraph</p>
    </div>
</div>
```

## Multiple Named Slots {#multiple-named-slots}

If the following template `TextMedia.html`:

```xml
<f:argument name="title" type="string" />

<div class="textMediaComponent">
    <h2>{title}</h2>
    <div class="textMediaComponent__media">
        <f:slot name="media" />
    </div>
    <div class="textMediaComponent__content">
        <f:slot name="content" />
    </div>
</div>
```

is rendered with the following component call:

```xml
<my:textMedia title="My title">
    <f:fragment name="media">
        <img src="path/to/image.jpg" alt="..." />
    </f:fragment>
    <f:fragment name="content">
        <p>My first paragraph</p>
        <p>My second paragraph</p>
    </f:fragment>
</my:textMedia>
```

it will result in the following output:

```xml
<div class="textMediaComponent">
    <h2>My title</h2>
    <div class="textMediaComponent__media">
        <img src="path/to/image.jpg" alt="..." />
    </div>
    <div class="textMediaComponent__content">
        <p>My first paragraph</p>
        <p>My second paragraph</p>
    </div>
</div>
```

Go to the source code of this ViewHelper: [SlotViewHelper.php (GitHub)](https://github.com/TYPO3/Fluid/blob/main/src/ViewHelpers/SlotViewHelper.php).

**Arguments**

The following arguments are available for the slot ViewHelper:

-   **name**

    -   *Type:* string
    -   *Default:* 'default'

    Name of the slot, can be omitted for default slot