htmlarea / RTE (Konfiguration) - so gehts [Gelöst]

  • ms_k ms_k
    Jedi-Ritter
    0 x
    133 Beiträge
    0 Hilfreiche Beiträge
    21. 03. 2006, 13:38

    Hallo Allerseits,

    da anscheinend viele das selbe Problem haben, wie ich hatte poste ich hier mal meine komplete RTE konfiguration. Mit angelegten Text- bzw. Absatzstilvorlagen.

    Hoffe das hilft einigen über Ihre RTE Probleme hinweg.
    [b]htmlArea RTE Version 1.1.3[/b]
    [b]TSconfig-Eintrag:[/b]

    1. #*** RTE Classe des Interface (Ausrichtung)
    2. RTE.classes {
    3. align-left {
    4. name = LLL:EXT:rtehtmlarea/htmlarea/locallang_tooltips.xml:justifyleft
    5. value = text-align: left;
    6. }
    7. align-center {
    8. name = LLL:EXT:rtehtmlarea/htmlarea/locallang_tooltips.xml:justifycenter
    9. value = text-align: center;
    10. }
    11. align-right {
    12. name = LLL:EXT:rtehtmlarea/htmlarea/locallang_tooltips.xml:justifyright
    13. value = text-align: right;
    14. }
    15. }
    16.  
    17. #
    18. # *** Entfernt das Bild vor den Links
    19. RTE.classesAnchor {
    20. internalLink {
    21. class = internal-link
    22. type = page
    23. image >
    24. }
    25. externalLink {
    26. class = external-link
    27. type = url
    28. image >
    29. }
    30. externalLinkInNewWindow {
    31. class = external-link-new-window
    32. type = url
    33. image >
    34. }
    35. internalLinkInNewWindow {
    36. class = internal-link-new-window
    37. type = page
    38. image >
    39. }
    40. download {
    41. class = download
    42. type = file
    43. image >
    44. }
    45. mail {
    46. class = mail
    47. type = mail
    48. image >
    49. }
    50. }
    51.  
    52.  
    53. ## RTE Konfiguration
    54. RTE.default {
    55.  
    56. # Zuweisung der CSS-Datei
    57. contentCSS = rte_formate.css
    58.  
    59. ## Markup options
    60. enableWordClean = 1
    61. removeTrailingBR = 1
    62. removeComments = 1
    63. removeTags = center, sdfield
    64. removeTagsAndContents = style,script
    65.  
    66. # Buttons die gezeigt/versteckt werden
    67. showButtons = textstyle, textstylelabel, blockstyle, blockstylelabel, bold, italic, underline, left, center, right, orderedlist, unorderedlist, insertcharacter, line, link, image, removeformat, table, toggleborders, tableproperties, rowproperties, rowinsertabove, rowinsertunder, rowdelete, rowsplit, columninsertbefore, columninsertafter, columndelete, columnsplit, cellproperties, cellinsertbefore, cellinsertafter, celldelete, cellsplit, cellmerge, findreplace, insertcharacter, undo, redo, showhelp, about
    68. hideButtons = fontstyle, formatblock, fontsize, strikethrough,lefttoright, righttoleft, textcolor, bgcolor, textindicator, emoticon, user, spellcheck, chMode, inserttag, outdent, indent, justifyfull, subscript, superscript, acronym, copy, cut, paste
    69.  
    70. # Hält die RTE Icons gegroupt zusammen
    71. keepButtonGroupTogether = 1
    72.  
    73. # blendet Statusbar in htmlarea aus
    74. showStatusBar = 0
    75.  
    76. ## Add styles Left, center and right alignment of text in paragraphs and cells.
    77. inlineStyle.text-alignment (
    78. p.align-left, h1.align-left, h2.align-left, h3.align-left, h4.align-left, h5.align-left, h6.align-left, td.align-left { text-align: left; }
    79. p.align-center, h1.align-center, h2.align-center, h3.align-center, h4.align-center, h5.align-center, h6.align-center, td.align-center { text-align: center; }
    80. p.align-right, h1.align-right, h2.align-right, h3.align-right, h4.align-right, h5.align-right, h6.align-right, td.align-right { text-align: right; }
    81. )
    82.  
    83. ## Use stylesheet file rather than the above mainStyleOverride and inlineStyle properties to style the contents (htmlArea RTE only)
    84. ignoreMainStyleOverride = 1
    85.  
    86. proc {
    87. # tags die erlaubt / verboten sind
    88. 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
    89. denyTags = font
    90.  
    91. # br wird nicht zu p konvertiert
    92. dontConvBRtoParagraph = 1
    93.  
    94. # tags sind erlaubt außerhalt von p, div
    95. allowTagsOutside = img,hr
    96.  
    97. # erlaubte attribute in p, div tags
    98. keepPDIVattribs = align,class,style,id
    99.  
    100. # List all class selectors that are allowed on the way to the database
    101. allowedClasses (
    102. external-link, external-link-new-window, internal-link, internal-link-new-window, download, mail,
    103. align-left, align-center, align-right, author
    104. )
    105.  
    106. # html parser einstellungen
    107. HTMLparser_rte {
    108.  
    109. # tags die erlaubt/verboten sind
    110. allowTags < RTE.default.proc.allowTags
    111. denyTags < RTE.default.proc.denyTags
    112.  
    113. # tags die untersagt sind
    114. removeTags = font
    115.  
    116. # entfernt html-kommentare
    117. removeComments = 1
    118.  
    119. # tags die nicht übereinstimmen werden nicht entfernt (protect / 1 / 0)
    120. keepNonMatchedTags = 0
    121. }
    122.  
    123.  
    124. # Content to database
    125. entryHTMLparser_db = 1
    126. entryHTMLparser_db {
    127.  
    128. # tags die erlaubt/verboten sind
    129. allowTags < RTE.default.proc.allowTags
    130. denyTags < RTE.default.proc.denyTags
    131.  
    132. # CLEAN TAGS
    133. noAttrib = b, i, u, strike, sub, sup, strong, em, quote, blockquote, cite, tt, br, center
    134.  
    135. rmTagIfNoAttrib = span,div,font
    136.  
    137. # htmlSpecialChars = 1
    138.  
    139. ## align attribute werden erlaubt
    140. tags {
    141. p.fixAttrib.align.unset >
    142. p.allowedAttribs = class,style,align
    143.  
    144. div.fixAttrib.align.unset >
    145.  
    146. hr.allowedAttribs = class
    147.  
    148. # b und i tags werden ersetzt (em / strong)
    149. b.remap = strong
    150. i.remap = em
    151.  
    152. ## img tags werden erlaubt
    153. img >
    154. }
    155. }
    156.  
    157. }
    158.  
    159. # Classes: Ausrichtung
    160. classesParagraph (
    161. align-left, align-center, align-right
    162. )
    163.  
    164. # Classes: Eigene Stile
    165. classesCharacter = author
    166. classesImage= rte_image
    167.  
    168.  
    169. # Classes für Links (These classes should also be in the list of allowedClasses)
    170. classesAnchor = external-link, external-link-new-window, internal-link, internal-link-new-window, download, mail
    171. classesAnchor.default {
    172. page = internal-link
    173. url = external-link-new-window
    174. file = download
    175. mail = mail
    176. }
    177.  
    178. # zeigt alle CSS-Klassen die in formate.css vorhanden sind
    179. showTagFreeClasses = 1
    180.  
    181. # Do not allow insertion of the following tags
    182. hideTags = font
    183.  
    184. # Tabellen Optionen in der RTE Toolbar
    185. hideTableOperationsInToolbar = 0
    186. keepToggleBordersInToolbar = 1
    187.  
    188. # Tabellen Editierungs-Optionen (cellspacing/ cellpadding / border)
    189. disableSpacingFieldsetInTableOperations = 1
    190. disableAlignmentFieldsetInTableOperations=1
    191. disableColorFieldsetInTableOperations=1
    192. disableLayoutFieldsetInTableOperations=1
    193. disableBordersFieldsetInTableOperations=0
    194. }
    195.  
    196. # Use same processing as on entry to database to clean content pasted into the editor
    197. RTE.default.enableWordClean.HTMLparser < RTE.default.proc.entryHTMLparser_db
    198.  
    199. # FE RTE configuration (htmlArea RTE only)
    200. RTE.default.FE < RTE.default
    201. RTE.default.FE.userElements >
    202. RTE.default.FE.userLinks >
    203.  
    204. # Breite des RTE in Fullscreen-Ansicht
    205. TCEFORM.tt_content.bodytext.RTEfullScreenWidth= 80%

    [b]rte_formate.css (heisst bei mir halt so):[/b]

    .author {
    font-size:11px;
    font-weight:bold;
    font-style:normal;
    color:#961207;
    }

    span.author {
    font-size:11px;
    font-weight:bold;
    font-style:normal;
    color:#961207;
    }

    [b]Konfiguration in den Extensions-Einstellungen:[/b]
    Default configuration settings: Demo
    Enable images in the RTE: haken gesetzt
    Enable compressed scripts: haken nicht gesetzt

    So denn, dann viel Spass und gutes gelingen
    Karin 8-)


  • knobocop knobocop
    R2-D2
    0 x
    110 Beiträge
    0 Hilfreiche Beiträge
    13. 06. 2006, 09:04

    [quote="ms_k"]
    Hallo knobocop,

    hat es mit den Einstellung in den Benutzergruppen bei dir geklappt!?

    [/quote]

    Ja hat wunderbar funktioniert. Ich danke euch. Hatte gleich vermutet, dass diese Teile unterhalb des RTEs nicht zum RTE gehören.

    [quote="ms_k"]
    Hallo Liberation,

    ich glaube du und Knobocop habt schön aneinander vorbei geredet, denn seine RTE Einstellungen funktionieren soweit sie eben einfluß auf den RTE haben (siehe Screenshot von Knobocop), Schrechtschreibfehler etc kann man ausschließen und sie befinden sich auch in der TSconfig (hat er geschrieben).

    Grüße
    ms_k
    [/quote]

    Genau!

  • Liberation Liberatio...
    Jedi-Meister
    0 x
    412 Beiträge
    0 Hilfreiche Beiträge
    13. 06. 2006, 10:04

    :)
    #angry#

  • Toccamonium Toccamoni...
    Jedi-Ritter
    0 x
    130 Beiträge
    0 Hilfreiche Beiträge
    13. 06. 2006, 17:17

    Habe ich jetzt Tomaten auf den Augen???

    Irgendwie muss ich wohl an dem Befehl vorbeigeschrammt sein...
    Ich habe eine Tabelle in Dreamweaver erstellt, u.a. mit eigenen
    Klassen. Wenn ich nun die Tabelle via einem neuen Textobjekt
    einfüge > unter Codeansicht > dann passt auch alles soweit. Man
    kann sie bearbeiten, verändern, wie auch immer. Sobald aber die
    Seite ausgegeben wird, verschwindet meine eigene Klasse und
    wird durch class="contenttable" ersetzt. Wo und wie kann ich diese
    Funktion abschalten?

    Merci!

    T.C.

  • ms_k ms_k
    Jedi-Ritter
    0 x
    133 Beiträge
    0 Hilfreiche Beiträge
    14. 06. 2006, 08:41

    hallo Toccamonium,

    kurze zwischenfrage:
    warum baust du eine Tabelle in Dreamweaver und fügst sie in ein Textelement ein?
    Mach das doch im RTE selbst und nenn deine Klasse class="contenttable".

    Wäre doch auch eine Idee.

    Ansonsten füge deine Klasse zu den allowClasses im TSconfig.

    [TS]allowedClasses = [deine Klasse][/TS]

    Grüße
    ms_k

  • Toccamonium Toccamoni...
    Jedi-Ritter
    0 x
    130 Beiträge
    0 Hilfreiche Beiträge
    14. 06. 2006, 11:15

    Hallo Karin,

    in Dreamweaver erstelle ich meine Templates und alle anderen
    Inhaltselemente, weil ich hier ja erst mal die notwendigen
    CSS-Auszeichnungen erstelle. Vom Workflow her, geht es meiner
    Meinung nach hier deutlich schneller. Hier vergebe ich auch
    meine Klassen. Wenn dann alles passt, packe ich den Code in
    die RTE, damit der Kunde hier seine restlichen Datein eingeben
    oder ändern kann.
    Und da ich die Klassen sowieso schon in DW angelegt habe, finde
    ich es in diesem Fall nicht sinnvoll, dass er mir diese überschreibt,
    da ich ich gerade bei größeren Projekten unterschiedlich formatiere
    Tabellen habe.

    Gut, dann werde ich das auch mal in die "allowedClasses" einfügen.

    Dazu vielleicht noch ne andere Frage:
    Verschiedene Inhalte = verschiedene Tabellen = verschiedene
    Bildgrößen. Nehmen wir an, ich habe eine Seite TEAM, dort sollen
    Bilder, die ein Redakteur hochlädt, auf 125 x 185px beschnitten
    werden. Auf der Seite EVENT sollen Bilder auf 200 x 200 px
    heruntergerechnet werden. Wo finde ich denn dazu Info, was hier
    in die TSConfig muss, bzw. wie man sowas generell anstellt?

    Danke

    Gruß
    T.C.

  • ms_k ms_k
    Jedi-Ritter
    0 x
    133 Beiträge
    0 Hilfreiche Beiträge
    14. 06. 2006, 12:31

    Hallo Toccamonium,

    in Dreamweaver erstelle ich meine Templates und alle anderen
    Inhaltselemente, weil ich hier ja erst mal die notwendigen
    CSS-Auszeichnungen erstelle. Vom Workflow her, geht es meiner
    Meinung nach hier deutlich schneller.

    Die generellen Templates würde ich auch im Dreamweaver erstellen, aber wofür musst du alle Inhaltselemete immer wieder dort erstellen, wenn du eine globale externe CSS hast. Im RTE definierte Absatz-/Stilvorlagen kannst du doch auf den reinen Content anwenden bzw. der Redakteur. Mir kommt, zumindest deine Beschreibung eher vor wie eine verkomplizierung und nach dem Prinzip wie ich früher meine statischen HTML-Seiten gebaut habe :o .

    Mmh - warums setzt du die Tabellen/Inhalte in ein Inhaltselement bzw. den RTE ein!? Nimm doch hierfür einfach ein spezielles Inhaltselement also HTML - wie es von T3 angeboten wird. Dann hast du auch nicht das Problem das irgendwas rausgeparst wird was du haben möchtest bzw. Bildergrößen so sind wie du sie in HTML erstellst.

    Generell kannst du mittels Maus rechts klick -> Kontextmenü auf ein Bild im RTE, die Bildgröße der einzelen Bilder anpassen.

    Bild max/min Größe kannst du z.B. in der TS deiner Root-Seite definieren.

    Viele Grüße
    ms_k

  • IgM IgM
    R2-D2
    0 x
    91 Beiträge
    0 Hilfreiche Beiträge
    14. 06. 2006, 16:23

    Ich hab das Problem, dass cite Tags bei mir nicht funktionieren:
    1. Sie werden immer von p Tags gewrapt
    2. Und die eckigen Klammern in < usw. umgewandelt, d.h. im Frontend wird <cite> als Text, nicht als Tag ausgegeben.

    Zunächst mal hab ich folgende Konfiguration vorgenommen:
    [TS]showButtons = ..., chMode, inserttag[/TS]
    So dass ich Text markieren und mit einem Tag umgeben kann (funktioniert auch).

    Anschließend fügte ich den cite Tag zu den erlaubten Tags hinzu (bzw. da war er schon):
    [TS]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[/TS]

    Und gab zudem noch an, dass er außerhalb von p tags stehen darf:
    [TS]allowTagsOutside = img,hr,cite[/TS]

    Was mach ich falsch :-(?

    Update: Problem Nr. 2 habe ich nun gelöst, offenbar musste ich das Template Setup noch
    [TS]tt_content.text.20.parseFunc.denyTags =
    tt_content.text.20.parseFunc.allowTags = *[/TS]
    hinzufügen.

    Bleibt noch Problem Nr. 1.

  • photek photek
    T3PO
    0 x
    30 Beiträge
    0 Hilfreiche Beiträge
    02. 07. 2006, 14:02

    So, jetzt muss ich auch mal fragen, da ich schon total verzweifele....
    Ich habe mir den Thread schon mehrmals durchgelesen, mein Problem konnte aber nicht gelöst werden.
    Bei mir wird die rte-CSS nicht mit eingebunden, ich habe die RTE Anweisungen und die RTE-CSS Datei aufs Nötigste beschränkt:

    TS Config
    [TS]RTE.default {

    ## Zuweisung der CSS-Datei
    contentCSS = /fileadmin/rte_css.css

    ## zeigt alle CSS-Klassen die in formate.css vorhanden sind
    showTagFreeClasses = 1

    ## List all class selectors that are allowed on the way to the database
    proc.allowedClasses (
    author, external-link
    )

    classesCharacter = author, kasten, important
    }
    [/TS]

    rte_css.css
    [HTML].author {
    font-size:11px;
    font-weight:bold;
    font-style:normal;
    color:#961207;
    }

    span.author {
    font-size:11px;
    font-weight:bold;
    font-style:normal;
    color:#961207;
    }

    [/HTML]

    Edit:

    Im Debugmodus steht:

    [HTMLArea::initIframe]: Override CSS set to: http://127.0.0.1/typo3temp/rtehtmlarea_css_dffac98b3175880c8c50347c30aeac2a.css
    [HTMLArea::initIframe]: Content CSS set to: http://127.0.0.1/fileadmin/rte_css.css

    /Edit

    Natürlich habe ich den Cache bei jeder Änderung gelöscht. Das Absatz- oder Textmenue bleibt grau hinterlegt.

    Danke und sonnige Grüße,

    Photek
    Typo3 V.4.0, Firefox, MAC OSX

  • ms_k ms_k
    Jedi-Ritter
    0 x
    133 Beiträge
    0 Hilfreiche Beiträge
    03. 07. 2006, 08:29

    Hallo Photek,

    ist die CSS-Klasse (rte_css.css), die die du auch in deine Seite einbindest oder hast du noch eine weitere CSS-Datei!? Dann müßtest du nämlich die rte_css.css in deiner Haupt-CSS inkludieren - ala:

    [HTML]@import url("rte_css.css");
    [/HTML]

    Viele Grüße
    ms_k