1 TYPO3 – ein Open-Source-CMS

21

1.1 Aufgaben eines Content-Management-Systems

21

1.2 Kommerzielles Produkt vs. Open Source

22

1.2.1 Hosting des CMS

23

1.2.2 Installation, Wartung und Erweiterbarkeit des Systems

24

1.2.3 Dokumentation des Systems

24

1.2.4 Unterstützung durch Dienstleister

25

1.2.5 Möglichkeit des lokalen Probebetriebs des CMS

25

1.3 TYPO3 als Web-Content-Management-System

26

1.3.1 Die Geschichte von TYPO3

26

1.3.2 Positionierung von TYPO3

27

1.3.3 Technische Hintergründe von TYPO3

28

1.4 Systemvoraussetzungen von TYPO3

29

1.5 Vergleich der Hostingmöglichkeiten für TYPO3

30

1.5.1 Einfacher Provider-Account mit PHP und MySQL

31

1.5.2 Spezialisierter TYPO3-Hoster

32

1.5.3 TYPO3 auf eigenem Server

32

2 Installation von TYPO3 CMS 6.2 LTS

35

2.1 Voraussetzungen für die Installation von TYPO3

36

2.2 Das Installationspaket von TYPO3 CMS 6.2 LTS

37

2.3 Arbeitsverzeichnis und TYPO3-Source

38

2.3.1 Anbinden des Arbeitsverzeichnisses mit symbolischen Links

39

2.4 Der Installationsvorgang von TYPO3 CMS 6.2 LTS

43

2.4.1 Phase 1 – Check der TYPO3-Umgebung

44

2.4.2 Phase 2 – Anbindung des Datenbanksystems

48

2.4.3 Phase 3 – Erstellung der Datenbank für das CMS

49

2.4.4 Phase 4 – Backend-User erstellen und Datenimport

51

2.4.5 Phase 5 – Abschluss der Installation

52

2.4.6 Bugfix – Reparatur der OpenSSL-Installation

53

2.5 Konfiguration über das Backend-Install-Tool

56

2.5.1 Login am Backend-Install-Tool

57

2.5.2 Neusetzen des Backend-Install-Tool-Passworts

58

2.5.3 Die Systemumgebung im Install Tool

60

2.5.4 Install Tool – die Configuration Presets

62

2.5.5 Installation von GraphicsMagick

64

2.6 Test der Umgebung im Test-Setup des Install Tools

65

2.6.1 Test von E-Mail-Versand und Fonteinstellung

65

2.6.2 Test der grafischen Funktionen

67

2.7 Finetuning mit »All Configuration«

73

2.8 Der Upgrade Wizard und die Folder Structure

74

2.9 Aufräumen im Clean-up-Bereich des Install Tools

75

2.10 Kurz vor Schluss – »Important actions« im Install Tool

76

2.10.1 Der »Database Analyzer«

77

2.10.2 Die Option »Clear all cache«

77

2.10.3 Nach fehlerhaften Erweiterungsinstallationen suchen

77

2.10.4 Update des System-Cores

78

2.10.5 Ändern des Passworts für das Install Tool

78

2.10.6 Ändern des Website-Namens

79

2.10.7 Ändern des Verschlüsselungsstrings

79

2.10.8 Einen Backend-Administrator erstellen

79

3 Das Backend kennenlernen

81

3.1 Einloggen im Backend

81

3.2 Die Die Bereiche des Backends

81

3.3 Modulgruppen und Module

82

3.4 Übersicht über die Modulgruppen

83

3.4.1 Die Modulgruppe »Web« (Web)

84

3.4.2 Die Modulgruppe »Datei« (File)

85

3.4.3 Die Modulgruppe »Benutzerwerkzeuge« (User Tools)

85

3.4.4 Die Modulgruppe »Adminwerkzeuge« (Admin Tools)

86

3.4.5 Die Modulgruppe »System« (System)

86

3.4.6 Die Modulgruppe »Hilfe« (Help)

88

3.5 Die Benutzereinstellungen

89

