Einrückung und Blockbildung in TypoScript

Eine zentrale Anforderung an die Programmierung (und damit auch bei TypoScript) ist lesbarer und wartbarer Quellcode. Dies wird vor allem durch eine gute Strukturierung des Codes erreicht. Syntax-Highlighting im verwendeten Editor erhöht die Lesbarkeit zusätzlich, außerdem wird dadurch meist auch die Fehleranfälligkeit verringert.

Das Beispiel zeigt die "Formatierung" von TypoScript-Quellcode, wie sie möglichst nicht aussehen sollte.

temp.ein_link = TEXT
temp.ein_link.value = Das ist der Ankertext
temp.ein_link.wrap = <p>|</p>
temp.ein_link.typolink.parameter = 123
temp.ein_link.typolink.ATagParams = title="Das title-Attribut"

Der Bezeichner des Elements ("temp.ein_link") wird in jeder Zeile wiederholt. Zum Einen bedeutet dies mehr Schreibarbeit, andererseits wird der Code unnötig aufgebläht und unübersichtlich. Ausserdem steigt die Gefahr, dass bei einer Umbenennung des Bezeichners die eine oder andere Kopie des Namens vergessen oder falsch geschrieben wird.

Die Nachteile von fehlender Einrückung und fehlendem Syntax-Highlighting werden im nächsten Negativbeispiel noch deutlicher.

temp.ein_menu = HMENU
temp.ein_menu.entryLevel = 0
temp.ein_menu.wrap = <ul>|</ul>
temp.ein_menu.1 = TMENU
temp.ein_menu.1.expAll = 0
temp.ein_menu.1.noBlur = 1
temp.ein_menu.1.NO.allWrap = <li>|</li>
temp.ein_menu.1.NO.ATagTitle.field = nav_title // title
temp.ein_menu.1.ACT < .NO
temp.ein_menu.1.ACT = 1
temp.ein_menu.1.ACT.allWrap = <li class="active">|</li>
temp.ein_menu.1.ACT.linkWrap = &gt; |
temp.ein_menu.2 = TMENU
temp.ein_menu.2.expAll = 0
temp.ein_menu.2.noBlur = 1
temp.ein_menu.2.NO.allWrap = <li class="level2">|</li>
...

Hier sehen Sie, wie der oben stehende Code besser lesbar und strukturierter geschrieben werden kann.

temp.ein_link = TEXT
temp.ein_link {
  value = Das ist der Ankertext
  typolink {
    parameter = 123
    ATagParams = title="Das title-Attribut"
  }
  wrap = <p>|</p>
}

Durch die Einrückung und vor allem durch die Bildung von Blöcken werden zusammengehörige Elemente (z.B. der "typolink") viel deutlicher. Das Syntax-Highlighting trägt wesentlich zur besseren Lesbarkeit bei.

Die Verbesserungen sind im nächsten Beispiel noch besser zu sehen:

temp.ein_menu = HMENU
temp.ein_menu {
  entryLevel = 0
  1 = TMENU
  1 {
    expAll = 0
    noBlur = 1
    NO {
      allWrap = <li>|</li>
      ATagTitle.field = nav_title // title
    }
    ACT < .NO
    ACT = 1
    ACT {
      allWrap = <li class="active">|</li>
      linkWrap = &gt; |
    }
  }
  2 < .1
  2 {
    NO {
      allWrap = <li class="level2">|</li>
#      ...
    }
  }
#  ...
  wrap = <ul>|</ul>
}

Bei beiden Lösungsvorschlägen sehen Sie, dass wir das umschließende "wrap" an das Ende des jeweiligen Elements stellen. Dies ist nicht unbedingt notwendig, wir haben uns dies jedoch angewöhnt, weil wir es an dieser Stelle als logischer ansehen als an Anfang der Elementdefinition.