TYPO3-Anleitung: So erstellen Sie Ihre eigene Website mit TYPO3

Content-Management-Systeme sind eine ausgezeichnete Lösung für jeden, der eine Website erstellen möchte, deren Pflege und inhaltliche Gestaltung für alle Beteiligten auch mit geringem, technischen Know-how möglich ist. Die Website-Management-Lösungen, die sich häufig durch ihre hohe Flexibilität und Erweiterbarkeit auszeichnen, verfügen nämlich über benutzerfreundliche Front- und Backends, in die sich auch Neulinge mit ein wenig Zeit und Mühe einarbeiten können. Zu den beliebtesten CMS zählt das bereits im Jahr 2000 veröffentlichte Open-Source-Programm TYPO3. Wie richten Sie dieses ein und nutzen es für Ihre Website?

Günstige Webhosting-Pakete von IONOS!

Vertrauen Sie auf flexibel skalierbares und zuverlässiges Webhosting inklusive persönlichem Berater mit IONOS!

Kostenlose Domain
inkl. SSL Wildcard Zertifikat
30-Tage-Geld-Zurück-Garantie

Was ist TYPO3?

TYPO3, das seit Oktober 2012 offiziell unter dem Namen TYPO3 CMS vertrieben wird, ist ein plattformunabhängiges Content-Management-System, das ursprünglich von Kasper Skårhøj entwickelt wurde. Es ist in der Skriptsprache PHP geschrieben und steht unter der GNU-GPL-Lizenz, was die Mitarbeit der sehr großen Community von Beginn an stark gefördert hat: So stehen mittlerweile tausende kostenfreie Extensions von Drittanbietern zur Verfügung, mit deren Hilfe sich der Funktionsumfang von TYPO3 beliebig erweitern lässt. Als Datenbank-Management-System für ein TYPO3-Projekt können Sie alle gängigen SQL-basierten Lösungen wie den Klassiker MySQL oder Alternativen wie MariaDB und PostgreSQL einsetzen.

Hinweis

TYPO3 ist ein sehr flexibles Content-Management-System, das aufgrund seiner Komplexität jedoch nicht unbedingt zu den einsteigerfreundlichsten Lösungen auf dem Markt zählt. Wer jedoch die erforderliche Geduld und Zeit mitbringt, kann nahezu jede Art von Website mit TYPO3 erstellen. Dabei zeigt die Open-Source-Lösung insbesondere dann ihre Stärken, wenn es darum geht, ein oder mehrere Webprojekte im Team zu verwalten. Außerdem ist TYPO3 auf Mehrsprachigkeit ausgelegt, weshalb es eine ausgezeichneteWahl für mehrsprachige Websites darstellt.

TYPO3 einrichten und installieren: Voraussetzungen und Vorgehensweise

Wenn Sie Ihre eigene TYPO3-Website erstellen wollen, gilt es zunächst, die passenden Hosting-Strukturen zu schaffen. So benötigen Sie einerseits ein Hardware-Set-up, das genügend Speicherplatz und Rechenpower für das Content-Management-System inklusive aller verwendeten Erweiterungen bietet. Andererseits müssen ein Webserver mit PHP-Unterstützung (z. B. Apache, NGINX oder IIS) sowie eine SQL-Datenbank wie die bereits genannten MySQL, MariaDB oder PostgreSQL installiert sein und ebenfalls genügend Hardware-Ressourcen für den reibungslosen Betrieb zur Verfügung haben. Für die Kommunikation mit dem Webserver benötigen Sie darüber hinaus einen FTP-Client wie FileZilla.

Entscheiden Sie sich also im ersten Schritt, ob Sie einen eigenen Server betreiben oder ob Sie TYPO3 und die erforderlichen Webprogramme im Rechenzentrum eines Hosting-Providers hosten möchten. Anschließend installieren Sie die genannten Server- und Datenbank-Anwendungen, wobei Sie sich an Software-Stacks wie LAMP oder XAMPP orientieren können, die ein perfekt aufeinander abgestimmtes Paket mit entsprechenden Komponenten aufweisen.

Hinweis

Hosting-Provider bieten häufig spezielle Installationsservices für Content-Management-Systeme wie WordPress, Joomla oder auch TYPO3 an. Mit TYPO3 Hosting hat auch IONOS eine solche Lösung für TYPO3 im Repertoire, bei der Sie nicht nur die erforderlichen Server-Ressourcen erhalten, sondern das CMS inklusive Datenbank, FTP-Client und Webserver auch mit wenigen Klicks über das IONOS App Center installieren können.

