Installation

Composer

composer require twtgroup/headliner

The extension can also be installed from the TYPO3 Extension Repository.

Add the site set

Add the site set twtgroup/headliner to your site, in Sites > Setup or in the configuration of the site:

config/sites/<identifier>/config.yaml

dependencies:
  - twtgroup/headliner

fluid_styled_content is optional:

With it (add its set to the site as well, typo3/fluid-styled-content) the site set overrides the header partial, so the tags and CSS classes of the content elements of the core come from the fields of Headliner. The set loads fluid_styled_content before itself, whatever the order in the site.
Without it (only Content Blocks, say, or templates of your own) the set has the site settings and the page TSconfig and changes no template: the tags in the frontend come from the ViewHelpers headliner:headline and headliner:headline.values in your own templates (see Your own templates). Nothing is reported or logged. The box in the page module works the same.

Installing the package alone changes nothing in the frontend: the site set is what changes the header partial. The new fields Tag and Subheader tag are in the form of the content elements and the box is in the page module as soon as the package is installed, but without the site set the fields have no effect in the frontend, and the box shows the headings as labels, without a select.

Clear the caches after you add the set: the site sets and the TypoScript are cached, and until then the box can show headers of fluid_styled_content as if they came from the text of the element (badge RTE).

Note

This is about the set for fluid_styled_content. Content that was created before the extension is installed has no tag: the field Tag is empty, which is the choice From the layout (as before). It keeps the behaviour of fluid_styled_content (layout 1 to 6 means H1 to H6), so existing pages do not change until an editor chooses a tag. The database column has an empty default for this, so adding it changes nothing in the existing content.

The same holds for the subheader: for content without a tag it is one level below its header, as in fluid_styled_content (layout 1 gives an h2, layout 3 an h4). The one difference is a subheader under the layout 6, which fluid_styled_content makes an h3 and headliner a div, because nothing is below H6. The markup of every header gets the class ce-headline-layout-N in addition, which changes nothing unless your CSS uses it (it was compared for the layouts 0 to 6).

Once an editor chooses a tag, the subheader follows it: under an h1 it is an h2, under an h3 an h4, unless Subheader tag says otherwise.

Note

A theme that renders its headers with partials of its own, such as typo3/theme-camino, ignores the fields for those elements. See Themes with their own header templates (Camino) for what that means and how to hide the fields for them.

Database

The new fields are created from the TCA, no ext_tables.sql is needed. Run Admin Tools > Maintenance > Analyze Database Structure (or vendor/bin/typo3 extension:setup) once after the installation.