How to use usage of Appearnce tab of Mask CE in TYPO3?

Question

How to use usage of Appearnce tab of Mask CE in TYPO3?

467 views Asked by biesior At 31 December 2024 at 11:50

When adding Mask content element it doesn't reflect some setting of the Appearance tab at front-end, like Layout, Frame, Space Before or After, also it doesn't include the uid of content element. How can I make usage of these fields?

Original Q&A

There are 2 answers

Markus On 25 August 2021 at 12:55

You can use the layouts like fluid_styled_content does - it takes care of headers, frames, spaceBefore, etc. This is also the easiest way.

First step: define the layout directories in TypoScript:

lib.maskContentElement.layoutRootPaths.5 = EXT:fluid_styled_content/Resources/Private/Layouts/
lib.maskContentElement.partialRootPaths.5 = EXT:fluid_styled_content/Resources/Private/Partials/

Second step: use the layout in your template:

<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
<f:layout name="Default" />

<f:section name="Main">

  <!-- your markup here -->

</f:section>

</html>

This also works for DCE (with corresponding TypoScript path)

Of course you can copy the layouts and partials to your theme path and make changes there, but I recommend sticking to the core functionality.

**biesior** · Accepted Answer · 2020-06-24T12:29:16+00:00

By default Mask elements do not use standard wrapping for rendering the content element, fortunately you can easily access them within data variable which contains array of tt_content.

To check what fields of tt_content are available just put the line in FE template of your Mask element:

<f:debug>{data}</f:debug>

So you can make the wrapper div by yourself using simple Fluid syntax

<div class="
        {f:if(condition: data.layout, then: 'frame-layout-{data.layout}')}
        {f:if(condition: data.frame_class, then: 'frame-{data.frame_class}')}
        {f:if(condition: data.space_before_class, then: 'frame-space-before-{data.space_before_class}')}
        {f:if(condition: data.space_after_class, then: 'frame-space-after-{data.space_after_class}')} ">

    <!-- your markup here -->
</div>

TechQA.

How to use usage of Appearnce tab of Mask CE in TYPO3?

There are 2 answers

Related Questions in TYPO3

Related Questions in TX-MASK

Related Questions in EXT-MASK

Popular Questions

Popular Tags

Trending Questions