Sobald Sie das erforderliche Hardware- und Software-Gerüst für TYPO3 eingerichtet haben, können Sie das Content-Management-System installieren. Hierfür müssen Sie die Installationsdateien, die Sie auf der offiziellen TYPO3-Website herunterladen, via FTP auf den Webspace übertragen und den Server mit einer gültigen Domain-Adresse verknüpfen.

Domain Check
  • .de
  • .com
  • .org
  • .info
  • .blog

Haben Sie diesen Schritt durchgeführt, starten Sie die Installation, indem Sie die Startseite Ihrer neuen TYPO3-Website im Browser Ihrer Wahl aufrufen und danach den Anweisungen des Einrichtungsassistenten folgen. Eine ausführliche Beschreibung der erforderlichen Installationsschritte inklusive der Verknüpfung mit dem Datenbank-Management-System finden Sie in unserer Installationsanleitung für TYPO3.

Website mit TYPO3 erstellen: Schritt-für-Schritt-Tutorial

Nach der Installation können Sie damit beginnen, Ihre erste TYPO3-Website zu erstellen. Wie für Content-Management-Systeme üblich, bietet auch TYPO3 ein sogenanntes Backend, über das Sie alle relevanten Aufgaben erledigen können.

So ist das TYPO3-Backend Dreh- und Angelpunkt für die Konzipierung, Administration und Überwachung Ihres Webprojekts, denn im Backend treffen Sie nicht nur alle wichtigen Einstellungen, sondern erstellen und verwalten auch Nutzerprofile sowie das Layout und Design der Webseiten. Zudem können Sie hier Zugriffsstatistiken und die Bearbeitungshistorie einsehen sowie zusätzliche Funktionen und Templates installieren. Der Backend-Administrator legt dabei bereits beim Anlegen neuer Benutzerprofile fest, welche Funktionen für die einzelnen Nutzerrollen verfügbar sein sollen, sodass Redakteure oder Moderatoren beispielsweise lediglich neue TYPO3-Seiten erstellen und mit Inhalten füllen oder bereits veröffentlichte Artikel bearbeiten und moderieren können.

Hinweis

Erweiterungen in TYPO3 heißen Extensions. Sie werden hauptsächlich von der Community entwickelt und im offiziellen TYPO3 Extension Repository zum kostenfreien Download veröffentlicht. Extensions können das Content-Management-System sowohl um neue Funktionen als auch um neue Editoren oder Layouts und Designs (Templates) erweitern.

Um Ihnen den Einstieg in das Backend und die Website-Erstellung mit TYPO3 zu vereinfachen, haben wir in den folgenden Abschnitten die wichtigsten Schritte auf dem Weg zur ersten TYPO3-Seite für Sie zusammengefasst.

Schritt 1: Anmeldung im TYPO3-Backend

Für die Anmeldung im TYPO3-Backend benötigen Sie die Log-in-Daten, die Sie bei der vorangegangenen Installation erstellt haben. Zu diesem Zweck rufen Sie über Ihren Browser die URL „http://domain-der-website/typo3“ auf und geben den entsprechenden Nutzernamen sowie das Passwort ein:

Schritt 2: Backend-Sprache auf Deutsch umstellen

Das TYPO3-Backend erscheint standardmäßig in englischer Sprachausgabe, hält jedoch einsatzfertige Pakete für diverse weitere Sprachen bereit. Wollen Sie die Benutzeroberfläche also z. B. lieber auf Deutsch nutzen, müssen Sie nur das entsprechende Paket installieren. Klappen Sie zu diesem Zweck das linke Seitenmenü aus (über das Drei-Balken-Symbol) und wählen Sie den Eintrag „Languages“:

Klicken Sie in der Zeile „German“ zunächst auf das Plus-Zeichen und anschließend auf den Download-Button. War das Herunterladen erfolgreich, zeigt der Fortschrittsbalken 100 Prozent an:

Im Administratorenmenü „User Settings“, das sich über die Schaltfläche „Admin“ (befindet sich oben rechts) öffnen lässt, können Sie nun Deutsch als präferierte Sprache auswählen und die Änderungen über den Save-Button speichern.

Schritt 3: Backend-Benutzer(gruppen) erstellen

