Sie befinden sich hier: start » typoscript_config

TypoScript Konfiguration

TypoScript Konfiguration

Die Konfiguration von TYPO3 kann man direkt in der Datenbank seiner Installation abspeichern. Dieses klassische Vorgehen ist allerdings aus der Mode gekommen, denn es hat sich als besser erwiesen, die Konfiguration in einer Datei abzuspeichern und diese Datei über ein INCLUDE_TYPOSCRIPT bzw @import in die Webseite einzubinden.

Vorteile der Einbindung einer Textdatei

  • Man kann unterschiedliche Konfigurationen der Webseite abspeichern. So kann man einfach zwischen Entwicklungsumgebung mit ausgeschaltetem Cache und der Live-Umgebung mit standardisiertem Cache unterscheiden.
  • Die verschiedenen Stände der TypoScript Entwicklung lassen sich per GIT oder anderem Tool versionieren.
  • Die gesamte Konfiguration lässt sich in einer Provider Extension packen, so dass diese nicht wie im fileadmin von außen einsehbar ist.

Speichern von Konstanten

Konstanten hingegen kann man wie gewohnt in der Datenbank speichern. Dies ist vor allem im Hinblick auf die Angabe der Domain und der URL der Webseite sinnvoll, die an dieser Stelle hinterlegt werden kann.

TypoScript config (klassisch)

Beispiel für eine Konfiguration mit TS für die config.

config {
  xmlprologue     = none
  uniqueLinkVars  = 1
  linkVars        := addToList(L(1),type(3))
  absRefPrefix    = /
  cache_period    = 86400
  no_cache        = 0
  
  ## Character sets
  renderCharset      = utf-8
  metaCharset        = utf-8
  
  ## Sys Variablen
  ## Ab der Version LTS v9.5 von TYPO3 sind Sprachvariablen nicht mehr nötig
  sys_language_uid     = 0
  sys_language_overlay = 1
  sys_language_mode    = content_fallback
  language             = de
  locale_all           = de_DE.UTF-8
  htmlTag_langKey      = de
  
  ## META Angaben
  pageTitleFirst       = 1
  noPageTitle          = 1
  sendCacheHeaders     = 1
  message_page_is_being_generated = Die angeforderte Seite wird Ihnen gleich angezeigt.
  
  spamProtectEmailAddresses = 2
  spamProtectEmailAddresses_atSubst = (at)
  
  ## RealURL Configuration
  tx_realurl_enable     = 1  
  simulateStaticDocuments = 0
}

TypoScript config (ab TYPO3 LTS v9.5)

Weite Teile der Konfiguration einer TYPO3 Webseite ab der Version 9.5 werden über das Modul Sites erledigt. Dies gilt vor allem für die Spracheinstellungen der Webseite. Ebenso benötigt man die Extension realURL nicht mehr seit der Version v9.5 von TYPO3, da diese Konfiguration durch den Slug ersetzt worden ist.

config {
  xmlprologue     = none
  uniqueLinkVars  = 1
  linkVars        := addToList(L(1),type(3))
  absRefPrefix    = /
  cache_period    = 86400
  no_cache        = 0
  
  ## Character sets
  renderCharset      = utf-8
  metaCharset        = utf-8
  
  ## META Angaben
  sendCacheHeaders     = 1
  message_page_is_being_generated = Die angeforderte Seite wird Ihnen gleich angezeigt.
  
  spamProtectEmailAddresses = 2
  spamProtectEmailAddresses_atSubst = (at)
}  

Variablen der Konfiguration

Hier finden Sie einige Variablen der Konfiguration, mit denen Sie unterschiedliche Stände der Webseite zwischen Entwicklungs- und Live-Umgebung der Webseite trennen können.

Cache

TYPO3 verfügt über einen sehr leistungsfähigen Cache. In diesem Zwischenspeicher werden Teile der Webseite berechnet und abgelegt, um bei Bedarf erheblich schneller geladen werden. Dabei nutzt TYPO3 die Möglichkeiten von PHP voll aus: So werden im OP Code Programmbefehle zwischengespeichert. Auch SQL-Queries der Datenbank werden als Abfragen gespeichert. Dadurch wird die Ladezeit einer TYPO3-Webseite enorm beschleunigt! Was sich für Besucher und SEO als Segen erweist, wird für Entwickler jedoch oft zum Fluch. Denn wenn man an einer Webseite entwickelt, muss man bei jedem Seitenaufruf zum Testen der Entwicklung den Cache löschen. Es gibt hier jedoch eine Abhilfe. In der Konfiguration (Beispiele siehe oben) kann man zwischen Entwicklungs- und Live-Umgebung unterschiedliche Stände des Cache angeben.

  • Die Variable cache_period bezeichnet die Zahl an Sekunden, die eine Seite im TYPO3 Cache gespeichert werden soll. Als Richtwert gibt man hier 86400 ein, also die Anzahl der Sekunden eines Tages.
  • Die Variable no_cache ist als Standard auf 0 gesetzt. Damit wird der Cache eingeschaltet. Man muss hier umgekehrt denken: Wenn man diese Variable auf 1 setzt, wird der Cache abgeschaltet.

