Constants:

plugin.meta >
plugin.meta {
description =
keywords =
robots =
copyright =
email =
author =
language =
distribution =
rating =
revisit =
includeGlobal = 0
}

Als Konstanten werden in TYPO3 verschiedene Werte festgelegt, die von ihrer Bezeichnung her exakt den spezifizierten (X)HTML-Vorgaben für das Meta-Tag-Format entsprechen und für ihre Äquivalente in dem generierten XHTML-Code eingesetzt werden. Es können so bspw. eine Kurzbeschreibung der Seiten, spezielle Schlüsselwörter, Sprachversion und Hin-weise auf den Autor oder das Copyright angegeben werden, die für alle Seiten der Präsenz übergreifend gelten.

Setup:

plugin.meta.global.description =
plugin.meta.global.keywords =
plugin.meta.flags.useSecondaryDescKey = 1
plugin.meta.flags.alwaysGlobalDescription = 0
plugin.meta.flags.alwaysGlobalKeywords = 0
plugin.meta.flags.DC = 0
# Mit dem Setzen auf den Wert 0, werden doppelte Metatags vermieden.
page.headerData.999 < plugin.meta

Das Setup der Meta-Tags fügt die Angaben der zu generierenden Seite letztenendlich zu. Dafür wird der Inhalt in den Head-Bereich des PAGE-Objekts kopiert. Auffällig ist die Doppelung des Feldes „Description“ und „Keywords“. Die global geltenden Kurzbeschreibung und die Schlüsselwörter können per Konstantendeklaration gesetzt werden oder alternativ direkt im Setup festgelegt werden (die vorletzte Anweisung ver-hindert, dass die Meta-Tags doppelt generiert werden). Des Weiteren werden drei Werte gesetzt. Die Anweisungen führen dazu, dass im Normalfall die hier definierten Beschreibungen für die Meta-Tags verwendet werden, es sei denn für spezielle Seiten werden anderweitige Informationen über das Seiten-Modul festgelegt. In diesem Fall werden die Angaben der Unterseite verwendet, sonst die global gültigen Definitionen.

Die Bewertung einer Interseite wird durch verschiedene Faktoren beeinflusst:

• Lage der Suchbegriffe
  Befindet sich z.B. ein gesuchtes Wort im Titel oder in Überschriften der Website, so scheint der Inhalt dieses Informationsangebotes relevanter zu sein, da sich der komplette Auftritt oder große Teile vermutlich mit diesem Thema beschäftigen.
• Dichte der Suchbegriffe („keyword density“)
  Die Häufigkeit des gesuchten Terminus im Text spielt ebenfalls eine große Rolle, da die Seite desto wichtiger eingestuft wird, desto öfter das Wort Erwähnung findet. Die Suchbegriffdichte beschreibt das Verhältnis des Textes zum Suchbegriff. Aus Erfahrung sollte dieser Wert zwischen 1% und 7% liegen. Höhere Prozentzahlen werden von den Suchmaschinen als Manipulation eingestuft und mit schlechten Platzierungen bestraft.
• Link-Popularität
  Wird eine Website häufig von anderen Angeboten „verlinkt“, so gehen die Agentenprogramme der Suchmaschinenanbieter von einer höheren Beliebtheit und gleichbedeutend einer größeren Wichtigkeit des Angebots aus. Dieser Faktor lässt sich selbst kaum beeinflussen.
• Klick-Popularität
  Einige Suchmaschinen merken sich die Häufigkeit des Anklickens der Suchergebnisse bei bestimmten Suchbegriffen. Wird ein Internetauftritt besonders oft ausgewählt, so wird dieser in dem Ranking dadurch steigen. Eine Möglichkeit, auf diesen Bewertungsfaktor direkt einzuwirken, gibt es nicht.

Nach Betrachtung der Kriterien bietet es sich also an, gezielt Schlüsselwörter für den Auftritt festzulegen. In die Überlegungen einzubeziehen sind drei Regeln. Die Keywords sollten nicht aus einzelnen Suchbegriffen bestehen, sondern zwischen zwei und vier Wörter beinhalten. Denn in den meisten Suchanfragen werden Phrasen, also mehrere Wörter, verwendet, um einen passenden Treffer zu erzielen. Zum einen müssen diese Phrasen gebräuchlich sein, so dass ein Suchmaschinenbenutzer auch tatsächlich diese Suchbegriffe wählt; auf der anderen Seite ist Einzigartigkeit ebenso notwendig, um sich von der Konkurrenz abzusetzen. Spezifische Schlüsselwörter qualifizieren außerdem die über eine Suchmaschine kommenden Besucher.