Bis zum jetzigen Zeitpunkt ist das Administratorenkonto das einzige Nutzerkonto, mit dem Sie auf das Backend zugreifen können, um Ihre TYPO3-Website zu erstellen. Sollen auch andere Personen die Homepage mitgestalten und im späteren Verlauf mit Content versorgen können, müssen Sie entsprechende Benutzer und Benutzergruppen anlegen. Gleiches gilt, wenn Sie Ihren Website-Besuchern die Möglichkeit gewähren wollen, sich auf Ihrer Seite zu registrieren, um Zugang zu spezifischen Inhalten zu erhalten.

Beginnen Sie am besten damit, eine erste Benutzergruppe für alle Personen, die an der Kreation und Verwaltung der TYPO3-Website beteiligt sind, zu erstellen. Hierfür klicken Sie im Hauptmenü auf „Backend-Benutzer“, wählen in der oberen Liste „Backend-Benutzergruppen“ aus und drücken dann auf „Neuen Datensatz erstellen“:

Nun geben Sie einen Namen für die neue Benutzergruppe ein und wechseln in den Tab „Zugriffsliste“. Setzen Sie bei den gewünschten Einträgen ein Häkchen und klicken auf „Speichern“, um die erteilten Rechte für diese Benutzergruppe zu übernehmen:

Ist die Gruppe erstellt und gespeichert, ist es an der Zeit, ein erstes Benutzerkonto anzulegen. Kehren Sie hierfür in das Menü „Backend-Benutzer“ zurück und wählen Sie dieses Mal den gleichnamigen Punkt „Backend-Benutzer“. Klicken Sie auch in diesem Fall auf „Neuen Datensatz erstellen“ und geben Sie anschließend den gewünschten Nutzernamen sowie ein vorläufiges Passwort für diesen Zugang an. Unter „Verfügbare Objekte“ finden Sie die zuvor angelegte Benutzergruppe, die Sie dem neuen Account durch einfaches Anklicken zuweisen können:

Optional können Sie dem neuen Nutzerprofil außerdem den tatsächlichen Namen des Nutzers und dessen E-Mail-Adresse hinzufügen sowie eine Voreinstellung für die Sprachversion des Backends treffen. Unter dem Reiter „Zugriff“ können Sie darüber hinaus den Zeitraum festlegen, für den der Account aktiv sein soll, indem Sie ein Start- und ein Enddatum auswählen. Zum Abschluss klicken Sie auf „Speichern“.

Schritt 4: Templates oder andere Extensions importieren und installieren

Wenn Sie mit TYPO3 Seiten erstellen wollen, spielen Templates und andere Erweiterungen eine wichtige Rolle. Sie können Ihre Website zwar auch ausschließlich mithilfe der standardmäßig vorhandenen Layouts und Funktionen erstellen; doch Extensions helfen Ihnen dabei, das eigene Projekt genau nach Ihren Vorstellungen zu gestalten. Haben Sie eine interessante Gestaltungsvorlage oder eine andere Extension gefunden, die Sie für Ihre Homepage nutzen möchten, können Sie sie importieren und ausprobieren. Voraussetzung ist, dass die Erweiterung mit der von Ihnen verwendeten TYPO3-Version kompatibel ist.

Zum Schutz Ihrer Privatsphäre wird das Video erst nach dem Klick geladen

Im ersten Schritt laden Sie die jeweilige Extension auf Ihren PC herunter. Typischerweise handelt es sich bei der heruntergeladenen Datei um eine .zip- oder eine .t3x-Datei, wobei Sie in beiden Fällen keinerlei Änderungen vornehmen müssen, um die Extension in TYPO3 zu importieren. Hierfür rufen Sie im TYPO3-Backend das Menü „Erweiterungen“ auf und klicken dort auf den Button „Erweiterung hochladen“. Anschließend geben Sie mit „Durchsuchen…“ den lokalen Speicherort der Datei an und starten danach über den „Hochladen“-Button den Import:

Daraufhin importiert und installiert TYPO3 die Erweiterung automatisch. Erfordert diese die Installation weitere Extensions, informiert Sie das Content-Management-System in Form einer entsprechenden Meldung. War der Import erfolgreich, finden Sie die Extension fortan in der Auflistung installierter Erweiterungen.

Schritt 5: TYPO3-Seiten erstellen

