03. 03. 2016, 13:57

Hallo,

ich nutze die unten stehende config für den RTE.
Leider sind damit alle Buttons in einer Reihe also sie "floaten" bzw. umbrechen bei ende des RTE nicht. So das man nach rechts scrollen muss um zum Beispiel "Textmodus umschalten" drücken kann.

Leere ich den "RTE.default >" dann stimmt zwar das mit den Buttons wieder aber es funktioniert halt sonst kaum was...

Also mach ich irgendwas falsch, könnt Ihr mir bitte sagen was? :)

Vielen Dank.

  1. RTE.default {
  2. # CSS-Datei für rte Darstellungen im RTE Editor
  3. contentCSS = fileadmin/Template/Css/UserRTE.css
  4.  
  5. # Markup options
  6. enableWordClean = 1
  7. removeTrailingBR = 1
  8. removeComments = 1
  9. removeTags = center, sdfield
  10. removeTagsAndContents = link, meta, title, style, script
  11.  
  12. # Dies sind alle zur Verfügung stehende Buttons
  13. # die mit showButtons hideButtons angezeigt/versteckt werden können
  14. # showButtons (
  15. # blockstylelabel, blockstyle, textstylelabel, textstyle, fontstyle, fontsize, formatblock,
  16. # blockquote, insertparagraphbefore, insertparagraphafter, lefttoright, righttoleft, language,
  17. # showlanguagemarks, left, center, right, justifyfull, orderedlist, unorderedlist, definitionlist,
  18. # definitionitem, outdent, indent, formattext, bidioverride, big, bold, citation, code, definition,
  19. # deletedtext, emphasis, insertedtext, italic, keyboard, monospaced, quotation, sample, small, span,
  20. # strikethrough, strong, subscript, superscript, underline, variable, textcolor, bgcolor, textindicator,
  21. # editelement, showmicrodata, emoticon, insertcharacter, insertsofthyphen, line, link, unlink, image,
  22. # table, user, acronym, findreplace, spellcheck, chMode, inserttag, removeformat, copy, cut, paste,
  23. # pastetoggle, pastebehaviour, undo, redo, about, toggleborders, tableproperties, tablerestyle,
  24. # rowproperties, rowinsertabove, rowinsertunder, rowdelete, rowsplit, columnproperties, columninsertbefore,
  25. # columninsertafter, columndelete, columnsplit, cellproperties, cellinsertbefore, cellinsertafter,
  26. # celldelete, cellsplit, cellmerge
  27. # )
  28.  
  29. # Buttons die gezeigt werden
  30. showButtons (
  31. blockstylelabel, blockstyle, left, center, right, fontsize, justifyfull, textstylelabel, textstyle, formatblock,
  32. bold, italic, subscript, superscript,
  33. orderedlist, unorderedlist, indent, insertcharacter, link, table, findreplace, chMode, removeformat,
  34. toggleborders, tableproperties, rowproperties, rowinsertabove, rowinsertunder, rowdelete, rowsplit, columninsertbefore,
  35. columninsertafter, columndelete, cellproperties, columnsplit, cellinsertbefore, cellinsertafter, celldelete,
  36. cellsplit, cellmerge, textcolor, bgcolor, code, class, inserttag, hMode, showmicrodata, editelement, line, image,
  37. insertparagraphbefore, insertparagraphafter,
  38. )
  39.  
  40. # Buttons die ausgeblendet werden sollen,
  41. # damit wird die default Einstellung des rte sicher überschrieben
  42. hideButtons(
  43. fontstyle, lefttoright, righttoleft, textindicator, emoticon, underline, strikethrough, user,
  44. spellcheck, outdent, acronym, copy, cut, paste, undo, redo, showhelp, about, blockquote,
  45. definitionlist, definitionitem, formattext, bidioverride, big,
  46. )
  47.  
  48. # die Reihenfolge der Buttons im RTE
  49. toolbarOrder (
  50. bold, italic, formatblock, fontsize, textstyle, textstylelabel, blockstyle, blockstylelabel, underline,
  51. subscript, superscript, left, center, right, justifyfull, insertparagraphbefore, insertparagraphafter,
  52. orderedlist, unorderedlist, line, link, image,
  53. removeformat, findreplace, insertcharacter, indent, tableproperties, rowproperties, rowinsertabove,
  54. rowinsertunder, rowdelete, rowsplit, columninsertbefore, columninsertafter, columndelete, columnsplit,
  55. cellproperties, cellinsertbefore, cellinsertafter, celldelete, cellsplit, cellmerge, toggleborders,
  56. table, textcolor, bgcolor, code, chMode, class, strikethrough, hMode
  57. )
  58.  
  59. # Einträge im RTE select Feld "Format"
  60. # zunächst eine Übersicht aller Standard Einträge:
  61. # address, article, aside, div, footer, header, nav, p, h1 - h6, pre, blockquote, section,
  62. # jetzt all das was wir nicht wollen:
  63. buttons.formatblock.removeItems (
  64. address, article, aside, footer, header, nav, h6, pre, blockquote, section
  65. )
  66.  
  67. buttons.formatblock.addItems (
  68. span
  69. )
  70.  
  71. # Hält die RTE Icons gruppiert zusammen
  72. keepButtonGroupTogether = 1
  73.  
  74. # blendet Statusbar in htmlarea aus = 0
  75. showStatusBar = 1
  76.  
  77. allowedClasses (
  78. align-left, align-center, align-right,
  79. )
  80.  
  81. ## Ergänzt CSS Style für Textausrichtung links - center - rechts für h, p und Tabellen
  82. inlineStyle.text-alignment (
  83. p.align-left, h1.align-left, h2.align-left,
  84. h3.align-left, h4.align-left, h5.align-left,
  85. h6.align-left, td.align-left { text-align: left; }
  86.  
  87. p.align-center, h1.align-center, h2.align-center, h3.align-center,
  88. h4.align-center, h5.align-center, h6.align-center, td.align-center { text-align: center; }
  89.  
  90. p.align-right, h1.align-right, h2.align-right, h3.align-right, h4.align-right,
  91. h5.align-right, h6.align-right, td.align-right { text-align: right; }
  92. )
  93.  
  94. ## Eigens Stylesheet (für RTE Ansicht) wird nicht vom RTE EXT Stylesheet überschrieben
  95. ignoreMainStyleOverride = 1
  96. proc {
  97. overrideMode = css_transform
  98.  
  99. allowedClasses < RTE.default.allowedClasses
  100.  
  101. # tags die erlaubt / verboten sind
  102. allowTags (
  103. table ,tbody, tr, th, td, h1, h2, h3, h4, h5, h6, div, p, br, span, ul, ol, li, re, blockquote,
  104. strong, em, b, i, u, sub, sup, strike, a, img, nobr, hr, tt, q, cite, abbr, acronym, center,
  105. )
  106.  
  107. denyTags = font
  108.  
  109. # br wird nicht zu p konvertiert
  110. dontConvBRtoParagraph = 1
  111.  
  112. # tags sind erlaubt außerhalt von p, div
  113. allowTagsOutside = img, hr
  114.  
  115. # erlaubte attribute in p, div tags
  116. keepPDIVattribs = class, id, style
  117.  
  118. #classesParagraph = align-left, align-center, align-right,
  119.  
  120. # Liste aller Klassen die in die DB geschrieben werden dürfen
  121. # Eigene Klassen müssen hier angefügt werden!
  122. allowedClasses (
  123. external-link, external-link-new-window, internal-link,
  124. internal-link-new-window, download, mail,
  125. align-left, align-center, align-right, author, indent
  126. )
  127.  
  128. classesParagraph < RTE.default.proc.allowedClasses
  129.  
  130. # Generelle Einstellungen für den HTML-Parser
  131. HTMLparser_rte {
  132.  
  133. # tags die erlaubt/verboten sind
  134. allowTags < RTE.default.proc.allowTags
  135. denyTags < RTE.default.proc.denyTags
  136.  
  137. # entfernt html-kommentare
  138. removeComments = 1
  139.  
  140. # tags die nicht übereinstimmen werden nicht entfernt (protect / 1 / 0)
  141. keepNonMatchedTags = 0
  142. }
  143.  
  144. # Vom RTE in die Datenbank
  145. entryHTMLparser_db = 1
  146. entryHTMLparser_db {
  147.  
  148. # tags die erlaubt/verboten sind
  149. allowTags < RTE.default.proc.allowTags
  150. denyTags < RTE.default.proc.denyTags
  151.  
  152. # Für diese Tags sind keine Attribute erlaubt
  153. noAttrib = b, i, sub, sup, strong, em, quote, blockquote, cite, tt, br, center
  154.  
  155. # Diese Tags werden entfernt wenn kein Attribut vorhanden ist
  156. rmTagIfNoAttrib = div,font
  157.  
  158. ## align attribute werden erlaubt
  159. tags {
  160. p.fixAttrib.align.unset >
  161. p.allowedAttribs = class, style, align
  162.  
  163. div.fixAttrib.align.unset >
  164.  
  165. hr.allowedAttribs = class
  166.  
  167. # Das <b>-Tag wird durch <strong> ersetzt
  168. b.remap = strong
  169. i.remap = em
  170.  
  171. ## img tags werden erlaubt
  172. img >
  173. }
  174. }
  175.  
  176. # Von der Datenbank in den RTE
  177. exitHTMLparser_db = 1
  178. exitHTMLparser_db {
  179. }
  180. }
  181.  
  182. showTagFreeClasses = 1
  183.  
  184. # Tags die nicht eingeführt werden dürfen
  185. hideTags = font
  186.  
  187. # Tabellen Optionen in der RTE Toolbar
  188. hideTableOperationsInToolbar = 0
  189. keepToggleBordersInToolbar = 1
  190.  
  191. # Tabellen Editierungs-Optionen (cellspacing/ cellpadding / border)
  192. disableSpacingFieldsetInTableOperations = 1
  193. disableAlignmentFieldsetInTableOperations = 1
  194. disableColorFieldsetInTableOperations = 1
  195. disableLayoutFieldsetInTableOperations = 1
  196. disableBordersFieldsetInTableOperations = 0
  197.  
  198. disableColorPicker = 1
  199. colors = color1, color2, color3, color4
  200.  
  201. buttons.textstyle.tags.a.allowedClasses = font-size-xlarge, font-size-large, font-size-middle, font-size-small, letter-spacing-1, letter-spacing-2, btn-preis, btn-tel
  202. buttons.textstyle.tags.span.allowedClasses = font-size-xlarge, font-size-large, font-size-middle, font-size-small, letter-spacing-1, letter-spacing-2, btn-preis, btn-tel
  203. buttons.blockstyle.tags.div.allowedClasses := addToList (center)
  204.  
  205. allowedClasses = font-size-xlarge, font-size-large, font-size-middle, font-size-small, letter-spacing-1, letter-spacing-2, btn-preis, btn-tel, center
  206.  
  207. # Use same processing as on entry to database to clean content pasted into the editor
  208. enableWordClean.HTMLparser < RTE.default.proc.entryHTMLparser_db
  209.  
  210.  
  211.  
  212. FE < RTE.default
  213. FE {
  214. userElements >
  215. userLinks >
  216. proc {
  217. allowTags = p,b,i,span,div
  218. allowedClasses < RTE.default.allowedClasses
  219. allowedClasses := addToList(phone, contact)
  220. }
  221. }
  222.  
  223. buttons {
  224. link.properties.class.allowedClasses := addToList(phone, contact)
  225. }
  226. }
  227.  
  228. # Breite des RTE in Fullscreen-Ansicht
  229. TCEFORM.tt_content.bodytext.RTEfullScreenWidth = 100%
  230.  
  231. RTE.classesAnchor {
  232. phone {
  233. name = Telefon
  234. }
  235. contact {
  236. name = Kontakt
  237. }
  238. }
  239.  
  240. RTE.classes.center {
  241. name = Center
  242. }
  243.  
  244. RTE.default.colors = color1, color2, color3, color4
  245. RTE.colors {
  246. color1 {
  247. name = yellow
  248. value = #efab21
  249. }
  250. color2 {
  251. name = light-grey
  252. value = #e4e4e5
  253. }
  254. color3 {
  255. name = dark-grey
  256. value = #938e8c
  257. }
  258. color4 {
  259. name = broun
  260. value = #4b433e
  261. }
  262. }

https://github.com/groundstack-org