Suchmaschinen müssen des weiteren die Website „lesen“ können, um die Inhalte und Schlüsselworte etc. zu erfassen. Durch den Gebrauch von Webstandards und den Verzicht auf Tabellen als Layoutmittel ist der Quellcode der nordEnergie-Seiten schlank gehalten und kann von den Agenten der Suchmaschinen optimal verarbeitet werden.

Meta-Tags sind für Suchmaschinen von großer Bedeutung. Es gibt eine Vielzahl von verschiedenen Typen, allerdings sind in der Praxis mittlerweile lediglich zwei Arten interessant: die Kurzbeschreibung (Description) und die Schlüsselwörter (Keywords). Die Kurzbeschreibung fasst in zwei bis drei Sätzen den Inhalt des Auftritts zusammen und Schlüsselwörter spiegeln den Inhalt der Seiten wieder. Dabei ist es enorm wichtig, dass die Keywords mit den wirklichen Inhalten korrespondieren. Eine Irreführung mit gefälschten Begriffen führt zur Abstrafung des Auftritts mit schlechter Platzierung.

All diese Aspekte sind für ein erfolgreiches Bekanntwerden des Internetauftritts zu beachten, bevor man eine manuelle oder automatische Eintragung in eine Suchmaschine bzw. ein Verzeichnis anvisiert. Die Schlüsselwörter bestimmen sich über den Inhalt und können durch Meta-Tags unterstützt werden. Wie sich die Realisierung dieser Angaben in TYPO3 gestaltet, soll als nächstes betrachtet werden.

Für den Internetauftritt der nordEnergie AG existiert bereits eine Internetadresse. Die Wahl ist bei Gründung der Firma auf www.nordenergieag.de gefallen und die Adresse ist bereits auf Visitenkarten, Plakaten und sonstigen Drucksachen verewigt. Ebenso wird von den entsprechenden E-Mail-Adressen Gebrauch gemacht. Das Mitführen der Rechtsform im Domainnamen ist allerdings problembehaftet. Zwar entspricht die Internetadresse exakt dem Firmennamen, doch ist die Praktik den Zusatz von „AG“ anzugeben nicht weit verbreitet und wird so im Web nicht angewandt (die „Deutsche Bank“ oder „Die Bahn“ führen „AG“ schließlich auch nicht in ihrer Internetadresse mit). Die Adresse ist dadurch nicht auf den ersten Blick der Firma zuzuordnen. Es empfiehlt sich, zusätzlich zu der bestehenden Domain, die eindeutige105 und einprägsamere Variante „www.nordenergie.de“ zu reservieren. Eine Weiterleitung ist einzurichten. Somit kann außerdem verhindert werden, dass z.B. ein Mitanbieter sich die Adresse sichert und andere Inhalte dort hinterlegt.

Das Einfügen neuer Inhaltstypen ist leicht und schnell erledigt. Ein spezielles TYPO3-Modul steht dafür zur Verfügung, welches wie ein Assistent funktioniert und von dem bearbeiten-den Redakteur alle notwendigen Daten abfragt. Es können beliebig viele, unterschiedliche Module für eine Seite festgelegt werden. Die Reihenfolge der Inhaltsobjekte kann auch im Nachhinein verändert und verschoben werden.

Jedes Seitenelement kann mit einer Überschrift versehen werden, die den im Style Sheet definiertem Aussehen entspricht. Nach diesem Prinzip funktioniert die gesamte Textformatierung in TYPO3. Des Weiteren stehen für den Inhaltstyp allgemeine Optionen zur Verfügung, die es z.B. ermöglichen das Element zu verstecken, einen Veröffentlichungstermin oder –zeitraum festzulegen und die Seite nur ausgewählten Benutzern bzw. Benutzergruppen zugänglich zu machen . Besonders komfortabel ist das Editieren von Texten unter Verwendung des Internet Explorers, da TYPO3 für diesen Browser standardmäßig einen „Rich Text Editor“ (kurz RTE) anbietet. Mit Hilfe dieses Editors kann der Redakteur in Anlehnung an die Bedienungsweisen einer Textverarbeitung wie z.B. „Word“ den Content erstellen, gliedern und formatieren. Durch diese praktische Funktionalität sind keine Vorkenntnisse von HTML o.ä. notwendig, um die Seiten zu warten.

