---
title: "Render.contentArea ViewHelper <f:render.contentArea>"
manual: "Fluid ViewHelper Reference"
version: "14.3"
permalink: "https://docs.typo3.org/permalink/t3viewhelper:typo3-fluid-render-contentarea@14.3"
source: "Global/Render/ContentArea.rst"
rendered: "2026-10-01T16:43:06+00:00"
---

# Render.contentArea ViewHelper `<f:render.contentArea>` {#typo3-fluid-render-contentarea}

<!-- TODO: no Markdown rendering for "versionadded" -->

Instead of using the <f:cObject> and <f:for> ViewHelpers to
render content areas, use the new <f:render.contentArea> ViewHelper.

This ViewHelper can be used to render a content area provided by the
page-content data processor.

It is commonly used with the PAGEVIEW
TypoScript content object.

Theme creators are encouraged to use the `<f:render.contentArea>` ViewHelper
to allow other extensions to modify the output via event listeners.

Go to the source code of this ViewHelper: [Render\\ContentAreaViewHelper.php (GitHub)](https://github.com/TYPO3/typo3/blob/main/typo3/sysext/fluid/Classes/ViewHelpers/Render/ContentAreaViewHelper.php).

**Table of contents**

-   [Rendering all content elements within a backend layout column](https://docs.typo3.org/permalink/t3viewhelper:rendering-all-content-elements-within-a-backend-layout-column@14.3)
-   [Using the "recordAs" argument to wrap each content element](https://docs.typo3.org/permalink/t3viewhelper:using-the-recordas-argument-to-wrap-each-content-element@14.3)
-   [Intercepting the rendering of content areas via an event](https://docs.typo3.org/permalink/t3viewhelper:intercepting-the-rendering-of-content-areas-via-an-event@14.3)
-   [Arguments of the <f:render.contentArea> ViewHelper](https://docs.typo3.org/permalink/t3viewhelper:arguments-of-the-f-render-contentarea-viewhelper@14.3)

## Rendering all content elements within a backend layout column {#typo3-fluid-render-contentarea-example}

The most common use case for the `<f:render.contentArea>` is to render all
content elements within a column from a backend layout.

**Fluid**

**packages/my_sitepackage/Resources/Private/Templates/Page/Default.fluid.html**

```html
<f:render.contentArea contentArea="{content.main}"/>
```

Or using inline syntax:

**packages/my_sitepackage/Resources/Private/Templates/Page/Default.fluid.html**

```html
{content.main -> f:render.contentArea()}
```

**TypoScript**

**packages/my_sitepackage/Configuration/Sets/main/setup.typoscript**

```typoscript
page = PAGE
page {
    10 = PAGEVIEW
    10 {
        paths.10 = EXT:my_sitepackage/Resources/Private/Templates/
        dataProcessing.10 = page-content
    }
}
```

For an example of how to configure the backend layout in page TSconfig
and further data processor options, see
Example: Use the page-content data processor to display the content.

## Using the "recordAs" argument to wrap each content element {#typo3-fluid-render-contentarea-example-recordas}

Using the [recordAs](https://docs.typo3.org/permalink/t3viewhelper:viewhelper-argument-typo3-cms-fluid-viewhelpers-render-contentareaviewhelper-recordas@14.3)
argument, `<f:render.contentArea>` can be combined with the
[Render.record ViewHelper \<f:render.record>](https://docs.typo3.org/permalink/t3viewhelper:typo3-fluid-render-record@14.3)
to wrap each content element:

**packages/my_sitepackage/Resources/Private/Templates/Page/Default.fluid.html**

```html
<div id="sidebar">
    <f:render.contentArea contentArea="{content.left}" recordAs="record">
        <div id="sidebarItem{record.uid}">
            <f:render.record record="{record}" />
        </div>
    </f:render.contentArea>
</div>
```

## Intercepting the rendering of content areas via an event {#typo3-fluid-render-contentarea-event}

Developers can intercept the rendering of content areas in Fluid templates using
`\TYPO3\CMS\Fluid\Event\ModifyRenderedContentAreaEvent` to modify output.

## Arguments of the `<f:render.contentArea>` ViewHelper {#typo3-fluid-render-contentarea-arguments}

-   **contentArea**

    -   *Type:* TYPO3\\CMS\\Core\\Page\\ContentArea

    A content area from the page-content processor

-   **recordAs**

    -   *Type:* string

    Name of the variable to store the current record in, if you want to use it in the before/after content.
