Ein Leitfaden zur Typo3-Programmierung für Anfänger

Die TYPO3-Programmierung kann für Anfänger zu Beginn eine etwas verwirrende Herausforderung darstellen. Doch mit ein paar grundlegenden Schritten und dem richtigen Verständnis können auch Neulinge schnell Erfolge erzielen. In diesem Leitfaden möchten wir Ihnen die ersten Schritte in der TYPO3-Programmierung näherbringen und Ihnen den Einstieg erleichtern.

TYPO3 vs. WordPress: Welches CMS ist das Richtige für Ihre Website?

TYPO3 und Wordpress sind zwei der beliebtesten Content-Management-Systeme (CMS) auf dem Markt. Beide bieten eine Vielzahl von Funktionen und Möglichkeiten zur Erstellung und Verwaltung von Websites. Doch welches CMS ist das Richtige für Ihre Website? In diesem Vergleich werden wir die Unterschiede zwischen TYPO3 und Wordpress genauer betrachten, um Ihnen bei der Entscheidung zu helfen.

Die Installation von TYPO3

TYPO3 ist ein Content-Management-System, das weltweit von vielen Firmen genutzt wird. Es ist Open-Source-Software und kann kostenlos heruntergeladen werden. In diesem Blogbeitrag zeigen wir Ihnen eine Schritt-für-Schritt-Anleitung zur Installation von TYPO3.

Eine Einführung in Typo3-Plugins

Typo3 ist ein Content-Management-System, das über viele Funktionen und Erweiterungen verfügt. Eine der bedeutendsten Erweiterungsmöglichkeiten sind sogenannte Plugins. Doch was genau sind Typo3-Plugins und wie funktionieren diese?

Warum eine Webseite mit TYPO3 erstellen?

TYPO3 ist ein Open-Source-Content-Management-System, auch CMS genannt. Das System wird seit 1998 entwickelt und ist heute eines der berühmtesten Systeme bei der Erstellung von Webseiten. Dies ist ein sehr leistungsfähiges CMS, das viele Funktionen mit sich bringt, die das Management und die Erstellung der Website erheblich vereinfachen können. Es gibt auch mehrere Erweiterungen, die die Funktion von TYPO3 erweitern können.

Typo3 Updates

Typo3 CMS ist eine Content-Managementsoftware, die in mehreren verschiedenen Sprachen verfügbar ist und eine breite Palette an Funktionen bietet. Typo3 CMS ermöglicht es Nutzern, Websites und Anwendungen ohne vorherige Programmierkenntnisse einzurichten und zu verwalten. Es ist vielseitig, sicher und robust, aber es ist notwendig, die Software regelmäßig zu aktualisieren, um sicherzustellen, dass man immer die neueste Version verwendet. In diesem Artikel erklären wir, wie man Typo3 CMS Upgrades & Updates effektiv durchführen und deren Benefits kennen sollte. Außerdem werden häufige Probleme bei der Durchführung von Typo3 CMS Upgrades und Security Updates erläutert und ein Fazit gezogen, wie Nutzer immer auf dem Laufenden bleiben können.

Typo 3 Abschnittsverzeichnis für News-Records

Aufgabenstellung in unserer Webagentur: Wir benötigen ein Inhaltselement, dass automatisch alle Abschnitte, also Inhaltsüberschriften der Elemente anzeigt, die einem News-Record zugeordnet sind. Für reguläre Seiten gibt es dieses Element bereits, nun müssen wir hier jedoch die Spalte tx_news_related_news zur Hilfe nehmen, der für jedes Content Element auf einen Eintrag in der Tabelle tx_news_domain_model_news verweist.

 

TYPO3 Agentur Hacks

Aufgabenstellung in unserer Agentur: Wie kann man innerhalb der TYPO3 news Extension (TYPO3 v9) eigene cropVariants (fal_media) anlegen, so dass man selbstgewählte Zuschnittvorlagen / Schnittmasken zur Verfügung hat mit den Seitenverhältnissen 12:1, 8:3 oder beliebige andere? Die Standardlösung, wie Sie z.B. unter https://github.com/georgringer/news/issues/371 zu sehen ist, führte bei uns nicht zum Erfolg.

 

Menü mit Verweisen und Subtitle-Links