Für das Einpflegen von Inhalten können in TYPO3 verschiedene Rollen vergeben werden. Für Mitarbeiter mit unterschiedlichen Kompetenzbereichen können Benutzer mit dementsprechend konfigurierten Zugriffs- und Schreibrechten eingerichtet werden, so dass ein Mitarbeiter ausschließlich in seinem Bereich tätig sein kann. Die übrigen Seitenteile sowie administrativen Funktionen werden für ihn dann komplett ausgeblendet. Die ihm zugeordneten Bereiche sind frei skalierbar. Ebenfalls können Restriktionen festgelegt werden, was das Anlegen und Weiterverarbeiten von neuen oder bestehenden Seiten belangt. Ein Benutzer kann dann bspw. eine Seite zwar verändern, jedoch nicht löschen oder neue hinzufügen. Dadurch ist optimal gewährleistet, dass der zukünftige Redakteur nicht überfordert, sondern ein auf ihn speziell abgestimmtes und passendes Angebot zusammengestellt wird. Des Weiteren ist eine intuitive Bearbeitung der Inhalte durch das sogenannte „Frontend-Editing“ möglich. Dieser Begriff beschreibt die Funktionalität, dass ein Redakteur direkt in dem Internetauftritt Änderungen an den Inhalten vornehmen kann ohne über das Backend zu agieren. Veränderbare Bereiche werden durch ein nebenste-hendes Stift-Symbol angezeigt. Durch die Auswahl dieser Edit-Funktion wird in den Bearbeitungsmodus gewechselt, der dem Redakteur bereits bekannt ist.

Da während der Bearbeitung der Diplomarbeit noch keine vollständigen Texte für die Inter-netseite bereitgestellt werden konnten, wurde der textuelle Bereich mit Blindtext zur besseren Veranschaulichung aufgefüllt und die sonstigen contentrelevanten Elemente prototypisch angelegt. Bis zum Launch der Internetpräsenz sind die Inhalte durch die Firma selbstverständlich zu ergänzen.

Constants:

PAGE_TARGET =

Durch diese Konstantenzuweisung wird garantiert, dass alle seiteninternen Links von TYPO3 in demselben aktiven Fenster angezeigt werden.

Setup:

# Main TEMPLATE cObject für den BODY
temp.mainTemplate = TEMPLATE
temp.mainTemplate {

  # Das Template cObject referenziert den Inhalt des Auto-Parsers
  template =< plugin.tx_automaketemplate_pi1

  # Nur der Inhalt zwischen den <body>-TAGS der Vorlage wird beachtet
  workOnSubpart = DOCUMENT_BODY

  # Ersetze den ###mainnavi### subpart mit der dynamischen Hauptnavigation
  subparts.mainnavi < temp.menu_main

  # Ersetze den ###headerimage### subpart mit dem Bild aus der Spalte LINKS
  subparts.headerimage < styles.content.getLeft

  # Ersetze den ###content### subpart mit dem Inhalt der Spalte NORMAL
  subparts.content < styles.content.get

  # Ersetze den ###locator### subpart mit der Pfadanzeige
  subparts.locator < temp.locator

  # Ersetze den ###metanavi### subpart mit der Metanavigation für den Seitenkopf
  subparts.metanavi < temp.menu_meta

  # Ersetze den ###footer### subpart mit der Metanavigation für die Fußzeile
  subparts.footer < temp.menu_footer

  # Ersetze den ###lightblue_bottom_border### subparts mit den Links Print & Oben
  subparts.lightblue_bottom_border < temp.printversion
}

# Head TEMPLATE cObject für den HEAD
temp.headTemplate = TEMPLATE
temp.headTemplate {

  # Das Template cObject referenziert den Inhalt des Auto-Parsers
  template =< plugin.tx_automaketemplate_pi1

  # Nur der Inhalt zwischen den <head>-TAGS der Vorlage wird beachtet
  workOnSubpart = DOCUMENT_HEADER
}

# Standard PAGE object
page = PAGE
page.typeNum = 0
# <body>-TAG wird ohne jegliche Angaben gelassen
page.bodyTag = <body> 
page.config.language = de
page.config.locale_all = de_DE

# Kopiere den Inhalt aus mainTemplate für den <body>-Bereich in die Seite
page.10 < temp.mainTemplate

# Kopiere den Inhalt aus headTemplate für den <head>-Bereich in den HEAD
page.headerData.10 < temp.headTemplate

