TYPO3 – das CMS der unbegrenzten Möglichkeiten. Folgendes Problem: Ihr habt eine bestehende Webseite und ihr wollte jede einzelne Seite via CSS individuell ansprechen. Wie könnte dieses Problem gelöst werden? In dem an z.B. das BODY-Tag die bereits eindeutige PageID als HTML-ID-Attribut eingefügt wird. Wie das geht, erfahrt ihr in diesem Blogpost.

Ein kleines bisschen Vorwissen zu dem HTML-Attribut id=““, denn eine solche ID muss mit einem Buchstaben beginnen und muss im gesamten Dokument eindeutig sein.

Daher ist der Aufbau in diesem Beispiel uid-123. Somit beginnt die ID mit Buchstaben, getrennt durch einen Bindestrich wird die PageID aus TYPO3 angehängt.

Um eure Webseite jetzt mit der ID auszustatten, ist folgendes Typoscript im Setup eures Templates notwendig:

page = PAGE
[...]
page.bodyTagCObject = HTML
page.bodyTagCObject.value.field = uid
page.bodyTagCObject.value.wrap = <body id="uid-|">

Als Ergebnis erhaltet ihr dann folgendes HTML:

<body id="uid-123">

Mit Hilfe der ID am BODY-Tag könnt ihr jetzt jede beliebige Seite via CSS optisch umgestalten, neu layouten, etc., da ihr bequem auf jede Seite zugreifen könnt:

#uid-123 #co1 {float: right;}
#uid-100 #co1 {float: left;}