PGrid and CGrid doesnt render

Question

i'm using TYPO3 6.2.7 with all the newest Versions of Flux, VHS, fluidcontent and fluidpages.

The Pages Template im using, doesnt render the Content Areas in the Backend. It only shows the default TYPO3 Columns.

This is my Template for the frontpage.

{namespace v=Tx_Vhs_ViewHelpers}
{namespace flux=FluidTYPO3\Flux\ViewHelpers}
<f:layout name="FrontPage" />
<div xmlns="http://www.w3.org/1999/xhtml" lang="en"
 xmlns:v="http://fedext.net/ns/vhs/ViewHelpers"
 xmlns:flux="http://fedext.net/ns/flux/ViewHelpers"
 xmlns:f="http://typo3.org/ns/fluid/ViewHelpers">

<f:section name="Configuration">
<flux:form id="frontpage" label="Startseite">

    <flux:grid>
        <flux:grid.row>
            <flux:grid.column colPos="0" name="content" />
        </flux:grid.row>
    </flux:grid>

</flux:form>

</f:section>

<f:section name="Resources">
    <f:render partial="headerData" section="frontpage" />
</f:section>

<f:section name="Content">
    <v:content.render column="0" />
</f:section>

<f:section name="Header">
    <f:render partial="Header" />
</f:section>

</div>

And also there is a problem with a element im using with fluidcontent. It should be a simple box where you can input some other content. But the "Add Content" Button doesnt show up in the backend. This is some code from the template.

{namespace flux=FluidTYPO3\Flux\ViewHelpers}
<f:layout name="content" />
<div xmlns="http://www.w3.org/1999/xhtml"
 xmlns:flux="http://fedext.net/ns/flux/ViewHelpers"
 xmlns:f="http://typo3.org/ns/fluid/ViewHelpers">

<f:section name="Configuration">
<flux:form id="contentbox" options="{group: 'Fluid FCEs', icon: '../typo3conf/ext/sw_fluidfce/Resources/Public/Icons/shadowbox.gif'}" label="Flexible Contentbox" description="Very flexible contentbox. You can just set a padding arround a text or create a shadowbox. You can also create a Header Box or a Link Box.">
    <flux:field.checkbox name="shadow" label="Create a shadow" />
    <flux:field.checkbox name="nomargin" label="No Margin (Abstand nach unten)" />
    <flux:field.checkbox name="nopadding" label="No Padding (Abstand nach innen)" />
</flux:form>
<flux:grid>
    <flux:grid.row>
        <flux:grid.column name="content" colPos="0" label="Content inner" />
    </flux:grid.row>
</flux:grid>
</f:section>

<f:section name="Preview">
<b>Flexible Contentbox</b>
{f:if(condition: '{shadow} == "1"', then: '<br />Wirft Schatten')}
{f:if(condition: '{nomargin} == "1"', then: '<br />Kein Margin (Abstand nach unten)')}
{f:if(condition: '{nopadding} == "1"', then: '<br />Kein Padding (Abstand nach innen)')}
<flux:widget.grid />
</f:section>

<f:section name="Main">

<div class="fce_contentbox {f:if(condition: '{shadow} == "1"', then: 'shadowbox shadow')} {f:if(condition: '{nomargin} == "1"', then: 'nomargin')}">
    <div class="fce_contentbox_inner {f:if(condition: '{nopadding} == "1"', then: 'nopadding')}">
        <flux:content.render area="content" />
    </div>
</div>

</f:section>

</div>

You know what could be the problem? I tried some older versions of flux etc. but it didnt fixed the problems.

Best regards, Sören

Answer 1

Regarding the page layout:

If it shows the default TYPO3 columns, you probably did not select the fluidpages backend layout in the page record. In recent fedext/TYPO3 versions, you need to edit the properties of your root page and set both "Backend Layout (this page only)" and "Backend Layout (subpages of this page)" to "Fluidpages" in the "Appearance" tab.

Regarding the content element:

<flux:form.content> is not needed/allowed in the grid. <flux:grid.column> takes care of everything automatically. You have to organize it like this:

<f:section name="Configuration">
    <flux:form>
        [...]
        <flux:grid>
            <flux:grid.row>
                <flux:grid.column colPos="0" name="main" />
            </flux:grid.row>
        </flux:grid>
    </flux:form>
</f:section>

Additionally, you have to provide a preview section that displays the grid in the BE. Ex:

<f:section name="Preview">
    <flux:widget.grid />
</f:section>

or shorter:

<f:section name="Configuration">
    <flux:form>
        [...]
        <flux:form.content name="main" />
    </flux:form>
</f:section>

<flux:form.content> is the short-hand syntax for a grid with one row and one column with colPos 0.