Die Anwendung

Jetzt aber flux zur Praxis, wir wollen doch endlich was mit unsere geplanten Seite anfangen.

Wir haben uns ja bereits eine HTML-Vorlage gebastelt, die müssen wir öffnen und einige Modifikationen vornehmen.
Wir müssen ja Typo3 mitteilen, wohin was auf der Seite kommen soll. Dazu bedienen wir uns Platzhalter.

Es gibt 2 Platzhalter, Marker und Supparts.

Marker

Marker sind Variablen, die einfach im Template stehen, z.B.
###MARKER1### ###MARKER2### ###MARKER3###

Typo3 erkennt die Marker an den 3 Rauten vor und hinter dem Namen. Es muss keine Grossschreibweise genommen werden, aber zur besseren Erkennung hat sich das so eingebürgert.

Subparts

TypoScript
<!-- ###SUBPART### start -->
Dieser Text taucht nur solange auf, wie der SUBPART nicht per TS ersetzt wurde. - ERROR: Line 2: Object Name String, "Dieser" was not preceded by any operator, =<>({
<!-- ###SUBPART### end -->

Supparts bestehen immer aus 2 Teilen, dem Anfang und dem Ende. Sie stehen in HTML-Kommentaren, das anfang und ende ist nicht nötig und dient nur unserer Orientierung. Der Vorteil bei Subparts besteht darin, das sie bei Betrachtung der Vorlage im Browser nicht sichtbar sind und der Teil dazwischen angezeigt wird.
Wenn Typo3 diesen Suppart ersetzt, verschwindet alles zwischen den Subparts und wird von Typo3 ersetzt.

Der Einsatz dieser Variablen ist also Geschmackssache, ich benutze im Folgenden die Marker, hier sehen wir auf der Seite auch immer die Marker, die noch nicht angesprochen werden.
Damit Typo3 überhaupt weiss, welcher Teil der Vorlage zu benutzen ist, muss dieser Teil mit Subparts gekennzeichnet sein.

Hier ist unsere Vorlage, nun mit Markern und dem Subpart ausgestattet:

HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
	"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<link rel="stylesheet" href="../css/site.css" media="screen,projection">
<title></title>
 
</head>
 
<body>
<!-- ###DOKUMENT### start -->
<div id="komplett">
	<div id="header">###LOGO###</div>
	<div id="menuline">###TOPMENU###</div>
	<div id="left">###LINKS###</div>
	<div id="content">###INHALT###</div>
	<div id="footer">###FOOTER###</div>
</div>
<!-- ###DOKUMENT### end -->
</body>
</html>

Wir speichern die Vorlage wieder. Nun wollen wir die Vorlage auch benutzen. Uns fällt auf, das der Arbeitsbereich von Typo3 innerhalb der Body-Tags ist, der Header wird also von typo3 erzeugt.

Wir begeben uns also wieder in unser BE und öffnen das Setup-Feld unseres Templates.
Dort steht immer noch folgendes:

TypoScript
# Default PAGE object:
page = PAGE
page.10 = TEXT
page.10.value = HELLO WORLD!

Wir erkennen, es gibt in Typo3 den Objekttyp PAGE. Dies ist wohl mit der wichtigste Objekttyp, da sich alles auf die Seite bezieht.
Ein Unterobjekt hat den Objekttyp TEXT und kann über value einen Wert zugewiesen bekommen. Dies ist wohl das einfachste Objekt von Typo3.

Wir wollen aber keinen statischen Text haben sondern natürlich unsere Vorlage benutzen. Hier die einfache Einbindung:

TypoScript
page = PAGE
page {
	bodyTag = <body>
	includeCSS {  
    	file1 = fileadmin/css/site.css
	}
	
	10 = TEMPLATE
	10 {
    	template = FILE
    	template.file = fileadmin/templates/template.html

    	workOnSubpart = DOKUMENT
		marks {
		
		
		}
	}
}

Wir haben also eine Seite (page) definiert.
Dieser Seite haben wir einen leeren bodytag zugewiesen (defaultmässig schreibt Typo3 nämlich <body bgcolor="#FFFFFF">)
Dann haben wir die CSS-Datei zugewiesen. Hier haben wir den Syntax mit includeCSS gewählt, damit wir später einfach weitere CSS-Dateien einbinden können (file2 =, file3 = etc.)

Das Unterobjekt 10 wird zum Template. Diesem Template wird unsere Vorlage zugewiesen, der Arbeitsbereich (workOnSubpart) und ein noch leere Raum für die Marker (marks)

Wir speichern unser Template und klicken auf die Lupe. Jetzt müssten wir folgendes zu sehen bekommen:

Ah, es funktioniert, wir haben unsere Vorlage erfolgreich eingebunden

Bevor wir dazu übergehen, unsere Marker anzusprechen, mach ich erst mal Schluss für heute und bin gespannt auf Eure Erfolgsmeldungen.

Wir können natürlich auf die Schnelle mal ausprobieren, ob die Marker auch richtig angesprochen werden. Hierzu schreiben wir folgendes innerhalb von
marks { ... } :

TypoScript
INHALT = TEXT
INHALT.value = <h1>Meine erste Typo3-Seite</h1><p>Ach wie schön, das es doch so einfach funktioniert !</p>

Dieser Text müsste nun in unserem Inhaltsbereich erscheinen - es scheint alles wunderbar zu funktionieren

Typo3