Zum Inhalt springen

Nach Speichern wird Formatierung gelöscht

Erstellt am 2. April 2006 · 14 Antworten · letzte Antwort am 8. April 2006

Tags: Frage

cyberboy ·

Ich habe den htmlareaRTE 1.2 installiert. Bei CSS-Zuweisung ist alles ok. Wenn ich aber im RTE Schriftart, -größe und -farbe selber angebe, dann löscht er die Formatierung nach dem Speichern wieder. Woran kann das liegen?

ms_k ·

Hi,

schau doch mal hier, hab nen kleinen guide geschrieben zur htmlarea:
#39948

dort sind zwar keine Schriftart, -größe etc. angelegt aber das sollte analog zu den Stilvorlagen funktionieren.

vielleicht hilfts weiter grüße 😉

cyberboy ·

Habe mir deinen Guide mal angeschaut und den Code entsprechend umgebaut, dass die Boxen für Textgröße, -art und -farbe auch angezeigt wird.

Im RTE zeigt er das dann auch korrekt an, aber wenn ich speicher, dann löscht er die Formatierung wieder. Die zugewiesenen CSS-Klassen unter Absatz werden dagegen einwandfrei gespeichert.

Woran kann das liegen?

ms_k ·

hi,

deine neuen klassen sind überall bekannt, ala:

proc.allowedClasses (
    deineKlasse
)

und

classesCharacter =     deineKlasse

das fällt mir gerade ein 🙂

grüße

ms_k ·

äh - also bei mir funktioniert das nur mit diesen Zeilen. Ansonsten hat der RTE das bei mir auch nicht gespeichert o.O

ms_k ·

hab nichts gelöscht und hinzugefügt, so wies im guide steht funktionieren bei mir Format- und Absatzstilvorlagen.

Ich habe nur die Tsconfig /typoscript zeilen rausgezogen die du brauchst um dort deine Css-Klassen anzumelden, die angewendet werden sollen bei auswahl der Format- und Absatzstilvorlagen.

cyberboy ·

Ja, das mit meinen selbst erstellten CSS-Klassen funktioniert ja auch. Ich möchte aber auch über die Boxen Schriftgröße, -art und -farbe die Texte formatieren können. Also neben den festgelegten CSS-Klassen auch selber frei formatieren können. Die Boxen zeigt er an, nur beim Speichern dann löscht er die Formatierungen.

cyberboy ·

Ich habe grad gesehen, dass er die Ausrichtung des Textes (zentriert, links, rechts) auch nicht speichert. Fett, Kursiv und Unterstrichen funktioniert jedoch...

ms_k ·

Ich habe grad gesehen, dass er die Ausrichtung des Textes (zentriert, links, rechts) auch nicht speichert. Fett, Kursiv und Unterstrichen funktioniert jedoch...

