TYPO3, der Einsteig – Teil 2

Martin Hesse, 13.03.2009
TYPO3

TYPO3

Im zweiten Teil der Serie, zeige ich euch, wie das Backend von TYPO3 aufgebaut ist und was für Funktionen es verbirgt.

Das Backend von TYPO3 erreicht man normalerweise über den Unterordner “typo3” im Hauptverzeichnis. Beispiel: “http://www.example.com/typo3“.

Nach dem erfolgreichen Login stehen einem eine Vielzahl an Modulen zur Verfügung. Die in TYPO3 integrierten Module sind den Kategorien Web, Datei, User Tools, Admin Tools und Hilfe untergeordnet.

Anmerkung zum Screenshot:BackEnd Module
Die abgebildeten Module können von euren abweichen. Je nach installierter Extension, können neue Module oder Kategorien hinzukommen.

Web

In der Kategorie Web sind alle Module die zur Bearbeitung der Seite nötig sind. Darunter stehen einem auch Hilfsfunktionen bzw. Module zur Verfügung, die das erstellen bzw. bearbeiten von Seiten und/oder Inhalten vereinfachen.

Seite

An erster Stelle sitzt das “Seite”-Modul. Über dieses Modul können Inhalte gepflegt werden. Auf meinem Screenshot seht ihr in dem Icon ein kleines “TV” stehen, dies bedeutet das ich TemplaVoilà benutzte. Im normalen “Seite”-Modul ist das Icon ein wenig anders.

In der normalen Ansicht gibt es standardmäßig 4 Spalten. Diese Spalten teilen sich in den einzelnen Regionen der Seite auf und können frei im Template belegt und mit Inhalten befüllt werden.

"Seite"-Modul

"Seite"-Modul

Um die Bereiche Links, Normal, Rechts und Rand dem Template zuzuweisen, bedarf es ein wenig TypoScript.

seite = PAGE
seite.typeNum = 0
# DocType
seite.config.doctype = xhtml_trans
# Pfad zru CSS-Datei
seite.stylesheet = fileadmin/templates/stylesheet.css

seite.1 = TEMPLATE
seite.1 {
    template = FILE
    template.file = fileadmin/templates/index.html
    workOnSubpart = DOKUMENT

    # Linke Spalte
    marks.LINKS < styles.content.getLeft
    # Inhalt (mittlere Spalte)
    marks.INHALT < styles.content.get
    # Header (In TYPO3 "Border" genannt)
    marks.HEADER < styles.content.getBorder
    # Rechte Spalte
    marks.RECHTS < styles.content.getRight
}

In dem einfachen Beispiel werden die Marker einfach über “marks._name_ < styles.content.get_Spalte_” definiert. Im Template selber werden die Bereiche dann einfach via “###NAME###” zugeteilt.

<div id="wrap">
    <p id="header">###HEADER###</p>
    <div id="left">###LINKS###</div>
    <div id="right">###RECHTS###</div>
    <div id="content">###INHALT###</div>
</div>

Hat man TemplaVoilà im Einsatz, dann orientiert sich die Ansicht des “Seite”-Modul an das Template bzw. der Konfiguration in der Datenstruktur vom Template.

Ansicht des "Seite"-Modul mit TemplaVoilá

Ansicht des "Seite"-Modul mit TemplaVoilá

So kann man einfach und schnell Bereiche für sein Template einrichten und individuell mit Inhalten bestücken. Eines der großen Vorteile von TemplaVoilà. Auch verschachtelte Boxen sind möglich, Flexible-Content-Elements (FCE) genannt.

Mit FCE lassen sich verschachelte Blöcke in das Template einbauen.

Mit FCE lassen sich verschachelte Blöcke in das Template einbauen.

Anzeigen

Das “Anzeigen”-Modul beinhaltet eine Vorschau der Webseite. Mit einem Klick auf das Modul erscheint wie gewohnt der Seitenbaum und man kann dann auf eine Seite klicken um sich diese dann direkt anzuschauen.

Wer genauer hinschaut, dem fallen die kleinen Stifte auf. Mit einem klick auf diese, kann man die Inhalte zusätzlich bearbeiten. Das ganze funktioniert auch wenn man die Webseite normal aufruft und gleichzeitig im Backend angemeldet ist.

Liste

Über das Listen-Modul kann man sich alle Inhalte einer ausgewählten Seite übersichtlicht anzeigen lassen. Wenn man die erweiterte Listenansicht, über die am Seitenende befindliche Checkbox, aktiviert hat, kann man schnell und einfach seine Inhalte verwalten.

Normale Listenansicht

Normale Listenansicht

Erweiterte Listenansicht

Erweiterte Listenansicht

Auch ein Clipboard, für schnelles Kopieren oder Verschieben von mehreren Seiten, steht einem zur Verfügung.

Info

