Learn about the top 2016 CMS trends. Read on.

Customizing the TYPO3 header layout options is an old topic, but one that’s still valid today. Yesterday, I was having to look up modifying the header layout for a barebones site to add in a special header styling option. Since finding the answer took looking at a few resources, I thought I’d share my findings.

Root Page TSConfig

TCEFORM.tt_content.header_layout {
	altLabels {
		1 = 1st Heading
		2 = 2nd Heading
		3 = 3rd Heading
		4 = 4th Heading
		5 = 5th Heading

	addItems {
		10 = Special 1st Heading

Special 1st Heading TypoScript Setup

lib.stdheader.10.10 < lib.stdheader.10.1
lib.stdheader.10.10 {
  dataWrap = <h1{register:headerStyle}{register:headerClass}><span class="special">|</span></h1>

The important thing to keep in mind when adding, removing or modifying the TSConfig or TypoScript is to keep the keys like 1, 2, …, 10 consistent between the two. The index is how you know which is which.


  • css_styled_content / static / setup.txt

What’s your favorite TYPO3 header_layout customization?

Still stuck? Write us.

  • Ashsish

    Thank you