Das TypoScript-Listing des abschließenden Setups, welches für das Zusammensetzen und die letztenendliche Generierung der Frontend-Seite zuständig ist, gestaltet sich auf den ersten Blick relativ umfangreich, ist jedoch schnell und einfach nachvollziehbar.
Ein neues TEMPLATE-Objekt mit der Bezeichnung „mainTemplate“ wird angelegt, welches den Inhalt des Auto-parsers, also die XHTML-Designvorlage, referenziert. Lediglich der Be-reich der Vorlage zwischen den Body-Tags wird berücksichtigt. Es wird anschließend begon-nen, die zuvor temporär gespeicherten Elemente (Navigation, Stimmungsbild, Content, Pfadanzeige etc.) in ihre vorgesehene Position (durch Subparts markiert) im Layout einzu-fügen. Derselbe Vorgang wird für den Head-Bereich ebenfalls durchgeführt. Um die Seite nun endgültig darstellbar zu gestalten, benötigt TYPO3 ein PAGE-Objekt, welches in diesem Setup die Bezeichnung „page“ erhält. Der Standardseitentyp wird zugewiesen (typeNum = 0) und der Body-Tag ohne weitere Auszeichnungen gesetzt (TYPO3 erzeugt sonst standard-mäßig eine Seite mit weißem Hintergrund). Die folgenden zwei Zeilen konfigurieren die deutsche Sprachversion des Auftritts. Anschließend wird der Inhalt aus der Variable „mainTemplate“ (die zuvor erschaffenen Seitenelemente) in den Datenteil des darzustel-lenden PAGE-Objektes kopiert. Die Header-Angaben aus „headTemplate“ werden in den Head-Bereich von „page“ eingefügt.

Das Template ist somit vollständig und kann die XHTML-Seite für die Frontend-Darstellung generieren. Alle dynamischen Bereiche wurden durch ihre entsprechenden Elemente substituiert und ergeben mit den statischen Teilen das Gesamterscheinungsbild.

Constants:

plugin.alt.print.file.template = fileadmin/template/print_template.html
plugin.alt.print.file.stylesheet = fileadmin/template/css/ne_print.css

Per Konstantendeklaration werden die spezielle Printvorlage in XHTML mit dazugehörigem Style Sheet für die Printversion festgelegt. Es handelt sich hierbei um eine für das Ausdrucken optimierte Darstellungsweise. Die Dateien sind im Dateimanager hinterlegt.

Setup:

# Druckversion und "Nach Oben" â Link SETUP
temp.printversion = TEXT
temp.printversion.data = TSFE : id
temp.printversion.wrap = <a href="#nach_oben"><img src="fileadmin/template/img/
icon_top.gif" width="11" height="11"> nach oben</a>&nbsp;&nbsp;&nbsp;<a href="index.php?id=|&type=98"><img src="fileadmin/template/img/ icon_druckversion.gif" width="12" height="11"> Druckversion</a>

# Konfiguration der Print-Version
alt_print >
alt_print = PAGE
alt_print.typeNum=98
alt_print.stylesheet = {$plugin.alt.print.file.stylesheet}

alt_print.10 = TEMPLATE
alt_print.10 {
  template = FILE
  template.file = {$plugin.alt.print.file.template}

  subparts {
    content < styles.content.get
  }
  workOnSubpart = DOCUMENT_BODY
}

Die Erstellung des Hyperlinks für die Druckversion gestaltet sich einfach. Das Standard-TYPO3-Plug-In „plugin.alt.print (98)“ wird dem Main Template als statisches Template be-kannt gemacht. Die Variable „temp.printversion“ wird von Typ „TEXT“ deklariert und mit der Anweisung der nächsten Zeile die aktuelle Page-ID ermittelt. Der Verweis an den Anfang der Seite (ein simpler Link auf einen statischen Anchor-Tag in der Designvorlage) und der eigentliche Link zur Druckversion samt Icon werden formuliert und die Page-ID übergeben. Um nun die Ausgabe des Inhalts in das vorbereitete Print-Template zu übergeben, muss als Seitentyp „98“ für die Printversion angegeben werden. Den Rest erle-digt TYPO3 dann von selbst.

Die nachfolgende Konfiguration der Print-Version ist eine angepasste Version aus der TYPO3-Dokumentation für den Standardeinsatz des Print-Plug-Ins. Ein neues PAGE-Objekt wird erzeugt, dass die Darstellung der Druckversion übernehmen wird. Die Eigenschaft wird aus Übersichtlichkeitsgründen passend zum Seitentyp auf 98 gesetzt. Das Style Sheet aus der Konstantendeklaration wird wie die eigentliche Vorlage dem PAGE-Objekt zugewiesen. In den Subpart „content“, welcher in der Print-Vorlage klassisch definiert wurde, wird der Inhalt aus der Seite kopiert (content < styles.content.get). Außerdem wird durch die abschließende Zeile erreicht, dass nur der Teil innerhalb des Subparts „DOCUMENT_BODY“ in der Printvorlage für den Seitenaufbau benutzt wird.

