Sind Sie frustriert über diese mysteriösen Zeichen, die erscheinen, wenn Sie neue Zeilen in Ihrem TYPO3 Rich Text Editor hinzufügen? Sie sind nicht allein. Dieses häufige Problem plagt viele TYPO3-Entwickler und Inhaltseditoren, aber glücklicherweise gibt es eine einfache Lösung. In diesem umfassenden Leitfaden werden wir genau erklären, warum dies passiert und wie man diese unerwünschten Zeichen in verschiedenen TYPO3-Versionen beseitigt.
Wenn Sie mit dem Rich Text Editor (RTE) in TYPO3 arbeiten, stellen Sie möglicherweise fest, dass das Drücken der Eingabetaste, um eine neue Zeile zu erstellen, unerwünschte   ; Zeichen zu Ihrer HTML-Ausgabe hinzufügt. Dies geschieht aufgrund der Art und Weise, wie der RTE Ihre Inhalte transformiert.
Diese zusätzlichen geschützten Leerzeichen können verursachen:
- Inkonsistente Abstände in Ihrem gerenderten Inhalt
- SEO-Probleme durch unnötige Auszeichnungen
- Styling-Probleme auf verschiedenen Geräten
- Kopfschmerzen für Entwickler und Inhaltseditoren gleichermaßen
Verständnis der RTE-Transformationen in TYPO3
Bevor wir uns der Lösung zuwenden, ist es wichtig zu verstehen, was hinter den Kulissen passiert. Der TYPO3 RTE verwendet Transformationsmodi, um Inhalte zu verarbeiten, bevor sie in der Datenbank gespeichert und bevor sie im Frontend gerendert werden.
Die Standardtransformation beinhaltet den css_transform Modus, der oft der Übeltäter hinter diesen lästigen Zeichen ist.
Überschreiben des RTE-Transformationsmodus
Die Kernlösung besteht darin, den von RTE verwendeten Transformationsmodus zu ändern. Lassen Sie uns untersuchen, wie man diese Korrektur in verschiedenen TYPO3-Versionen implementiert.
Für TYPO3 v11
In TYPO3 v11 können Sie Ihre TypoScript-Einstellungen ändern, um den Standard-Transformationsmodus zu überschreiben:
RTE.default.proc.overruleMode = detectbrokenlinks,ts_linksDiese Konfiguration entfernt den problematischen css_transform-Modus, während andere wichtige Funktionen wie die Link-Erkennung erhalten bleiben.
Alternativ für einen radikaleren Ansatz:
RTE.default.proc.overruleMode = noneHinweis: Die Verwendung von "none" deaktiviert alle Transformationen, was möglicherweise nicht für alle Anwendungsfälle geeignet ist.
Für TYPO3 v12
TYPO3 v12 hat einige Änderungen in der Handhabung des RTE eingeführt, aber der Ansatz bleibt ähnlich:
page.RTE.default.proc.overruleMode = detectbrokenlinks,ts_linksRTE:
default:
proc:
overruleMode: 'detectbrokenlinks,ts_links'Für TYPO3 v13
In der neuesten TYPO3 v13 kann die Konfiguration in Ihrer Seitenkonfiguration definiert werden:
RTE:
config:
processing:
mode: 'detectbrokenlinks,ts_links'
For backward compatibility, the TypoScript approach still works:
RTE.default.proc.overruleMode = detectbrokenlinks,ts_linksUmsetzung in verschiedenen Kontexten
Für einen einzelnen InhaltselementtypWenn Sie das Verhalten nur für bestimmte Inhaltslemente ändern möchten, können Sie diese direkt ansprechen:
# Only for text elements
tt_content.text.RTE.default.proc.overruleMode = detectbrokenlinks,ts_linksRTE.config.myCustomRTE.proc.overruleMode = detectbrokenlinks,ts_linksErweiterte Konfigurations optionen
Für eine genauere Kontrolle bietet TYPO3 zusätzliche Konfigurationsoptionen:
Erhalt spezifischer HTML-Tags
- RTE.default.proc.preserveTags = br,ul,ol,li,p
Benutzerdefinierte Verarbeitungsregeln
- RTE.default.proc.entryHTMLparser_db.tags.p.allowedAttribs = class,style
Professionelle Tipps zum Testen der TYPO3-Einrichtung & Konfiguration
Wenn Sie diese Änderungen implementieren, testen Sie immer gründlich in einer Entwicklungs-Umgebung, bevor Sie auf die Produktionsumgebung übertragen. Das Verhalten kann je nach Ihrer spezifischen TYPO3-Einrichtung, Erweiterungen und Inhaltsanforderungen variieren. Fügen Sie diesen nützlichen Debug-Schnipsel hinzu, um Ihre RTE-Transformationseinstellungen zu überprüfen:
config.debug = 1
config.contentObjectExceptionHandler = 0Kompatibilität mit CKEditor in TYPO3
Seit TYPO3 v8 ist CKEditor die Standard-RTE-Implementierung. Die oben genannten Lösungen funktionieren mit CKEditor, aber es gibt einige zusätzliche Überlegungen: Für TYPO3 v11 und v12 mit CKEditor 5:
editor:
config:
enterMode: CKEDITOR.ENTER_P
shiftEnterMode: CKEDITOR.ENTER_BR
For TYPO3 v13:
imports:
- { resource: "EXT:rte_ckeditor/Configuration/RTE/Default.yaml" }
editor:
config:
enterMode: 1
shiftEnterMode: 2Fazit
Indem Sie den Transformationsmodus Ihres TYPO3 RTE anpassen, können Sie diese frustrierenden Zeichen ein für alle Mal eliminieren. Dies verbessert nicht nur die Sauberkeit Ihrer HTML-Ausgabe, sondern sorgt auch für eine konsistentere Darstellung auf verschiedenen Geräten und Browsern. Denken Sie daran, dass die spezifische Lösung je nach Ihrer TYPO3-Version und Konfiguration leicht variieren kann, zögern Sie also nicht, verschiedene Ansätze zu testen, um herauszufinden, was für Ihren speziellen Anwendungsfall am besten funktioniert. Benötigen Sie weitere Hilfe bei TYPO3 RTE-Konfigurationen oder anderen TYPO3-Entwicklung Herausforderungen? Zögern Sie nicht, unsere anderen TYPO3-Leitfäden zu erkunden oder sich an unser Expertenteam für individuelle Unterstützung zu wenden.
Frequently Asked Questions
Der TYPO3 RTE fügt diese Zeichen während des css_transform-Prozesses hinzu, um Formatierung und Abstände in der HTML-Ausgabe beizubehalten. Obwohl dies zur Wahrung der visuellen Konsistenz beitragen soll, führt es oft zu unerwünschten zusätzlichen Leerzeichen.
Es hängt vom gewählten Modus ab. Bei Verwendung von detectbrokenlinks,ts_links bleibt die Linkverarbeitung erhalten, während unerwünschte Leerzeichen entfernt werden. Bei Verwendung von none werden alle Transformationen deaktiviert, was sich auf andere Funktionen auswirken kann.
Ja, Sie können diese Lösung auf jede RTE-Konfiguration in TYPO3 anwenden, einschließlich benutzerdefinierter Konfigurationen, die Sie für bestimmte Inhaltstypen definiert haben.
Sehen Sie sich den HTML-Quellcode Ihrer gerenderten Seite an und prüfen Sie, ob zwischen den Absatzelementen Zeichen vorhanden sind. Nach der Implementierung dieser Lösung sollten diese verschwunden sein.
CKEditor ist die spezifische Implementierung des Rich-Text-Editors, der in modernen TYPO3-Versionen verwendet wird. Der RTE ist das Konzept, während CKEditor das eigentliche Tool zur Implementierung ist.
Post a Comment