3.5.1 Das Passwort des Administrator-Accounts ändern

89

3.6 Einstellung der deutschen Benutzeroberfläche

90

3.6.1 Wahl der Backend-Sprache in den Benutzereinstellungen

90

3.6.2 Download des Sprachpakets über das Modul »Language«

91

3.6.3 Sprachwechsel auf Benutzerebene

92

3.7 Der Erweiterungsmanager

93

4 Seiten anlegen

97

4.1 Der TYPO3-Seitenbaum

97

4.1.1 Anlegen von neuen Seiten über das Kontextmenü des Root-Icons

97

4.1.2 Neue Seite mit Drag & Drop

100

4.1.3 Änderungen der Seiteneigenschaften

102

4.2 Kontextmenüs und Shortcut-Buttons

103

4.2.1 Das Kontextmenü eines Seitenelements

104

4.2.2 Das Untermenü »Seitenaktionen«

105

4.2.3 Das Untermenü »Teilbereichsaktionen«

107

4.2.4 Ein- und Ausklappen von Seitenbaumzweigen

108

4.3 Verwenden des Papierkorbs

109

4.3.1 Seiten aus dem Papierkorb wiederherstellen

110

4.3.2 Seiten aus dem Papierkorb löschen

111

4.4 Manipulation des Seitenbaums

112

4.4.1 Kopieren über das Kontextmenü

113

4.4.2 Kopieren und Verschieben per Drag & Drop

116

4.4.3 Der Bearbeitungsverlauf – Arbeitsschritte wiederherstellen

117

4.4.4 Rekursives Löschen und Kopieren

120

4.4.5 Kontextmenüs vs. Shortcut-Buttons

123

4.4.6 Lesezeichen

126

4.4.7 Pfadangabe zum bearbeiteten Objekt

128

4.5 Filtern der Seitenbaumansicht

129

4.6 Eine Seite anzeigen

130

4.7 Zusammenfassung

131

5 Einstieg in TypoScript

133

5.1 Das Konzept des TYPO3-Templates

134

5.1.1 Ein Template ist eine Darstellungsvereinbarung

134

5.1.2 Ein Template ist TypoScript

134

5.2 Anlegen und Verwalten von Templates

135

5.2.1 Hallo Welt!

136

5.2.2 Aufbau des Template-Datensatzes

137

5.2.3 Template-Setup mit dem Konfigurationsfeld

139

5.2.4 Erste Gehversuche in TypoScript

141

5.2.5 Das Wrap-Prinzip anhand des TEXT-Objekts

143

5.2.6 Mehr Komplexität durch Content-Object-Arrays (COA)

145

5.2.7 Kopieren, Referenzieren und Löschen von Objekten in TypoScript

147

5.2.8 Der Quelltext einer TYPO3-Seite

153

5.3 Vererbung von TypoScript-Templates

155

5.3.1 Erweiterungs-Templates auf Unterseiten

157

5.4 Der TypoScript-Objekt-Browser

161

5.4.1 Arbeit mit dem TypoScript-Objekt-Browser

161

5.5 Einsatz von Konstanten im TypoScript-Template

164

5.5.1 Was versteht man in TypoScript unter Konstanten?

165

5.5.2 Die Syntax für Deklaration und Referenz einer Konstante

165

5.5.3 Der Einsatz von Konstanten

166

5.5.4 Editieren von Konstanten im Konstanten-Editor

167

5.5.5 Konstanten über Kategorien kennzeichnen

167

5.5.6 Produktive Arbeit mit dem Konstanten-Editor

169

5.6 Das Template-Analyse Tool

170

5.7 Löschen von Templates oder Erweiterungs-Templates

174

5.7.1 Löschen über das Modul »Web • Template«

174

5.7.2 Löschen über das Modul »Web • Liste«

175

5.7.3 Das versehentliche Löschen eines Templates rückgängig machen

177

5.7.4 Undelete eines gelöschten Templates mit dem Recycler

178

6 Seitenlayout mit TypoScript

181

6.1 Bereitstellen von Grafikressourcen

