How to Add a Dynamic Body Class in Typo3

27 Mar How to Add a Dynamic Body Class in Typo3

The other day while working on a clients website, I found the need to style certain Typo3 generated elements different, depending on the page. A simple tip for when you come across this situation is to add a dynamic class to your body tag. I ended up appending the Page ID, which allowed me to apply specific styling for a particular page.

Typoscript to add to your template

Adding that bit of typoscript will give you the following in your body class, where the number 79 represents your hypothetical page ID:

Then it is super easy to add custom styling your website. Any element that you need to apply individual styling to can be styled without overwriting styles on other pages. Let’s say for example that you have a Unordered List that has a class of ‘sectionList’, and a page ID of 345. You would access it like this in your CSS:

Of course, this solution works best for styling pages that won’t have a page ID that will change in the future i.e. frontpage, login page.