Fragen zu CSS Styled Content

  • claudia2 claudia2
    Jedi-Meister
    0 x
    296 Beiträge
    0 Hilfreiche Beiträge
    08. 12. 2005, 20:56

    Hallo!

    Ich habe schon einige Typo3 Webseiten mit externen Stylesheets veröffentlicht.

    Der Vorteil in der Extension CSS Styled Content liegt ja anscheinend hauptsächlich darin, dass der Quelltext von nervigen "clear-gifs" und "<p style:margin:=""> gesäubert wird... gibt es noch andere Argumente?

    Beim Überfliegen einiger Forumsbeiträge ist mir aufgefallen, dass viele anscheinend an der Extension herumdoktorn um sie vernünftig anwenden zu können... so richtig zufriedenstellend waren die Infos für mich nicht.

    Meine Fragen:

    a. Gibt es ein Tutorial zu CSS Styled Content?

    b. Wenn ich die EXT installiert habe, konfiguriere ich die Styles ja anscheinend im CSS Styler. Kann ich da auch umfangreiche Stylesheets verwirklichen, oder muss ich muss ich dafür in die PHP Datei eingreifen so wie ich es in anderen Forumsbeiträgen gelesen habe??

    c. gibt es keine Möglichkeit das fertige Stylesheet ins CSS Styled Content einzubinden?

    d. Bei einer Testinstallation bei einem fertigen Typo3 Projekt wurden die im externen Stylesheet festgelegten Formatierungen nicht mehr richtig angezeigt, obwohl das Stylesheet im CSS Styler unter "Style Collection Info" angezeigt wird. Warum?

    e. Welche Nachteile muss ich in Kauf nehmen, bzw. wo könnte es Problem mit anderen Extensions geben?

    Vielen Dank für eure Hilfe!

    Claudia


  • 1
  • steffenk steffenk
    Obi-Wan Kenobi
    0 x
    4666 Beiträge
    0 Hilfreiche Beiträge
    08. 12. 2005, 23:45

    also,

    zu a) - nein, aber so gross ist die Extension nicht, man kann sich den Quellcode anschauen und sieht, wie die Elemente gerendert werden

    b) man kann auch ganz normal mit einem externen Stylesheet arbeiten. Dazu löscht man die vorhandene CSS-Ausgabe und bindet die erforderlichen Elemente in seine CSS-Datei (so mache ich es)

    c) siehe b

    d) wenn Definitionen mehrfach auftauchen, so ist die letzte Angabe massgeblich. Man kann aber mit dem Schlüsselwort important! Formatierungen erzwingen

    e) die Ext ist nicht perfekt, einige HTML-Sachen sind noch immer hardcodiert. Ausserdem ist die Ausgabe nicht Barrierefrei. Es gibt andere Ansätze, z.B.AccessibleContent. Probleme gibt es immer mit Extension, die nicht T3 rendern lassen sondern selber rendern, vorwiegend ältere.

    Ich hoffe Du hast ein paar Antworten gefunden.

  • claudia2 claudia2
    Jedi-Meister
    0 x
    296 Beiträge
    0 Hilfreiche Beiträge
    09. 12. 2005, 15:20

    Hallo Steffen,

    vielen Dank erstmal für deine ausführlichen Antworten!

    Von [i]!important[/i] habe ich auch schon gehört und auch noch mal recherchiert. Leider wird es vom IE nicht beherrscht...

    b) man kann auch ganz normal mit einem externen Stylesheet arbeiten. Dazu löscht man die vorhandene CSS-Ausgabe und bindet die erforderlichen Elemente in seine CSS-Datei (so mache ich es)

    Wo kann ich die CSS-Ausgabe löschen? Im CSS Styler??

    Oder in der EXT Datei? wenn ja, welche, habe auf den ersten Blick nichts gefunden...

    Wenn ich CSS Styled Content aktiviere, versieht er alle <p>-Tags mit class=bodytext oder fließtext und ändert auch automatisch <h1>, <h2>... das möchte ich gerne raushaben.

    Am liebsten halt ALLE Styles aus meinem eigenen Stylesheet...

    Claudia

  • steffenk steffenk
    Obi-Wan Kenobi
    0 x
    4666 Beiträge
    0 Hilfreiche Beiträge
    09. 12. 2005, 19:30

    Etwas falsch war meine Antwort schon, da die css_styled_content gar keine css-styles setzt. Es gibt lediglich Beispiel-Css-Dateien im Ordner der Extension.
    Andere Extensions bringen ihre "Basisstyles" mit und schreiben sie als Inlinestyle in die Seite, diese Angaben löscht man so:

    1. plugin.modulname._CSS_DEFAULT_STYLE >

    Ein eigenes stylesheet bindet man ganz einfach ein:

    1. page.includeCSS {
    2. file1 = fileadmin/css/style1.css
    3. file2 = fileadmin/css/style2.css
    4. }

    Diese CSS-Dateien kann man ganz normal editieren.

    Die Tags von denen Du sprichst sind "Standard-Wraps". Diese kann man mit TS überschreiben, löschen etc.
    z.B.

    1. # Formatierung des Standardtextes
    2. content.wrap.bodytext = <p>|</p>
    3.  
    4. # Formatierung der Header über Stylesheet
    5. content.wrap.header = |
    6. content.wrap.header1 = <h1>|</h1>
    7. content.wrap.header2 = <h2>|</h2>
    8. content.wrap.header3 = <h3>|</h3>
    9. content.wrap.header4 = <h4>|</h4>

    usw.

  • claudia2 claudia2
    Jedi-Meister
    0 x
    296 Beiträge
    0 Hilfreiche Beiträge
    10. 12. 2005, 12:26

    Hi Steffen,

    ich hab jetzt nach weiterer Recherche eine akzepable Lösung gefunden, die zumindest bei meinem neuen Projekt funktioniert. Beim bestehenden muss ich wohl trotzdem das Stylesheet umschreiben.

    Hier meine Lösung für Interessierte:

    1. css_styled_content installieren und über Include Static from Extension einfügen

    2. Auf der Root Seite im TS Config folgenden Code einfügen:

    1. RTE.default.proc {
    2. dontConvBRtoParagraph=1
    3. }

    3. Root-Template anpassen um unnötige Tags zu entfernen:

    1. # entfernt die Anker-Tags
    2. tt_content.stdWrap.dataWrap =
    3. tt_content.noANameTagForFirstRecord = 1
    4.  
    5. # entfernt class=bodytext
    6. lib.parseFunc_RTE.nonTypoTagStdWrap.encapsLines.addAttributes.P.class >

    Wenn man nun im RTE im Fliesstext die Enter-taste drückt, fügt der RTE einen Absatz <p> ein, mit 'shift' & Enter einen Zeilenumbruch </br>.

    4. letztlich für das Ausschalten der Stylesheets mancher Extensions:

    1. plugin.modulname._CSS_DEFAULT_STYLE >

    Alles in allem ist der Quelltext so viel aufgeräumter und Typo3 verwendet durchgehend das externe Stylesheet :)

    grüße
    claudia

  • Twomaze Twomaze
    Padawan
    0 x
    33 Beiträge
    0 Hilfreiche Beiträge
    16. 11. 2006, 15:51

    Hallo,

    ich nutze diesen Thread einfach mal, da meine Frage CSS Styled Content betrifft.

    Ich habe CSS Sytled Content nun aktiviert, dabei ist mir aufgefallen das es vorher möglich war im Header HTML Tags unter zu bringen.

    Also konnte ich einen Zeilenumbruch durch <br> erzeugen. Nun ist dies nicht mehr möglich ...

    Gibt es hierfür eine Lösung?

    DANKE
    twomaze

  • 1