181

6.1.1 Datei-Upload über die Dateiliste (Fileadmin)

182

6.1.2 Erstellen neuer Ordner und Upload von Dateien in Fileadmin

183

6.1.3 Eine Kopfgrafik mit dem IMAGE-Objekt einbinden

186

6.2 Ein HTML-Layout mit TypoScript

187

6.2.1 Ein einfaches CSS-Styling für das »Div«-Layout

188

6.2.2 Erzeugen einer Stylesheet-Datei mit TypoScript

189

6.2.3 Textressourcen – der Inhalt der Fußzeile als externe Datei

191

6.2.4 Anlegen von Seiteninhalten

192

6.2.5 Ausgabe der Inhaltselemente in das HTML-Dokument

197

6.2.6 Einbinden des statischen Template-Moduls »CSS Styled Content«

198

6.3 Erzeugen des Navigationsmenüs

199

6.4 Einsatz von Konstanten zur Konfiguration

204

6.5 Ausblick

208

7 Seiteninhalte anlegen

209

7.1 Erzeugen einer Sitestruktur mit dem Modul »Funktionen«

209

7.1.1 Unterseiten zur aktuellen Seite erzeugen

210

7.2 Einführung in die Seiteninhaltstypen von TYPO3

212

7.2.1 Seiteninhalt »Normaler Text« (CType: text)

212

7.2.2 Setzen von Links im Seiteninhalt

220

7.2.3 Der Seiteninhalt »Aufzählung« (CType: bullet)

225

7.2.4 Der Seiteninhalt »Text und Bilder« (CType: textpic)

228

7.2.5 Der Seiteninhalt »Bilder« (CType: image)

238

7.2.6 Der Seiteninhalt »Tabelle« (CType: table)

242

7.2.7 Der Seiteninhalt »HTML« (CType: html)

246

7.2.8 Der Seiteninhalt »Trenner« (CType: div)

248

7.2.9 Der Seiteninhalt »Dateilinks« (CType: uploads)

249

7.2.10 Erstellen eines Kontaktformulars

252

7.2.11 Seiteninhalte sortieren, kopieren, löschen und referenzieren

266

7.2.12 Referenzen mit dem Seiteninhalt »Datensatz einfügen«

270

7.3 Zusammenfassung und Ausblick

274

8 Einstieg in Designvorlagen

275

8.1 Von TypoScript zur HTML-Designvorlage

275

8.2 Die TYPO3-Template-Engine

276

8.2.1 Voraussetzungen für Designvorlagen

278

8.2.2 Markierungen und Teilbereiche in der Designvorlage

279

8.3 Die Designvorlage überarbeiten

281

8.4 Eine neue Website erstellen

283

8.4.1 Eine neue Seitenstruktur

284

8.4.2 Ein neues Template

285

8.5 Das TEMPLATE-Objekt

286

8.5.1 Die Designvorlage einlesen

286

8.5.2 CSS der Designvorlage einbinden

288

8.5.3 Den Body-Bereich der Vorlage markieren

289

8.5.4 Subparts und Marker der Vorlage über TypoScript ansprechen

290

8.5.5 Neues von »CSS Styled Content«

292

8.5.6 Die Markierung für den Footer ansprechen

294

8.5.7 Den Teilbereich für die Navigation ansprechen

295

8.6 Zusammenfassung und Ausblick

297

9 Menüs erstellen mit TypoScript

299

9.1 Die Websitestruktur des Beispielprojekts anpassen

300

9.2 Das Basisobjekt »HMENU«

300

9.2.1 Die Eigenschaft »entryLevel« von HMENU

301

9.3 Textmenüs mit dem Objekttyp »TMENU«

302

9.3.1 Einfaches Textmenü

302

9.3.2 Textmenü mit Untermenü

303

9.3.3 Weitere Zustände der Textmenü-Items

307

9.3.4 Eine Seite aus dem Menü ausblenden

313

9.4 Das Rootline-Menü erzeugen

314

9.4.1 Die Eigenschaft »special« von HMENU