Jeder Seite der nordEnergie-Präsenz wird nun ein Link, der zum Seitenanfang zurückführt und ein Verweis zur Druckversion hinzugefügt.

# Locator-Funktion (Pfadanzeige, rootline)
temp.locator = HMENU
temp.locator {
   special = rootline
   special.range = 0 | -1
   wrap = Sie befinden sich hier: |
   1 = TMENU
   1 {
      NO {
           allWrap = |  -  |*| |  -  |*| | 
	   stdWrap.htmlSpecialChars = 1
         }
      }
}

Ein neues mit „temp.locater“ bezeichnetes HMENU-Objekt vom Spezialtyp „rootline“ bietet die Funktionalität einer anklickbaren Pfadanzeige. Die „range“-Eigenschaft des HMENU-Objekts legt fest, bei welcher Ebene der Pfad beginnen soll.
In diesem Anwendungsfall wird auf obersten Ebene bei Level 0 (Startseite) begonnen und bis zur aktuellen Seite fortgesetzt (-1). Zur besseren Verständlichkeit der Funktion dient der vorangestellte, kurze Erklärungstext (Sie befinden…). Der Pfad selbst ist wiederum ein Text-menü, welches per „allWrap“ und „Optionsplit“ die einzelnen Seitentitel durch ein Minus-zeichen und Leerzeichen optisch voneinander abtrennt.

# Metanavigation im KOPF
temp.menu_meta = HMENU
temp.menu_meta.special = list
temp.menu_meta.special.value = 38, 37, 36, 35
temp.menu_meta.1 = TMENU 
temp.menu_meta.1.NO {
   before =  
   after =    | |*|    |  |*|  
   allWrap = <span class="metanavi-no"> | </span>
   stdWrap.htmlSpecialChars = 1
}

# Metanavigation im FOOTER
temp.menu_footer = HMENU
temp.menu_footer.special = list
temp.menu_footer.special.value < temp.menu_meta.special.value
temp.menu_footer.wrap = &copy; nordEnergie AG 2005&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;|
temp.menu_footer.1 = TMENU 
temp.menu_footer.1.NO {
   after =   | |*| | |*| &nbsp;
   allWrap = <span class="metanavi-no"> | </span>
   stdWrap.htmlSpecialChars = 1
}

Die Metanavigation ist ein spezielles hierarchisches Menü vom Typ „list“. Dieser Liste können direkt Seiten durch die Angabe der Page-ID der jeweiligen Seiten über „value“ zugeordnet werden. Die vier Zuweisungen von 35 bis 38 entsprechen den Einträgen der Metanavigation Startseite, Kontakt, Impressum und Sitemap. Dem Textmenü im Normalzustand werden über „after“ und „before“ verschiedene Teile voran- und hintergestellt. In diesem Fall werden die zwei Werte verwendet, um Abstände zwischen den Menüeinträgen zu schaffen. Bei „after“ kommt ein „OptionSplit“ zu Einsatz. Der Bereich vor dem ersten |*| gilt für den ersten Eintrag, der darauffolgende für alle „mittleren“ Menüeinträge und der letzte Teil wird für den letzten Menüeintrag angewandt. Alle Einträge erhalten das Aussehen „metanavi-no“. Außerdem wird die XHTML-Konformität weiterhin gewahrt. Die Metanavigation für den Seitenkopf ist unter „temp.menu_meta“ abgelegt.

Für die Anzeige der Metanavigation im Fußbereich werden die Schritte weitestgehend analog durchgeführt. Die Zuweisung der Page-IDs wird aus dem erstangelegten Menü übernommen. Außerdem wird, wie in der Vorlage definiert, ein Copyright-Hinweis der Navigation vorangestellt und der nötige Abstand zwischen diesen beiden Elementen hergestellt. Unter „temp.menu_footer“ wird dieses Menü zwischengespeichert.