das problem hatte ich auch, aber mit der Konfiguration wie im guide (#39948) beschrieben funktioniert es bei mir in beiden Browsern (IE und Firefox).

wie schaut denn deine Tsconfig inzwischen aus? bzw. welche einstellung hast du bei der extension vorgenommen?

cyberboy ·

Ich habe jetzt eben die Konfiguration in deinem Guide bei mir rausgenommen und dann nur meine CSS-Klassen über TSConfig in den RTE importiert und nun geht's 😉

Einziges Problem ist jetzt nur noch, wenn ich eine Textfarbe manuell im RTE ausgewählt habe, dann kann ich nicht mehr auf die Standardfarbe, die ich im CSS habe, zurück. Der zeigt dann immer die manuell ausgewählte Farbe an und die Standardfarbe lässt sich leider nicht manuell auswählen im Farbfeld...

dabjoern ·

Hi cyberboy,

ich habe dasselbe Problem siehe: #409581.

Ich verstehe deinen letzten Post nicht ganz. Funktioniert der Colorpicker bei dir jetzt? Würdest du, wenn es dir nichts ausmacht, mal deinen TS-Config Code posten?

Vielen tausend Dank

Grüße
dabjoern

cyberboy ·

Hier ist mein Code im TSConfig:

## RTE Konfiguration
RTE.default {
 
        # Zuweisung der CSS-Datei
        contentCSS = fileadmin/rte_formate.css

        ## Use stylesheet file rather than the above mainStyleOverride and inlineStyle properties to style the contents (htmlArea RTE only)
        ignoreMainStyleOverride = 1
        
        proc {
                # List all class selectors that are allowed on the way to the database
                allowedClasses (
                        external-link, external-link-new-window, internal-link, internal-link-new-window, download, mail,
                        align-left, align-center, align-right, beispiel
                ) 
        }

        # Classes: Eigene Stile
        classesCharacter = beispiel
        classesImage= rte_image
 
        # zeigt alle CSS-Klassen die in formate.css vorhanden sind
        showTagFreeClasses = 1
 
}

Als Typ bei den Konfiguration der Extension "Demo" angeben, sonst speichert er gewisse Formatierungen nicht.

Kann ich mit dem Code von dir bestimmte Farben im Picker vorgeben?

RTE.colors {
  color1 {
    name = dunkelblau
    value = #000066
  }

Danmit wäre dann auch mein Problem so gut wie gelöst...zwar nicht ganz sauber, aber immer hin eine Hilfe...

dabjoern ·

Hallo,

danke für deinen Post. Nun habe ich es auch hinbekommen (über CSS Klassen). Ich habe aber nicht den Demo Mode eingeschalten, da dort geschrieben steht, dass es nicht für den Produktivbetrieb gedacht ist. Hier mein Code:

# RTE Konfiguration
RTE.default {
  # Zuweisung der CSS-Datei
  contentCSS = fileadmin/templates/css/rte.css
  
  # Markup options
  enableWordClean = 1
  removeTrailingBR = 1
  removeComments = 1
  removeTags = center
  removeTagsAndContents = style,script
  
  # Buttons die gezeigt/versteckt werden
  showButtons = ... (hab ich mal raugenommen, zu lang)
  hideButtons = ... (hab ich mal raugenommen, zu lang)
  
  # Hält die RTE Icons gegroupt zusammen
  keepButtonGroupTogether = 1
  
  # blendet Statusbar in htmlarea aus
  showStatusBar =  0
  
  ## Use stylesheet file rather than the above mainStyleOverride and inlineStyle properties to style the contents (htmlArea RTE only)
  ignoreMainStyleOverride = 1
  
  proc {
    # tags die erlaubt / verboten sind
    allowTags = table,tbody,tr,th,td,h1,h2,h3,h4,h5,h6,div,p,br,span,ul,ol,li,re,blockquote, strong,em,b,i,u,sub,sup,strike,a,img,nobr,hr,tt,q,cite,abbr,acronym,center
    denyTags = font
  
    # br wird nicht zu p konvertiert
    dontConvBRtoParagraph = 1
  
    # tags sind erlaubt außerhalt von p,div
    allowTagsOutside = img,hr
  
    # erlaubte attribute in p, div tags
    keepPDIVattribs = align,class,style,id
  
    # List all class selectors that are allowed on the way to the database
    allowedClasses (
      external-link,external-link-new-window,internal-link,internal-link-new-window,download,mail,bg_light,font_orange
    )       
  
    # html parser einstellungen
    HTMLparser_rte {
      # tags die erlaubt/verboten sind
      allowTags < RTE.default.proc.allowTags
      denyTags < RTE.default.proc.denyTags
  
      # tags die untersagt sind
      removeTags = font
  
      # entfernt html-kommentare
      removeComments = 1
  
      # tags die nicht übereinstimmen werden nicht entfernt (protect / 1 / 0)
      keepNonMatchedTags = 0
    }
  
    # Content to database
    entryHTMLparser_db = 1
    entryHTMLparser_db {
      # tags die erlaubt/verboten sind
      allowTags < RTE.default.proc.allowTags
      denyTags < RTE.default.proc.denyTags
  
      # CLEAN TAGS
      noAttrib = b,i,u,strike,sub,sup,strong,em,quote,blockquote,cite,tt,br,center
  
      rmTagIfNoAttrib = span,div,font
  
      .tags {
        p.fixAttrib.align.unset >
        p.allowedAttribs = class,style,align
        div.fixAttrib.align.unset >
        hr.allowedAttribs = class
  
        # b und i tags werden ersetzt (em / strong)
        b.remap = strong
        i.remap = em
      }
    }
  }
  
  # Classes: Eigene Stile
  classesCharacter = bg_light,font_orange
  
  # Classes für Links (These classes should also be in the list of allowedClasses)
  classesAnchor = external-link, external-link-new-window, internal-link, internal-link-new-window, download, mail
  classesAnchor.default {
    page = internal-link
    url = external-link-new-window
    file = download
    mail = mail
  }
  
  # zeigt alle CSS-Klassen die in css vorhanden sind
  showTagFreeClasses = 1
  
  # Do not allow insertion of the following tags
  hideTags = font
  
  # Tabellen Optionen in der RTE Toolbar
  hideTableOperationsInToolbar = 0
  keepToggleBordersInToolbar = 1
  
  # Tabellen Editierungs-Optionen (cellspacing/ cellpadding / border)
  disableSpacingFieldsetInTableOperations = 1
  disableAlignmentFieldsetInTableOperations=1
  disableColorFieldsetInTableOperations=1
  disableLayoutFieldsetInTableOperations=1
  disableBordersFieldsetInTableOperations=0
}

# Use same processing as on entry to database to clean content pasted into the editor
RTE.default.enableWordClean.HTMLparser < RTE.default.proc.entryHTMLparser_db

Am wichtigsten ist diese Zeile, damit die eigenen Klassen geparsed werden:

    # List all class selectors that are allowed on the way to the database
    allowedClasses (
      external-link,external-link-new-window,internal-link,internal-link-new-window,download,mail,bg_light,font_orange
    )

Um deine eigenen Farben zu basteln, brauchst du folgenden Code (ging aber wie gesagt bei mir beim Speichern des RTE nicht):

RTE.default {
  disableColorPicker = 1
  disableSelectColor = 0
  colors = color1, color2
}
RTE.colors {
  color1 {
    name = dunkelblau
    value = #000066
  }
  color1 {
    name = grau
    value = #ccc
  }
}

Grüße
dabjoern