315

9.4.2 Das Property »special.range« von HMENU

315

9.4.3 Gezielte Darstellung über Optionsplit

317

9.4.4 Den Link für die aktuelle Seite entfernen

318

9.5 Das »Globals«-Menü

319

9.5.1 Den Seitenbaum für das »Globals«-Menü anpassen

319

9.5.2 Das »HMENU«-Objekt für das »Globals«-Menü

320

9.6 Eine Sitemap für die Projektwebsite

321

9.7 Zusammenfassung und Ausblick

324

10 Die mehrsprachige Website

325

10.1 Einrichtung weiterer Sprachen

325

10.1.1 Die Sprachvariante in der Website über das Listen-Modul anlegen

325

10.1.2 Die Sprachvariante einer Seite anlegen

327

10.1.3 Die Eingabemaske für eine alternative Sprache

328

10.1.4 Inhalte zweisprachig anlegen

333

10.1.5 Die Definition der Sprachauswahl im Template

334

10.2 Eine neue Designvorlage

335

10.2.1 Die Designvorlage austauschen

336

10.3 Mehrsprachige Menüs

337

10.3.1 Konfiguration im Haupt-Template

337

10.4 Die rechte Inhaltsspalte der Designvorlage

341

10.4.1 Inhalt für die rechte Spalte anlegen

341

10.4.2 Im Template die rechte Spalte ausgeben

341

10.5 Zusammenfassung und Ausblick

342

11 Passwortgeschützte Bereiche

343

11.1 Website-Benutzer und -Benutzergruppen

343

11.1.1 Einrichten eines Systemordners für Frontend-Benutzer

344

11.1.2 Anlegen von Frontend-Benutzern und FrontendBenutzergruppen

345

11.1.3 Erfassungsmaske für Frontend-Benutzergruppen

346

11.1.4 Erfassungsmaske für Frontend-Benutzer

347

11.1.5 Ansicht des Systemordners im Modul »Liste«

349

11.1.6 Konfiguration im TypoScript-Template

349

11.1.7 Definieren der Zugriffsbeschränkung

350

11.1.8 Das Login-Formular für Frontend-Benutzer

351

11.2 Einsatz von Untergruppen

355

11.3 Ein Login-Formular auf allen Seiten

359

11.3.1 Ein Login-Formular in einem SysOrdner

360

11.3.2 Einfügen des Login-Formulars in das Seitenlayout

361

11.4 Zusammenfassung und Ausblick

362

12 Integration von Erweiterungen

363

12.1 Volltextsuche mit »Indexed Search«

363

12.1.1 Die Erweiterung »Indexed Search«

364

12.1.2 Die Erweiterung »Indexed Search« aktivieren

364

12.1.3 Die Ergebnisseite »Suche« konfigurieren

365

12.1.4 Die Indexierung im Template einschalten

367

12.1.5 Das Suchformular der HTML-Designvorlage anbinden

368

12.1.6 Mehrsprachigkeit des Suchfeldes

369

12.1.7 Die Indexierung überprüfen

369

12.1.8 Spracheinstellung

371

12.1.9 Die Ausgabe formatieren

372

12.1.10 Externe Dateien indexieren

373

12.2 Einsatz der Erweiterung »news«

375

12.2.1 Import und Installation der »News«-Erweiterung

375

12.2.2 Konfiguration der »news«-Erweiterung

377

12.2.3 Installieren der Backend-Übersetzung

380

12.2.4 Einfügen des statischen Template-Moduls »News« ins Setup

381

12.2.5 Anpassungen im Seitenbaum

382

12.2.6 Eine Newsmeldung erstellen

383

12.2.7 Arbeiten mit dem Administrationsmodul für News

388

12.2.8 Einfügen des News-Plug-Ins in die Startseite (Listenansicht)

391

12.2.9 Die Detailansicht einer Newsmeldung

395

12.2.10 Die Nachrichtenübersicht auf der Seite »News«

397

12.2.11 Das Newsarchiv für ältere Meldungen