# Hauptnavigations-Menu 1 cObject - vom Typ HMENU
temp.menu_main = HMENU

  # Erste Ebene Menu-Object, textuell
  temp.menu_main.1 = TMENU
  temp.menu_main.1 {

  # Normal-Zustand Eigenschaften
  NO.allWrap = <div class="mainnavi-level1-no"> | </div>
  NO.stdWrap.htmlSpecialChars = 1
  }

  # Zweite Ebene Menu-Object, textuell
  temp.menu_main.2 = TMENU
  temp.menu_main.2 {

  # Normal-Zustand Eigenschaften
  NO.allWrap = <div class="mainnavi-level2-no"> | </div>
  NO.stdWrap.htmlSpecialChars = 1

  # Aktiven Zustand aktivieren und Eigenschaften setzen
  ACT = 1
  ACT.allWrap = <div class="mainnavi-level2-act"> | </div>
  ACT.stdWrap.htmlSpecialChars = 1
  }

  temp.menu_main.3 = TMENU
  temp.menu_main.3 {

  # Normal-Zustand Eigenschaften
  NO.allWrap = <div class="mainnavi-level3-no"> | </div>
  NO.stdWrap.htmlSpecialChars = 1

  # Aktiven Zustand aktivieren und Eigenschaften setzen
  ACT = 1
  ACT.allWrap = <div class="mainnavi-level3-act"> | </div>
  ACT.stdWrap.htmlSpecialChars = 1
  }

Erzeugt wird ein mit dem Titel „temp.menu_main“ (frei wählbar) versehenes HMENU-Objekt, welches für „Hierarchisches Menü“ steht und das grundlegende Basisobjekt aller TYPO3-Menüs ist. Für das neue Menüobjekt müssen nun seine Zustände und Ebenen definiert werden. Dafür werden den drei Ebenen drei neue Menü-Objekte von Typ TMENU zugewiesen (Textmenüs) und der jeweilige Normal-Zustand angegeben (abgekürzt mit NO). Zusätzlich kann ein aktives Aussehen, wenn der Menüpunkt aktuell ausgewählt ist, zur erhöhten Orientierung des Besuchers definiert werden (ACT), was für die zweite und dritte Ebene realisiert wurde.

Von dem generellen Prinzip her wird den verschiedenen Zuständen lediglich ein umschlie-ßender Div-Tag zugewiesen. So erhält bspw. der Normalzustand der ersten Ebene durch „allWrap“ die Div-Klasse „mainnavi-level1-no“. Für das Pipesymbol („|“) wird also der Menücode aus dem CMS eingefügt und von den in „allWrap“ stehenden Zeichen umgeben. Das genaue Aussehen dieses Eintrages ist im Style Sheet definiert. So funktioniert die Menüerstellung in allen Fällen. Die „htmlSpecialChars”-Funktion ist für die XHTML-Kompatibilität notwendig, falls Sonderzeichen im Textmenü verwendet werden.

Mit wenigen Zeilen TypoScript ist die gesamte, problemlos erweiterbare Hauptnavigation umgesetzt worden. Das Menü ist komplett dynamisch und bildet die Baumstruktur aus TY-PO3 ab. Wird eine neue Seite hinzugefügt, wird diese Veränderung automatisch in der Frontend-Darstellung eingepflegt. Das gesamte Menü ist in dem Eintrag temp.menu_main bereits angelegt und wird an späterer Stelle der Seite hinzugefügt.

#Konfiguration des Auto-Parser fuer Haupt-Template:
plugin.tx_automaketemplate_pi1 {

  # Die Designvorlage wird eingelesen:
  content = FILE
  content.file = fileadmin/template/main_template.html

  # Hier werden die Elemente im der XHTML-Vorlage definiert
  # welche von subpart-Comments umgeben werden sollen:

  elements {
    BODY.all = 1
    BODY.all.subpartMarker = DOCUMENT_BODY

    HEAD.all = 1
    HEAD.all.subpartMarker = DOCUMENT_HEADER
    HEAD.rmTagSections = title

    DIV.all = 1
  }

  # Alle relativen Pfadangaben soll diese Prefix vorangestellt werden:
  relPathPrefix = fileadmin/template/
}