Nachdem Sie das CMS erfolgreich eingerichtet und grundlegend konfiguriert haben, können Sie nun damit beginnen, Ihre TYPO3-Website zu erstellen. Dabei besteht die erste Aufgabe auf dem Weg zum eigenen Webprojekt darin, Seiten anzulegen, die Sie im Anschluss mit Inhalten füllen können. Hierfür benötigen Sie das Webmodul „Seite (Seiteninhalt)“, das sich auf die bewährte Weise – über das linke Seitenmenü – öffnen lässt. TYPO3 zeigt Ihnen daraufhin den Seitenbaum Ihrer Website an, der zu Beginn natürlich noch leer ist. Klicken Sie per Rechtsklick auf Ihr Projekt und wählen Sie im aufpoppenden Menü die Option „Neu“:

Für die neue Seite können Sie nun folgende Einstellungen treffen:

  • Allgemein: In diesem Tab legen Sie den Seitentyp sowie den Titel der Seite im Backend fest. Zusätzlich zu diesen Pflichtangaben können Sie einen alternativen Navigationstitel sowie einen Untertitel bestimmen.
     
  • Metadaten: Bei den Metadaten einer TYPO3-Seite handelt es sich einerseits um eine inhaltliche Zusammenfassung des Seiteninhalts, andererseits um passende Schlagworte (Meta-Tags). Zudem können Sie hier den Namen und die Mailadresse des Autors eintragen und den Zeitpunkt der letzten Seitenaktualisierung kennzeichnen.
     
  • SEO: Im SEO-Reiter machen Sie Ihre TYPO3-Seiten fit für Google und Co., indem Sie den Title und die Description definieren, das Haupt-Keyword angeben und Einstellungen zur Seitenindexierung treffen.
     
  • Soziale Medien: An dieser Stelle bietet TYPO3 die Möglichkeit, den Facebook Open Graph sowie die Twitter Card für die jeweilige Seite zu bearbeiten (Titel, Beschreibung, Bild).
     
  • Erscheinungsbild: Unter „Erscheinungsbild“ wählen Sie das Seitenlayout für Front- und Backend.
     
  • Verhalten: Unter diesem Reiter finden Sie u. a. verschiedene Einstellungen zum Caching sowie zum Verhalten der Seite bei Verlinkungen (URL-Alias, Linkziel).
     
  • Ressourcen: Die Auszeichnung von Dateien und TypoScript-Konfigurationen, die mit der Seite verknüpft sind, nehmen Sie im Ressourcen-Tab vor.
     
  • Sprache: Hier finden Sie Einstellungsoptionen für mehrsprachige TYPO3-Webprojekte.
     
  • Zugriff: Hier legen Sie fest, ob und wann die Seite veröffentlicht werden soll und welche Benutzergruppen Zugriffsrechte besitzen sollen.
     
  • Kategorien: Haben Sie Kategorien für Ihre Webseiten erstellt, können Sie die aktuell ausgewählte Seite in diesem Tab einer oder mehreren davon zuordnen.

Zum Abschluss drücken Sie den „Speichern“-Button, um die Seite endgültig zu erstellen.

Schritt 6: Inhalte hinzufügen: Beispiel Bilder

Nun ist es an der Zeit, die erstellten TYPO3-Seiten mit Inhalten zu füllen. Zu diesem Zweck wählen Sie die jeweilige Seite im Seitenbaum aus und klicken an gewünschter Stelle (Links, Normal, Rechts, Rand) auf den Button „Inhalt“, über den sich neue Inhaltselemente erstellen lassen. Es öffnet sich ein neues Menü, in dem Sie den Typ des neuen Contents definieren können. Zusätzlich zu klassischen Elementen wie Überschriften, Text, Bildern, Aufzählungen oder Tabellen sind an dieser Stelle u. a. diverse Menüs sowie einige Formulare auswählbar.

Wählen Sie den gewünschten Inhaltstypen aus und klicken Sie auf „Speichern“, um diesen auf der aktuellen Webseite zu platzieren. Wollen Sie Bilder einfügen, müssen Sie diese aber zunächst auf den Webspace hochladen. Hierfür wechseln Sie in den Tab „Bilder“ und drücken auf die Schaltfläche „Dateien auswählen und hochladen“. Geben Sie den lokalen Speicherort des Fotos oder der Grafik an und klicken Sie auf „Öffnen“, um den Upload auf den Server zu starten. Sie können die Bilder Ihrer Wahl auch einfach per Drag-and-Drop in den hierfür vorgesehenen Bereich ziehen.