399

12.2.12 Das News-Plug-In und seine Archiveinstellung

401

12.2.13 Mehrsprachige Newsmeldungen

402

12.2.14 Installation der Erweiterung »static_info_tables«

403

12.2.15 Lokalisierung des Datensatzes der Website-Sprache

404

12.2.16 Lokalisation und Übersetzung der Newsmeldungen

405

12.2.17 Den Strict Language Mode mit TypoScript erzwingen

407

12.2.18 Anlegen von Kategorien

408

12.2.19 Filtern nach Kategorien

410

12.2.20 Ausgabe von News nach Kategorien

411

12.3 Zusammenfassung und Ausblick

412

13 Rechtevergabe im Backend

413

13.1 Benutzergruppen für das Beispielprojekt

413

13.1.1 Erstellung von Verzeichnisfreigaben

415

13.2 Festlegung der Gruppenrechte

417

13.2.1 Einstellungen für die Gruppe »Redakteure«

417

13.2.2 Die Einstellungen der anderen beiden Gruppen

422

13.3 Anlegen der Einzelnutzer

423

13.4 Zugriff auf den Seitenbaum erlauben

426

13.4.1 Untergruppen und die Vermischung von Rechten

429

13.5 Eine weitere Gruppe für die Seitenbaumrechte

430

13.5.1 Eine neutrale Benutzergruppe kommt zu Hilfe

431

13.5.2 Eigentumsverhältnisse neuer Seiten

432

13.6 Zusammenfassung und Ausblick

433

14 Templates mit Fluid

435

14.1 Was ist Fluid?

435

14.2 Ablage der Template-Dateien für das Fluid-Layout

436

14.2.1 Die Ordnerstruktur im Fileadmin

436

14.3 Einbinden der Fluid-Designvorlage

437

14.4 Viewhelper und Variable

440

14.4.1 Die Fluid-Eigenschaft »variables«

440

14.4.2 Der Interpolationsausdruck im Template

441

14.4.3 Bessere Steuerung der Ausgabe mit Viewhelper

442

14.5 Weitere Inhaltsspalten zuweisen

444

14.6 Navigation und weitere Elemente hinzufügen

446

14.6.1 Die Hauptnavigation

446

14.6.2 Sprachumschaltung, Rootline, Suchfeld und globale Navigation

447

14.6.3 Library-Objekte und cObject-Viewhelper

451

14.7 Ein Backend-Layout für die Fluid-Site

454

14.7.1 Erstellen des Backend-Layouts

454

14.7.2 Zuweisen des Backend-Layouts

456

14.8 Mehr Flexibilität mit Layouts und Partials

457

14.8.1 Die Elemente eines mehrteiligen Fluid-Templates

458

14.8.2 Template vs. Layout

460

14.8.3 Layout vs. Template und Partials

461

14.8.4 Anatomie des Templates

461

14.8.5 Anatomie des Layouts

463

14.8.6 Anatomie eines Partials

464

14.8.7 Drei-, zwei- und einspaltiges Layout mit Fluid

466

14.9 Kopplung von Backend-Layout und View

471

14.9.1 Das modifizierte Setup zur Template-Umschaltung – das cObject »CASE«

473

14.9.2 Die verbesserte Template-Umschaltung

475

14.10 Mehr über Viewhelper

477

14.10.1 Bisher eingesetzte Viewhelper

477

14.10.2 Der Viewhelper »f:debug«

478

14.10.3 Der Viewhelper »f:comment«

482

14.10.4 Die Viewhelper »f:if«, »f:then« und »f:else«

483

14.10.5 Die Viewhelper »f:switch« und »f:case«

484

14.10.6 Der Viewhelper »f:alias«

486

14.11 Noch mehr Flexibilität mit intelligenten Partials

487

14.11.1 Drei Templates, aber nur noch ein Layout

487

14.11.2 Logik im Partial mit »if«-Viewhelper

489

14.11.3 Logik im Partial mit »switch«-Viewhelper

491

14.11.4 Logik im Setup und »alias«-Viewhelper im Partial