Entwicklung:

config {
  cache_period      = 1
  no_cache          = 1
}

Live:

config {
  cache_period      = 86400
  no_cache          = 0
}

Bitte beachten Sie: Beim Livegang einer Webseite bitte unbedingt überprüfen, ob der Cache auch angeschaltet ist!

CSS und JS komprimieren

Im Bestreben, Google glücklich zu machen und die Ladezeiten einer Webseite zu verringern, bietet TYPO3 von Haus aus die Möglichkeit, den Quellcode für Style Sheets und JavaScript zu komprimieren. Dazu dienen die Befehle compressCss und compressJs.
Auch können alle jeweils ausgelieferten Dateien zu einer Datei zusammengefasst werden. Dies wird über die Befehle concatenateCss und concatenateJs eingestellt.
Was gut für SEO ist, erweist sich als Fluch für Entwickler. Denn sobald man in den Quelltext der Anwendung geht bzw. sobald man den Code Inspektor seines Browsers aufruft, landet man in einer unendlich langen Zeile eines sehr komprimierten Quelltextes. Daher sollte man für beide Variablen unterschiedliche Einstellungen wählen - und diese am besten bei den Konstanten speichern.

Entwicklung:

config {  
  compressCss       = 0
  concatenateCss    = 0
  compressJs        = 0
  concatenateCJs    = 0
}

Live:

config {  
  compressCss       = 1
  concatenateCss    = 1
  compressJs        = 1
  concatenateCJs    = 1
}  

Eigener Kommentar im TYPO3 Header

Wer in den Quelltext einer TYPO3-Webseite blickt, wird dort immer den Standard-Kommentar der jeweiligen Version seines Systems entdecken. Diesen Kommentar kann kann mit einem eigenen Text ergänzen. Wer ASCII Grafiken beherrscht, kann an dieser Stelle seiner Phantasie freien Lauf lassen! Sonst ist dies der richtige Platz, um neugierige Besucher mit der Adresse der Agentur zu versorgen oder den Besucher zu einer Bewerbung aufzufordern.

headerComment (
  Dies ist ein Text
  Denn dies ist die beste Webseite aller Zeiten!
)  

Neue Einbindung TypoScript ab TYPO3 9.5

Die bisherige Syntax zur Einbindung von Dateien in TypoScript erfolgte über den INCLUDE Befehl. Dieser ist in allen Versionen von TYPO3 bis einschließlich der Version 9.5 lauffähig. Allerdings ist er nicht die Zukunft.

Bisherige Einbindung einer TypoScript Datei:

<INCLUDE_TYPOSCRIPT: source="FILE:EXT:ibkprovider/Configuration/TypoScript/setup.ts">

INCLUDE_TYPOSCRIPT wird in folgenden Versionen von TYPO3 durch @import ersetzt. Hier gilt folgende Syntax:

Import einer einzelnen Datei

@import "EXT:ibkprovider/Configuration/TypoScript/setup.ts"

Import mehrerer Dateien eines Verzeichnisses in Reihenfolge ihres Namens

@import "EXT:ibkprovider/Configuration/TypoScript/*.typoscript"

Import aller Dateien eines Verzeichnisses

@import "EXT:ibkprovider/Configuration/TypoScript/"

Neue Dateiendung .typoscript ab TYPO3 9.5

Ab der Version LTS v9.5 ist die alte Dateiendung .ts für TypoScript weiterhin nutzbar. Es ist jedoch nun auch möglich, die Dateiendung .typoscript zu nutzen.

CK Editor konfigurieren

Der CK Editor kommt in der normalen Konfiguration des TYPO3 Backend mit allen Elementen, die man für die tägliche redaktionelle Arbeit braucht. Es ist aber einfach möglich, den Editor über das Seiten Config zu erweitern.

Dazu geht man in den Seiteneigenschaften in den Reiter Ressourcen und das Feld Seiten TS-Config. Dort kann man die Konfiguration erweitern:

RTE.default.preset = full

Beispiel für ein Backend Layout

backend_layout {
  colCount = 2
  rowCount = 5
  rows {
    1 {
      columns {
        1 {
          name = Text mit Inhalt
          rowspan = 3
          colPos = 10
        }
        2 {
          name = Kasten Titel
          rowspan = 2
          colPos = 11
        }
      }
    }
    3 {
      columns {
        1 {
          name = Kasten Text
          colPos = 12
        }
      }
    }
    4 {
      columns {
        1 {
          name = Text ganze Zeile
          colspan = 2
          colPos = 13
        }
      }
    }
    5 {
      columns {
        1 {
          name = Spalte unten links
          colPos = 14
        }
        1 {
          name = Spalte unten rechts
          colPos = 15
        }
      }
    }
  }
}