Zu Beginn ist es notwendig, die Designvorlage einzulesen (diese wurde zuvor samt Style Sheet über den Dateimanager an die angegebene Position gebracht). Hierfür wird die Variable „content“ mit dem FILE-Objekt belegt, damit eine Datei eingebunden werden kann . Anschließend erfolgt die Zuweisung der Designvorlage, die ab diesem Zeitpunkt dem System bekannt ist. Darauf folgend wird die Vorlage nach bestimmten Tags abgesucht und mit Subpart-Markern belegt. Zwischen dem öffnenden und schließenden Body-Tag der Vorlage soll der Subpart „DOCUMENT_BODY“ eingefügt werden. Analog dazu gilt dies für den Head-Tag. Außerdem wird der Title-Tag, welcher den Seitentitel beinhaltet, entfernt. Der Titel der jeweiligen Seite wird durch TYPO3 später dynamisch und passend ergänzt. Alle Div-Tags der Vorlage, an die ein Klassen- oder ID-Name vergeben wurde, werden ebenfalls mit gleichnamigen Subparts versehen. Durch diesen Umstand ist erreicht, dass jeder relevante Container des zu Grunde liegenden Layout über einen füllbaren Subpart-Marker verfügt, der durch dynamische Teile (Navigationen, Inhalte etc.) ergänzt werden kann . Die letzte Anweisung des Setups bewirkt, dass allen relativen Pfadangaben aus der Vorlage der Zusatz „fileadmin/template/“ vorangestellt wird. Dabei handelt es sich um das selbst gewählte Unterverzeichnis in dem alle Template-bezogenen Daten abgelegt sind. Es sind keine Pfadanpassungen in der Ausgangsvorlage nötig. TYPO3 kann diese Begebenheit vollkommen automatisch ohne weiteres Zutun des Users regeln.

#DOCTYPE auf XHTML 1.0 Strict setzen, für den IE wird die XML-Angabe umgedreht
config.doctype = xhtml_strict
config.doctypeSwitch = true
config.xhtml_cleaning = all
config.htmlTag_langKey = de

Die erste Anweisung verändert den Doctype auf XHTML 1.0 Strict. Der zweite Befehl ist notwendig, da in der Version 6.0 des Microsoft Internet Explorers ein Bug existiert, der eine dem W3-Konsortium entsprechende Deklaration des XML-Typs der Seite vor dem Doctype fehlinterpretiert und zu gravierenden Darstellungsfehlern führt. Deshalb muss die Reihenfolge speziell für den Internet Explorer umgedreht werden, was durch diese Anweisung erledigt wird. Durch die Funktion „xhtml_cleaning“ wird der erzeugte XHTML-Code von häufigen Fehlern bereinigt. Mit der letzten Zeile wird die Sprachversion der generierten Seiten auf deutsch festgelegt.

Der klassische Weg bei der Seitenerstellung mit TYPO3 wäre, den Quelltext der Designvorlage mit verschiedenen TYPO3-Markern, so genannten „Marks“ und „Subparts“, zu versehen, welche dann aus dem CMS heraus angesprochen und mit Inhalten aus der Datenbank gefüllt werden können. Ein eleganterer und modernerer Lösungsansatz wird allerdings durch den Einsatz der zuvor erwähnten Extension „Template Auto-parser“ verfolgt. Eine spezielle Vorbereitung der Designvorlage ist nicht notwendig, da der Auto-Parser selbstständig die austauschbaren Markierungen („subparts“) zur Laufzeit einfügt. Diese wiederum können angewählt und befüllt werden. Somit ist es möglich, die XHTML-Vorlage ohne auch nur eine Anpassung oder Umstellung zu verwenden.

Für die „Startseite“ wird demzufolge ein neuer Template-Datensatz erstellt. Diese Art von Datensätzen hat verschiedene Bestandteile. Die für diese Betrachtung wichtigsten zwei Felder sind „Constants“ (hier werden häufig verwendete Konstanten definiert) und „Setup“ (beinhaltet die in TypoScript formulierte Beschreibung der kompletten Seitenelementerzeugung) .

Die kommentierte Anführung von TypoScript-Codeausschnitten des Setup-Feldes soll verdeutlichen, wie die Seite von TYPO3 aufgebaut wird. Sollten zusätzlich Konstantendefinitionen benötigt werden, wird dies deutlich sichtbar gemacht. Der gesamte, konfigurierte Template-Datensatz kann im Anhang gefunden werden.

Verkleinertes Layout mit Markierungen der dynamischen und statischen Bereiche