Aufgabenstellung in unserer Agentur: In einem Menü einer TYPO3-Installation (TYPO3 v9.5) sollten die Untertitel der Menüpunkte mit den entsprechenden Seiten verlinkt werden, das Linkziel der Subtitles sollte also dem Linkziel der eigentlichen Menüpunkte entsprechen. Es würde nun nahe liegen, einen typolink zu setzen mit parameter.data = field:uid. Dies funktioniert jedoch nur bei regulären Seiten, die nicht auf andere Seiten verweisen. Bei Verweis-Menüpunkten würde damit der Menüpunkt dann zwar nach einem regulären Aufbau des Menüs selbst zum richtigen Ziel / der Referenzseite verlinken, der Untertitel jedoch würde zur Seite selbst und damit zu einem 404-Fehler führen.

 

Imagemagick Graphicsmagick

In einer TYPO3 (TYPO3 9) Installation in unserer Agentur gab es Probleme beim Image Processing mit Imagemagick. Imagemagick war über den Softwaremanager installiert, Ghostscript auch. Dennoch erhielten wir im Backend bei der Überprüfung des Image Processing unter "Environment->Image Processing" die Meldung "Image generation failedImage generation failedImageMagick / GraphicsMagick handling is enabled, but the execute command returned an error. Please check your settings, especially ['GFX']['processor_path'] and ['GFX']['processor_path_lzw'] and ensure Ghostscript is installed on your server."

 

Frontend-Layout für Änderungen im Header

In einem TYPO3-Projekt in unserer Agentur möchten wir einen anderen Header für bestimmte Seiten ausgeben, d.h. anderes Logo, andere Menüstruktur, etc.. Dies ist in wenigen einfachen Schritten umsetzbar (hier am Beispiel einer Website mit TYPO3 v9.5.19): Zuerst fügen wir in der Seiten TS Config ein eigenes Layout hinzu, z.B. mit der Anweisung

 

Blog einrichten Typo3

In unserer Web-Angentur mussten wir für einen unserer Kunden ein Blog-System für Typo3 einrichten. Dafür haben wir ein Plug-In benutzt. Bei dem Prozess muss auf ein paar Punkte  Rücksicht genommen werden.

1. Wir sollten erstmal die Blog-Erweiterung (https://docs.typo3.org/p/t3g/blog/9.1/en-us/Index.html ) unter Erweiterungen installieren.

 

2. Danach müssen wir unseren Blog einrichten. Unter System> Blog >Setup a new Blog wurde die Struktur unseres neuen Blogs eingerichtet. Sie sollte so aussehen:

 

Übersetzungen für Blog erstellen TYPO3

Ab und zu mal wieder ein paar Basics :-): In unserer Webagentur schreiben wir aktuell ein kleines Partial für die Listausgabe der TYPO3 "blog"-Extension. Hierbei möchten wir den von der blog-Extension gelieferten Link mit eigenen Texten versehen und nicht den Titel ausgeben lassen, wie standardmäßig eingestellt.

 

 Partials der blog Extension überschreiben