493

14.12 Zusammenfassung und Ausblick

496

15 Layout mit TemplaVoilà

497

15.1 Installation der Erweiterung »TemplaVoilà«

497

15.2 Einbinden einer HTML-Designvorlage mit TemplaVoilà

498

15.2.1 Vorarbeiten – Anlegen eines SysOrdners

498

15.2.2 Einbinden von TemplaVoilà ins TypoScript-Template

499

15.3 Mapping der Dokumentvorlage

500

15.3.1 Mapping des Dokumentkörpers

501

15.3.2 Erstellen eines weiteren Bereichs

504

15.3.3 Speichern des Mappings und Betrachten der Datenstruktur

507

15.3.4 Fortführen des Mapping-Vorgangs

513

15.4 Arbeiten mit dem TemplaVoilà-Template

515

15.4.1 Einbinden der Stylesheet-Datei

516

15.4.2 Einfügen der Inhalte

517

15.5 Recyceln der bisher verwendeten Inhalte

518

15.6 Flexible Content-Elemente

521

15.6.1 Kopieren und Modifizieren von TO- und DS-Objekten

521

15.6.2 Modifizieren eines TV-Templates

523

15.6.3 Mapping eines flexiblen Content-Element

524

15.6.4 Einsatz der flexiblen Content-Elemente

528

15.7 Zusammenfassung und Ausblick

532

16 TypoScript – eine Kurzreferenz

533

16.1 Wo wird TypoScript in TYPO3 eingesetzt?

533

16.2 TypoScript – die Grundlagen

534

16.2.1 Ähnlichkeiten und Unterschiede zu Programmiersprachen

534

16.2.2 Operatoren in TypoScript

535

16.2.3 Bedingungen (Conditions)

537

16.2.4 Datentypen in TypoScript

540

16.3 Die Objektmetapher von TypoScript

541

16.3.1 Einteilung der Objekttypen

541

16.3.2 Wertzuweisung an Objekt-Propertys

542

16.3.3 Bildung von Objektinstanzen

543

16.3.4 Objektzugehörige Arrays

546

16.4 Seiten definieren – das »PAGE«-Objekt

547

16.4.1 Benennung der Objektinstanzen

547

16.4.2 Das Top-Level-Objekt »PAGE«

548

16.5 Inhalt einbinden – Content-Objekte

555

16.5.1 Das cObject »COA«

557

16.5.2 Das cObject »FILE«

558

16.5.3 Das cObject »CONTENT«

559

16.5.4 Das cObject »TEMPLATE«

562

16.5.5 Das cObject »FLUIDTEMPLATE«

565

16.5.6 Das cObject »TEXT«

565

16.5.7 Das cObject »HTML«

566

16.5.8 Das cObject »IMAGE«

567

16.5.9 Das cObject »IMAGE_RESOURCE«

568

16.6 Menüs erstellen – Menüobjekte

569

16.6.1 Das Objekt »HMENU«

569

16.6.2 Das Objekt »TMENU«

574

16.6.3 Das Objekt »TMENUITEM« (NO, ACT, CUR etc.)

575

16.6.4 Quelltextbeispiel: Textmenü mit TypoScript

580

16.7 Userkonfiguration – das cObject »EDITPANEL«

581

Anhang

583

A Installation von XAMPP

583

A.1 XAMPP unter Windows

583

A.2 XAMPP unter Linux

587

A.3 XAMPP unter Mac OS X

589

A.5 Dokumentation von XAMPP

594

B Backup mit phpMyAdmin

595

B.1 Was ist phpMyAdmin?

595

B.2 Dump der TYPO3-Datenbank mit phpMyAdmin

597

B.3 Wichtige Tabellen der TYPO3-Datenbank

601

C Onlineressourcen

607

C.1 Onlineressourcen zu TYPO3

607

C.2 Weitere Onlineressourcen

609

D Inhalt der Begleit-DVD

611

D.1 Installation

611

D.2 Erweiterungen

612

D.3 Dateien zum Buch

612