Im Anschluss an den Upload-Prozess listet TYPO3 die Dateien inklusive Thumbnail untereinander auf. Klicken Sie einen dieser Einträge an, öffnet sich ein kleines Extramenü, in dem Sie die Bildunterschrift und den Alt-Text eingeben – Letzterer wird immer dann angezeigt, wenn das Bild für den Besucher nicht verfügbar ist bzw. nicht geladen werden kann. Zudem haben Sie die Möglichkeit, das jeweilige Bild im TYPO3-eigenen Bildeditor ImageMagick anzupassen.

Schritt 7: Interne und externe Verlinkungen erstellen

Wenn Sie eine TYPO3-Website erstellen, spielen natürlich auch Links eine wichtige Rolle. Während interne Verlinkungen ein einfaches Mittel sind, um die eigenen Artikel zu pushen und besser untereinander zu vernetzen, schaffen Sie mit (hochwertigen und hilfreichen!) externen Links gleichzeitig einen Mehrwert für Ihre Besucher sowie ein höheres Ansehen bei Suchmaschinen. In beiden Fällen helfen aussagekräftige Link-Titles dabei, dass Leser und Suchmaschinen verstehen, mit welchem Content beim Link-Ziel zu rechnen ist.

Sowohl das Setzen eines Links als auch die Formulierung eines Titles funktioniert in TYPO3 direkt über den Text-Editor. Öffnen Sie hierfür also den gewünschten Textabschnitt, indem Sie auf das Stift-Symbol an dem entsprechenden Inhaltsblock klicken und nach unten scrollen. Im Text markieren Sie nun den Textausschnitt, den Sie als Ankertext – also als sicht- und klickbaren Teil des Links – verwenden möchten und klicken dann auf das Ketten-Symbol in der Menüleiste des Editors:

Im ersten Fenster des sich daraufhin öffnenden Link-Browsers erzeugen Sie interne Links. Zu diesem Zweck fügen Sie zunächst den gewünschten Title ein und klicken dann im Seitenbaum auf die zu verlinkende Seite. Für die Kreation externer Links wechseln Sie in den Reiter „Externe URL“. Auch in diesem Fall gilt es, einen Title für den Link zu bestimmen – anschließend geben Sie die Ziel-URL an und klicken auf „Link setzen“:

Schritt 8: Management und Pflege der erstellten TYPO3-Website

Für den dauerhaften Erfolg Ihres Webprojekts ist die kontinuierliche Pflege und Optimierung des Contents und der technischen Basis unverzichtbar. Auch die stetige Aktualisierung der eingebundenen Software-Komponenten inklusive des Content-Management-Systems selbst gehört zu den absoluten Pflichtaufgaben.

TYPO3 stellt Ihnen zu diesem Zweck einige nützliche Features zur Verfügung. So finden Sie unter dem Menüpunkt „Protokoll“ eine detaillierte Auflistung sämtlicher Aktionen, die Nutzer im Backend ausgeführt haben. Darüber hinaus enthält das Administrationsprotokoll Einträge über die Interaktion mit der Datenbank sowie über aufgetretene Fehler:

Wenn Sie wissen wollen, wie es um die Aktualität von TYPO3 (inklusive Erweiterungen) und die Sicherheit Ihrer Website bestellt ist, ist ein Blick in das Menü „Berichte“ zu empfehlen. Hier zeigt TYPO3 die wichtigsten Parameterder Reihe nach auf. Grün dargestellte Einträge markieren dabei Parameter, bei denen keine Probleme festgestellt wurden, während gelb bzw. rot markierte Einträge solche Eigenschaften kennzeichnen, bei denen Handlungsbedarf besteht:

Tipp

Mit dem IONOS Website-Checker können Sie einen ausgiebigen Check der Sicherheit, Geschwindigkeit und Auffindbarkeit Ihrer erstellten TYPO3-Website durchführen.

Günstige Webhosting-Pakete von IONOS!

Vertrauen Sie auf flexibel skalierbares und zuverlässiges Webhosting inklusive persönlichem Berater mit IONOS!

Kostenlose Domain
inkl. SSL Wildcard Zertifikat
30-Tage-Geld-Zurück-Garantie

Auf dem Laufenden bleiben?

Jetzt für unseren Newsletter anmelden und gratis Online-Marketing Whitepaper für lokale Anbieter sichern!