Dieser Artikel ist über 1 Jahr alt. Deshalb könnten die Informationen hier veraltet sein.

6. Dezember 2010

TYPO3: Inhalte zentrieren

Geschätzte Lesezeit: 30 Sekunden

Wenn man mit dem Standard-RTE HTMLArea Textabschnitte zentriert oder rechtsbündig ausgeben will, hat man dazu zwar die nötigen Buttons, und im Editor wird das auch korrekt angezeigt. Schaut man sich die Texte dann aber im Frontend an, werden die Texte wieder linksbündig ausgegeben.

Das liegt daran, das die HTMLArea den formatierten Abschnitten bestimmte CSS-Klassen zuweist, die aber im CSS des Templates für das Frontend auch definiert werden müssen.

AusrichtungCSS-Klasse
Linksbündigalign-left
Rechtsbündigalign-right
Zentriertalign-center
Blocksatzalign-justify

Fügt diese CSS-Definitionen in euer Stylesheet ein, und die Ausgabe sollte korrekt funktionieren.

.align-left { text-align: left }
.align-right { text-align: right }
.align-center { text-align: center }
.align-justify { text-align: justify }

Nutzer des TinyMCE haben dieses Problem nicht, da dieser Editor inline-styles erzeugt.

Artikel wurde gefunden mit den Suchbegriffen:
  • typo3 text zentrieren

Kommentare

Kommentare

Wolfgang Wagner

lebt in Friedrichshafen und arbeitet als Web Developer bei der TYPO3 Agentur jweiland.net in Filderstadt. Weitere Orte im Web: Twitter, Facebook, Videotraining zu TYPO3 8 LTS

Kommentare (9) Schreibe einen Kommentar

  1. Da kann man sich jetzt drüber streiten ob es praktischer ist den TinyMCE mit inline-styles oder den normalen RTE zu verwenden.
    Ich persönlich arbeite gerne so weit wie möglich ohne inline-styles, definiere dafür lieber ein paar Klassen im CSS mehr.

    Antworten

    • Ja, das ist in der Tat ein Argument. Ich verwende eigentlich auch nicht so gerne inline-styles.

      Andererseits verwende ich viel lieber den TinyMCE, weil der wesentlich leichter zu konfigurieren ist als die HTMLArea, gerade auch, wenn man ein angepasstes Setup für Redakteure benötigt.

      Antworten

      • Ja das ist allerdings auch richtig. Aber mit der Zeit bekommt man es auch hin den RTE anständig zu konfigurieren.
        Man muss nur immer drauf achten, dass wenn man einen neuen Meilenstein an Benutzbarkeit für Redakteure erreicht hat, das TypoScript irgendwo zu speichern.

        Wenn man dann eine große Auswahl an fertigen Scripts hat, kann man den RTE eigentlich recht flott anpassen.

        Antworten

        • Was mir am TinyMCE besonders gefällt, ist die Möglichkeit, eigene CSS-Klassen ganz einfach anzulegen und auch ein eigenes Stylesheet für den Editor einzubinden. Das habe ich bei der HTMLArea irgendwie nie richtig hinbekommen.

          Antworten

  2. Kein Ding, da ich erst vor einem halben Jahr angefangen habe richtig mit Typo3 zu arbeiten sind meine Bookmarks zu 80% Typo3-bezogen 😀

    Antworten

  3. Ich hatte auch grade Spass mit den Klassen im RTE, das kann wirklich aufreibend sein.

    Auch um auf den ursprünglichen Blog-Artikel zurückzukommen: Erkläre das mal einem unbedarften Redakteur, dass Du vergessen hast, die CSS-Klassen einzubinden, oder es nicht vorgesehen war (dann sollte man die Knöpfe im RTE entfernen, ich weiss) …
    Die denkwürdigste Reaktion, die ich auf diese Verlautbarung bekam war „was ist denn CSS?“. War in einem vhs-Kurs, den ich gegeben habe. Ich wusste nicht, ob ich lachen oder weinen sollte, HTML und CSS waren Voraussetzungen für den Kurs. Da einem sowas auch in freier Wildbahn passieren kann, bin ich immer wieder versucht, den RTE ganz abzuschalten und nur Textareas zur Verfügung zu stellen.

    Antworten

    • Tja, eigentlich sollte man beim Umgang mit $kunde immer vom worst case ausgehen 🙂

      Deshalb bevorzuge ich aber den TinyMCE, der lässt sich so leicht per Typoscript anpassen, das man den Redakteuren wirklich nur die benötigten Buttons und Auszeichnungsmöglichkeiten geben kann. Wenn er keine H1 oder H2 verwenden soll, schalte ich die einfach ab.

      Antworten

Schreibe einen Kommentar

Pflichtfelder sind mit * markiert.