Das Info-Modul beherbergt Funktionen wie etwa eine Seitenbaum-Übersicht, eine Übersetzungs-Übersicht (für mehrsprachige Webseiten) und ein ausführliches Log (wer hat wann, welche Seite geändert).

Viel gibt es hier nicht zu erklären, da heißt es eher … einfach mal reinschauen und durchklicken.

Der aufmerksame Leser wird jetzt sagen, da gibt es aber noch ein paar Reiter mehr. Das ist korrekt aber die anderen Module gehen schon etwas weiter in die Materie und da dies ein Einsteiger-Tutorial ist, brauchen wir diese nicht und sind für uns lange Zeit erst einmal uninteressant.

Zugriff

Über das Zugriff-Modul kann man einzelnen Seiten/Sysfolder (etc.) bestimmte Gruppen und/oder Benutzer zuweisen. Dies macht dann Sinn, wenn man mehrere “normale” (das heißt, nicht Admin-User) Backendbenutzer hat und diesen bestimmte Seiten zum verwalten zuweisen möchte. Der Backendbenutzer, sofern kein “Admin”-User, kann ausschließlich die Seiten verwalten, die ihm zugewiesen sind.

Das Zugriff-Modul im Überblick. Im Moment besitzt ausschließlich der Benutzer "admin" die Rechte an den jeweiligen Seiten.

Das Zugriff-Modul im Überblick. Im Moment besitzt ausschließlich der Benutzer "admin" die Rechte an den jeweiligen Seiten.

In diesem Fenster können wir die Zugriffe der Seiten verwalten. Hier geben wir dem Benutzer "backendbenutzer" Rechte auf allen Seiten.

In diesem Fenster können wir die Zugriffe der Seiten verwalten. Hier geben wir dem Benutzer "backendbenutzer" und der Benutzergruppe "Backend-Benutzergruppe" Rechte auf allen Seiten (siehe Rekursiv anwenden).

Benutzer mit Admin-Zugriff können natürlich weiterhin diese Seiten verwalten.

Unser Ergebnis nach der Bearbeitung

Unser Ergebnis nach der Bearbeitung

Funktionen

Hier findet ihr ein paar Hilfsfunktionen die euch TYPO3 bereitstellt. So könnt ihr über den Punkt “Mehrere Seiten erzeugen” bis zu 9 Seiten auf einmal anlegen. Ein weiterer Hilfspunkt ist die Funktion “Seiten sortieren“. Mit dieser könnt ihr Seiten nach bestimmten Kriterien (Erstellungszeit, Name etc.) einfach und schnell sortieren.

Versionierung

In TYPO3 gibt es von Haus aus 2 “Arbeitsebenen”. Einmal die “LIVE-Arbeitsumgebung” (diese ist Standardmäßig aktiviert) und die “Entwurfsarbeitsumgebung”. Über den Menüpunkt Versionierung kann man jetzt alle Änderungen innerhalb der Arbeitsumgebungen koordinieren und publizieren. Besonders dann interessant wenn viele Personen an einer Webseite arbeiten.

Die Arbeitsebene könnt ihr jederzeit im Backend oben Rechts ändern

Die Arbeitsebene kann jederzeit im Backend oben Rechts geändert werden

Template

In diesem Abschnitt könnt ihr Seiten ein “Template” zuweisen. Dies hat jetzt aber nicht unbedingt viel mit einem Seitentemplate, sprich einer HTML-Vorlage zu tun. Ihr könnt hier vielmehr diverse Einstellungen über TypoScript tätigen und bestimmte Dinge, wie zum Beispiel CSS-Angaben, JS-Angaben, DocType etc., koordinieren.

Trackback - Direkt Link

6 Kommentare
Hinterlasse ein Kommentar »


  1. TYPO3, der Einstieg – Teil 2…

    Im zweiten Teil der Serie, zeige ich euch, wie das Backend von TYPO3 aufgebaut ist und was für Funktionen es verbirgt.Das Backend von TYPO3 erreicht man normalerweise über den Unterordner “typo3″ im Hauptverzeichnis. Beispiel: “http://www.example….

  2. wario sagt:

    Danke für Teil 2 !
    Beschäftige mich auch gerade mit Typo und bin schon auf die weiteren Teile gespannt.

    Grüsse aus Wien
    wario

  3. Martin Hesse sagt:

    @Wario,

    Danke für deine Meinung. Es kommt noch ein Teil, wo wir eine Webseite komplett selber machen. Danach bin ich gerne für Vorschläge usw. offen!

    Gruß,
    Martin

  4. Timoslav sagt:

    Super Martin!

    weiter so.
    freue mich schon auf die ersten Fortgeschrittenentutorials.

    greetz aus münchen

  5. Martin Hesse sagt:

    Hi Timoslav,

    schön von dir wieder zu hören! Danke, nach Ostern gibt es was neues wieder :-)

    Gruß,
    Martin

-