Möchte man innerhalb einer TYPO3-Website (v9.5) die Partials der Extension "blog" überschreiben (um z.B. die Listenansicht zu verändern), reicht es, die folgenden Anweisungen im Template-Setup zu integrieren und dann die entsprechenden Partials anzulegen (in unserer Agentur war es \fileadmin\templates\ext\blog\Partials\List\Post.html:

 

Core Update von 8 auf 9

In unserer Webagentur wurde ein Update von TYPO3 v8 auf TYPO3 v9 durchgeführt, hierbei wurde ein Template verwendet, welches auf der TYPO3-Extension "gridelements" basiert. Nach dem Update waren jedoch Elemente im Frontend der Website falsch angeordnet und falsch gestylt. Im Website-Backend war diese "Unordnung" genauso sichtbar, die Childelemente hatten Ihre Parentelemente verlassen und waren so bunt durcheinander gewürfelt. Der Grund hierfür ist, dass das colPos-Feld in der tt_content-Tabelle durch das Core-Update verändert wird, siehe auch unter https://docs.typo3.org/typo3cms/extensions/gridelements/stable/Chapters/Notes/Index.html:

 

Core Update

In unserer Agentur wurde ein Update von TYPO3 v8 auf TYPO3 v9 durchgeführt, hierbei wurde ein Template verwendet, welches auf der TYPO3-Extension "gridelements" basiert. Nach dem Update waren jedoch Elemente im Frontend der Website falsch gestylt. Im Website-Backend wurde sichtbar, dass das jeweilige Element-Layout im Reiter "Erscheinungsbild" falsch gesetzt war. Der Grund hierfür ist, dass das "layout"-Feld in der tt_content-Tabelle durch das Core-Update verändert wird.

 

No implementation found to handle given hash.

Während des Updates-Prozesses einer TYPO3-Website von v8 auf v9 in unserer Internetagentur wurde der folgende Fehler erzeugt: component="TYPO3.CMS.Core.Error.ProductionExceptionHandler": Core: Exception handler (WEB): Uncaught TYPO3 Exception #1234567890: No implementation found to handle given hash. This happens if the stored hash uses a mechanism not supported by current server. Follow the wiki link to fix this issue. Mit diesem Fehler einhergehend konnten wir uns nicht im Install-Tool der Website einloggen über die URL /typo3/install.php. Die Standardverschlüsselungsmethode von TYPO3 9 ist hierbei argon2i, leider nicht verfügbar auf dem verwendeten Entwicklungsserver. Was ist also zu tun?

 

id-Attribut zulassen in h1-Tags / -Elementen

Um das id-Attribut in h1-Elementen zuzulassen (oder auch in jedem anderen Element), sind nur einige wenige Anpassungen in den Konfigurationsdateien des Rich Text Editors notwendig. Dieses Beispiel bezieht sich auf die Anpassung des TYPO3 Introduction Package, ist jedoch auf die meisten anderen Anwendungsfälle übertragbar. 

 

TYPO3 Parse error

Erhält man in TYPO3 die Meldung "Parse error: Data structure could not be resolved to a valid structure." im Backend bei dem Versuch, ein Content-Element zu bearbeiten, lohnt sich ein Blick in die \typo3\sysext\core\Classes\Configuration\FlexForm\ FlexFormTools.php.

 

TYPO3 Introduction Package

Um ein bestehendes Template in TYPO3 auf Basis des Introduction Packages anzupassen, genügt es in den meisten Fällen, sich im Ordner \typo3conf\ext\bootstrap_package\Resources\Private\Templates\Page\ aufzuhalten, so z.B. für eine Anpassung des 3-spaltigen Templates die Datei \typo3conf\ext\bootstrap_package\Resources\Private\Templates\Page\ Default3Columns.html anzupassen. Möchte man jedoch die Möglichkeit haben,  weitere Zeilenstrukturen oberhalb oder unterhalb der gegebenen 3-Spaltigkeit einzurichten, ist dies in den Backendtemplates anzugeben.

 

TYPO3 Lösung

Setzt man in TYPO3 auf dem Bootstrap Introduction Package auf und möchte das Hauptmenü erweitern, um 3 Ebenen statt den initial vorhandenen 2 Ebenen anzeigen zu lassen, müssen im Grunde nur 2 Stellen angepasst werden. Zuerst stellt man in der setup.txt (welche wir finden in \typo3conf\ext\bootstrap_package\Configuration\TypoScript\setup.txt) sicher, dass wir ausreichend Level zur Verfügung haben, die wir anzeigen lassen können, der MenuProcessor also weiß, wieviele Ebenen dieser ausliefern soll. Danach müssen wir dann in der entsprechenden Template-Datei das Menü in der gewünschten Weise erweitern.  Diese Main.html finden wir unter \typo3conf\ext\bootstrap_package\Resources\Private\Partials\Page\Navigation\. 

 

Deutsch als Standardsprache einrichten

Um in TYPO3 (hier: TYPO3 8.7.1) die Sprache Deustch als Standardsprache zu setzen, genügt es, im Template-Setup die Sprachparameter zuzuweisen. Hier wird Deutsch als Standardsprache gesetzt und Englisch als zweite Sprache. Für jede Sprache werden die Language ID und die Language Codes gesetzt:

Sprachen im Typo3

In der von uns installieren Version des Typo3 Introduction Packages waren von Haus aus zwei Sprachen eingepflegt: Dänisch und Englisch. Dies sollte in Deutsch und Englisch geändert werden, wobei Deutsch als Standardsprache dienen sollte.

Dazu wählt man im Backend die Option „List“ und klickt auf das Root-Verzeichnis der Seite (übergeordnet zur Option mit Weltkugel). Dort kann man die Webseitensprachen einrichten.

 

TYPO3-Extension "Ajax Mail Subscription"

... kann es daran liegen, dass die Newsletteranmeldung auf der Domain "domain.tld" aufgerufen wurde, das TYPO3-System jedoch auf der Subdomain "www.domain.tld" installiert ist.

TYPO3 Server umziehen

Schritt 1) Kopie aller Dateien auf den neuen Server.

Schritt 2) Übertragung aller Datenbankinhalte auf die neue Datenbank.