fluid styled content - typo3 9.5 - how to get rid of gray header box?

Question

When I use my h1 and h2 styles in a text content element in typo3 9.5, they get nicely displayed as I want.

However when I use the header field of the element, I get this grey box and not my h1 format.

How can I configure typo3 to show h1 style there?

question from:https://stackoverflow.com/questions/65922186/typo3-9-5-how-to-get-rid-of-gray-header-box

Answer 1

If you use fluid styled content (FSC) or packages which are using FSC (like bootstrap package) you will find the templates of your content elements (CE) in these extensions, from where you can copy it to your site extension and after adding your path to the paths list your modified template is used to render that CE.

This is the typoscript configuration to modify the rendering of the extension bootstrap_package:

lib {
    contentElement {
        layoutRootPaths {
            // 0 = EXT:bootstrap_package/Resources/Private/Layouts/ContentElements/
            10 = EXT:my_site_extension/Resources/Private/Layouts/ContentElements/
        }
        partialRootPaths {
            // 0 = EXT:bootstrap_package/Resources/Private/Partials/ContentElements/
            10 = EXT:my_site_extension/Resources/Private/Partials/ContentElements/
        }
        templateRootPaths {
            // 0 = EXT:bootstrap_package/Resources/Private/Templates/ContentElements/
            10 = EXT:my_site_extension/Resources/Private/Templates/ContentElements/
        }
    }
}

The entries with 0 = are set by the ext:bootstrap_package (or similar by ext:fluid_styled_content) and show you the path to the templates which are used without your override.

The entries with 10 = (you could use any higher number to give preference to your templates) should show to the folders in your site extension (ext:my_site_extension), where you hold your modified copies.

You only need to copy templates you modify as the original paths are fallback to any template file which is referenced as template, layout or partial. Keep an eye on the paths as those files can be referenced with a (relative) path.

---

EDIT:

For FSC the rendering for a specific CE is done with a template of the same name in the template folder configured in typoscript (see above)

These files normally contain a call to the same layout file (Layouts/Default.html) which renders the header with the partial Header/All and different other html for spacing and anchors.

In the partial Header/All we have further partials which render the fields header, subheader and date if given with appropriate partials.

Note the additional arguments to these partials: layout, positionClass, link, default which will influence the appearance of the header.

Maybe your unusual appearance is given because there is a special header_layout in your records.
Or another extension already has overwritten the default templates (partials) to get those boxed headers instead of the h1-h6 HTML tags which are used in the FSC extension.