Aus der Abbildung geht hervor, das insgesamt sieben relevante Bereiche vorhanden sind. Zwei sind statischer Natur, die für jede Seite wiederkehrend dargestellt werden. Es handelt sich um den Kopfbereich mit dem Signet und einem Slogan sowie den weiteren Platzhalter für die zusätzliche Kommunikation der Firmenphilosophie. Selbstverständlich ist das umschließende Gesamtlayout ebenfalls statisch durch die Designvorlage zu beschreiben. Zu den fünf dynamischen Elementen gehören die Hauptnavigation, die Metanavigation im Kopf und Fuß, das Stimmungsbild, der Content inklusive Pfadanzeige und die Funktionalitäten im Fußbereich der Seite (z.B. Druckversion). Beide unterschiedlichen Objekttypen müssen in TYPO3 eingepflegt werden, die Herangehensweise an die Umsetzung differenziert. Die als statisch deklarierten Teile können bereits über die Designvorlage selbst festgelegt werden. Die dynamischen Elemente werden dann mit Hilfe von TypoScript im System erzeugt.

• Umsetzung des Layouts in eine Designvorlage (HTML- oder XHTML-Format)
• Unterscheidung von statischen und dynamischen Teilen des Layouts
• Integration der erstellten Vorlage mit Hilfe der Extension „Template Auto-Parser“
• Substitution der dynamischen Bereiche wie z.B. Navigation, Content unter Verwendung von „TypoScript“

Diese Schritte müssen nacheinander vollzogen werden.

Anschließend muss das „Backend“, der administrative Hintergrundbereich des CMS, welcher lediglich dem Administrator und den Redakteuren zugänglich ist, für die deutsche Sprache konfiguriert und neue Benutzer mit unterschiedlichen Schreibrechten für die spätere Wartung des Internetauftritts angelegt werden (mit „Frontend“ wird der Bereich von TYPO3 bezeichnet, den der Besucher zu sehen bekommt, also die eigentliche Website). Das Hinzufügen von Benutzern oder ganzen Benutzergruppen mit unterschiedlichen Rechten kann zu jedem Zeitpunkt auch nachträglich erfolgen, so dass in der Phase der Realisation ausschließlich der Administrator-Account, ausgestattet mit allen verfügbaren Berechtigungen, genutzt wird. Für die zukünftige Pflege werden an die Benutzer andere Zugriffsrechte vergeben und für den internetunerfahrenen Redakteur, welcher lediglich textliche Veränderungen aber keine strukturellen Erweiterungen vornimmt, uninteressante Bereiche ausgeblendet. Außerdem muss die gesamte Installation abgesichert werden, indem die Standardpasswörter für das Installations-Tool und die TYPO3-Instanz selbst entsprechend verändert werden.
TYPO3 bringt in der Standardinstallation bereits eine Vielzahl an Funktionen mit sich. Spezielle Module müssen dennoch als sogenannte „Extension“ oder „Plug-Ins“ nachträglich dem System hinzugefügt werden, was sich über den „Extension Manager“ leicht realisieren lässt. Im aktuellen Fall der nordEnergie-Internetpräsenz müssen u. a. Erweiterungen für den Template Auto-parser („automaketemplate“), welcher bei der Template-Erstellung hilft, und eine Erweiterung zur Implementierung von CSS-Definitionen („css_styled_content“) nachgeladen werden, um alle im Konzept aufgestellten funktionalen Forderungen zu erfüllen.

Die hierarchische Baumstruktur des Internetauftritts aus der Informationsarchitektur wird im Content Management System, wie in der Abbildung in der ersten Ebene zu sehen, eins zu eins übernommen.

Sitestruktur in der ersten Ebene

In TYPO3 existieren verschiedene Seitentypen. Drei davon sind in der Grafik dargestellt. Der mit „Template Storage“ bezeichnete Datensatz vom Typ „sysFolder“ (Ordnersymbol direkt unter der Weltkugel an erster Stelle – es handelt sich hierbei um einen Speicherplatz für jedes beliebige Datenbankelement) beinhaltet die sogenannten „Templates“. Dies sind in der TYPO3 eigenen Konfigurationssprache „TypoScript“ verfasste Befehlsfolgen, welche für die Generierung der vollständigen Webseiten zuständig sind (dazu im nächsten Abschnitt mehr) . Die übrigen Oberrubriken vom Seitentyp „Standard“ (symbolisiert durch das Icon einer Seite) mit ihren dazugehörigen Unterseiten, welche sich unter dem jeweiligen Punkt aufbauen, bilden die Sitestruktur ab. Das der Metanavigation vorangestellte Symbol ist ein-gegraut dargestellt und zeigt an, dass diese Seite vom Typ „Nicht im Menü“ ist, da dieser Bereich später bei der Generierung des Menüs (der Hauptnavigation) nicht beachtet wird. Die Erstellung der Metanavigation wird aufgrund des unterschiedlichen Erscheinungsbildes und der anders gearteten Funktion gesondert behandelt.