Warum wir QR-Codes in TYPO3 eingebaut haben: Printkampagnen unter CMS-Kontrolle

Das Problem ist, dass die Seite dann verschoben oder gelöscht wird oder die Kampagne endet. Plötzlich führt der gedruckte QR-Code ins Leere, und jemand muss schnell eine Weiterleitung erstellen und hoffen, dass er den richtigen Pfad wählt.

Florian brachte eine detaillierte Beschreibung mit, wie das besser funktionieren könnte. Als ich das auf unserer Liste für den Oktober-Sprint in Genf sah, wusste ich, dass ich mich damit beschäftigen wollte. Die Funktion selbst machte natürlich Sinn, aber ich war auch gespannt auf die technische Herausforderung: eine moderne Webkomponente in das TYPO3-Backend zu integrieren und das Redirects-Modul so zu erweitern, dass es über QR-Codes hinaus nützlich sein könnte.

Die meisten Unternehmen gehen mit QR-Codes so um: Jemand aus dem Marketing braucht einen Code für ein Messebanner. Er googelt „QR-Code-Generator“, findet ein kostenloses Tool, fügt die URL ein und lädt das Bild herunter.

Kurzfristig ist das ein guter Workflow. Aber auf lange Sicht schafft es Probleme. Der QR-Code existiert nun unabhängig von der Website, auf die er verweist. Niemand im CMS weiß, dass er existiert. Es gibt keine Aufzeichnungen darüber, wer ihn erstellt hat und warum. Und wenn sich die Zielseite ändert — was sie tun wird —, funktioniert der Code nicht mehr.

Florian hat das schon oft bei Kunden erlebt. Sie haben den Support kontaktiert und gesagt, dass ein QR-Code nicht mehr funktioniert, nur um dann festzustellen, dass er nicht mehr funktioniert, weil die Seite vor Monaten umstrukturiert wurde. Besucher landeten auf einer 404-Seite, und die einzige Lösung bestand darin, nachträglich eine Weiterleitung zu erstellen und zu hoffen, dass man den richtigen Quellpfad erraten hatte.

Das eigentliche Problem ist, dass gedruckte Materialien genauso verwaltbar sein müssen wie jeder andere Link in deinem System. Aber außerhalb des CMS erstellte QR-Codes existieren in einer Grauzone.

Unser Ansatz basierte auf einer einfachen Erkenntnis: Das Weiterleitungsmodul (redirects module) von TYPO3 löst bereits den größten Teil dieses Problems. Mit Weiterleitungen kannst du eine URL auf eine andere verweisen, das Ziel jederzeit ändern und verfolgen, wie oft sie aufgerufen werden. QR-Codes sind im Wesentlichen dasselbe — ein fester Einstiegspunkt, der zu einem flexiblen Ziel führt —, nur mit einer visuellen Darstellung, die du ausdrucken kannst.

Anstatt also etwas völlig Neues zu entwickeln, haben wir das Weiterleitungsmodul  erweitert. Dazu mussten wir erst ein paar Vorarbeiten machen. Die Datenbanktabelle der Weiterleitungen war nicht dafür ausgelegt, verschiedene Arten von Datensätzen zu verarbeiten, die unterschiedlich angezeigt werden. Wir haben diese Funktion hinzugefügt und damit eine Grundlage geschaffen, auf der Weiterleitungen und QR-Codes die gleiche zugrunde liegende Leistungsfähigkeit haben, aber unterschiedliche Schnittstellen bieten. Ein motivierter Entwickler könnte dies noch weiter ausbauen, indem er benutzerdefinierte Funktionen, neue Weiterleitungsarten oder sogar Tiny-URLs hinzufügt.

Der QR-Code selbst wird von einer Custom Web Komponente generiert, sodass man nur noch die gewünschten Parameter zu Größe und Inhalt eingeben muss.

Zum Erstellen eines QR-Codes braucht man zwei Felder: Domain und Ziel. Mit dem Standard-Link-Picker von TYPO3 kannst du auf eine Seite, eine Datei oder eine externe URL verweisen.

Sobald der QR-Code erstellt ist, ist die URL fest. Sie wird gedruckt. Das Ziel kann aber jederzeit geändert werden. Ist deine Kampagne beendet? Verweise den Code auf deine Homepage oder die nächste Kampagne. Wurde deine Seite umstrukturiert? Aktualisiere das Ziel, und alle gedruckten Codes funktionieren weiterhin.

Das Modul zeigt dir, was für die Verwaltung von Codes im Laufe der Zeit wichtig ist: Gesamtzahl der Scans, eindeutige Scans, Erstellungsdatum und wer den Code erstellt hat. Wenn jemand fragt: „Wofür ist dieser QR-Code und wird er noch verwendet?“, kannst du diese Frage tatsächlich beantworten.

Du kannst Verfügbarkeitsfenster — Start- und Enddatum — festlegen, damit Codes automatisch aufhören zu funktionieren, wenn sie es sollen. Und du kannst das Bild in PNG oder SVG in verschiedenen Größen herunterladen, je nach deinen Anforderungen an die Druckproduktion.

Sowohl für Weiterleitungen als auch für QR-Codes haben wir die Sichtbarkeit hinzugefügt, welcher Benutzer jeden Datensatz erstellt hat. Wenn du dich fragst, warum eine Weiterleitung existiert oder wo ein QR-Code verwendet wurde, kannst du die Person finden, die ihn erstellt hat, und sie fragen.

The QR code generator is also a self-contained web component available anywhere in the TYPO3 backend. If you’re building an extension and want to display a QR code, just take the markup, then pass in size and content parameters. The component handles server communication and rendering.

A colleague already sent me a patch using exactly this approach: adding QR code downloads to backend preview links. You generate a preview URL for a client, and now you can hand them a QR code to scan instead of copying a long link. That’s the kind of reuse we designed for.

The type system we built for this is also extensible. We split the redirects table into different display types — one for redirects, one for QR codes — each with their own interface but sharing the same underlying capabilities. If you wanted to add a third type — say, tiny URLs — the pattern is there to follow.

Mein Fokus lag die ganze Zeit auf Einfachheit. Meistens braucht jemand nur einen QR-Code für eine bestimmte Seite. Darüber sollte man nicht nachdenken müssen. Domain auswählen, Ziel auswählen, dann herunterladen.

Aber hinter dieser Einfachheit steckt echte Flexibilität. Ändere Ziele, wenn sich Kampagnen weiterentwickeln. Verfolge die Nutzung, um zu wissen, was funktioniert. Halte Druckmaterialien über Jahre hinweg gültig, indem du sie genauso verwaltest wie jeden anderen Link.

QR-Codes sind ab Version 14.1 Teil des TYPO3-Kerns und unter „Sites → Link Management“ zusammen mit Weiterleitungen gruppiert.

Gedruckte Materialien haben endlich einen Platz im CMS!