FORUM » Backend » Rich Text Editor

[HowTo] htmlarea / RTE (Konfiguration) - so gehts wurde Beantwortet

[1] [2] [3] [Nächste ›] [Letzte »]
Autor Nachricht
Verfasst am: 21.03.2006 [13:38]
ms_k

[Themenersteller]
dabei seit: 17.02.2005
Beiträge: 132
 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.
htmlArea RTE Version 1.1.3
TSconfig-Eintrag:
Typoscript:Zeilennummerierung:  An / Aus

  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%



rte_formate.css (heisst bei mir halt so):

.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;
}


Konfiguration in den Extensions-Einstellungen:
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
Karinicon_cool.gif

[Dieser Beitrag wurde 1 mal bearbeitet. Zuletzt am 21.03.2006 um 13:39]
rhein-main.net gmbh
www.rhein-main.net
www.tatsachen-ueber-deutschland.de
www.young-germany.de
Verfasst am: 21.03.2006 [14:31]
just2b

[Moderator]
dabei seit: 04.08.2004
Beiträge: 15715
über 5000 Posts über 10000 Posts über 15000 Posts		 Danke Karin!
⇒ TYPO3 - inspiring people to share ⇐ aber kein Support per PM!
⇒ Das ist TS: lib.menu.20.if.value.stdWrap.numRows.select.pidInList.stdWrap.cObject.field = uid
⇒ in eigener Sache: · Meine Forumregeln · Meine Seite www.ringer.it · Meine Extensions · Content-Management-Systeme mit TYPO3 & RedDot ⇐
Verfasst am: 21.03.2006 [17:54]
ms_k

[Themenersteller]
dabei seit: 17.02.2005
Beiträge: 132
 icon_biggrin.gifNur als kleine Anmerkung zum RTE Guide, zum techn. drum herum:

- TYPO3: Version: 3.8.1
- Extension: htmlArea RTE Version 1.1.3
rhein-main.net gmbh
www.rhein-main.net
www.tatsachen-ueber-deutschland.de
www.young-germany.de
Verfasst am: 27.03.2006 [13:25]
EwaldMI


dabei seit: 08.03.2006
Beiträge: 41
 Hallo!

Zwei kurze Fragen:

In welche TSconfig muss ich das Script einbauen?

und

In welches Verzeichnis muss das rte_formate.css?

Vielen Dank

[Dieser Beitrag wurde 1 mal bearbeitet. Zuletzt am 27.03.2006 um 13:25]
MfG aus Münster, Ewald
Verfasst am: 27.03.2006 [14:06]
M8TRIX


dabei seit: 18.12.2004
Beiträge: 328
 @EwaldMI

Setze den obigen TS-Code im TSconfig: deiner Root-Seite (Hauptseite).

Das zweite ist dir überlassen wo du die css Datei ablegst. Wichtig ist nur das Du später richtig auf diese verlinkst bzw. sie einbindest.


Typoscript:Zeilennummerierung:  An / Aus

  1. # RTE Konfiguration
  2. RTE.default {
  3. # Zuweisung der CSS-Datei
  4. contentCSS = fileadmin/templates/html/css/rte_formate.css}

da liegt Sie bei mir. Der Pfad muss halt stimmen.

ALL:
Welcher Teil des TS Codes behebt denn den BUG, das Links die in Tabellen gesetzt wurden einfach nicht mehr vorhanden sind. Zumindest nicht im Frontend?

Wäre supi wenn mir jemand genau diesen Teil rauspickt! denn bei mir fuktionieren nun alle bereits vorhandenen LINKS die in einer Tabelle sind nicht mehr!

lg sandra

[Dieser Beitrag wurde 1 mal bearbeitet. Zuletzt am 27.03.2006 um 14:13]
Hilfe gibts auch hier:
www.typo3forum.net
Verfasst am: 29.03.2006 [10:29]
Andrea_Herzog

dabei seit: 06.09.2004
Beiträge: 400
 Hallo Sandra,

theoretisch das hier:

Typoscript:Zeilennummerierung:  An / Aus

  1. lib.parseFunc_RTE.externalBlocks.table.HTMLtableCells.default.stdWrap.parseFunc {
  2.   makelinks = 1
  3.   makelinks.http.keep = scheme,path,query
  4.   makelinks.mailto.keep = path
  5.   tags {
  6.       link = TEXT
  7.           link {
  8.           current = 1
  9.           typolink.parameter.data = parameters : allParams
  10.           }
  11.    }


Funktioniert bei mir auf einer Seite tadellos,
auf einer anderen Seite nicht. Keine Ahnung warum.

Viele Grüße
Andrea
Verfasst am: 30.03.2006 [15:18]
M8TRIX


dabei seit: 18.12.2004
Beiträge: 328
 Mist! Bei mir funktioniert das nicht :(

Im RTE sieht man die Links noch als LInks (er zeigt auch an, welche datei zb dahinter gelinkt ist)

Im Frontend jedoch gibt er keine links aus. Stattdessen steht im quelltext:

Html4strict:Zeilennummerierung:  An / Aus

  1. <LINK fileadmin/upload/dateien/muster_72dpi.jpg 400x500>72 dpi </LINK>


Hat keiner ne Ahnung was das sein könnte?

lg sandra

[Dieser Beitrag wurde 1 mal bearbeitet. Zuletzt am 30.03.2006 um 15:18]
Hilfe gibts auch hier:
www.typo3forum.net
Verfasst am: 31.03.2006 [19:38]
onkelfusspilz

dabei seit: 09.11.2004
Beiträge: 82
 Hallo Karin,

dein Post hat mir eine Menge Arbeit und Ärger erspart, vielen Dank dafür!

Aber zu 100% gezähmt habe ich das RTE-Monster noch nicht. Ich verwende den RTE 1.2 (mit dem die Config aber reibungslos funktioniert), folgende Dinge sind bei mir noch unrund:

1.) Die Schaltfläche zum Umschalten in die Quelltext-Ansicht ist verschwunden (früher Symbol "<>". Man kann die Funktion zwar durch "Rich Text Editor abschalten:" erreichen, muss dazu aber speichern und dann wieder aktivieren und nochmal speichern um kurz die Ansicht zu wechseln.
2.) Wenn ich im RTE eine Tabelle einfüge und dann rechte Maustaste "Tabelleneigenschaften" auswähle, so gibt es dort ein Feld "Überschrift". Sieht auch ok aus im RTE aber im FE steht dann <caption>Tabellen-Überschrift</caption> (und zwar wirklich der Tag!)

Hat jemand Lösungsansätze zu einem (oder besser mehreren) dieser Probleme? Oder hat die Probleme ausser mir zumindest noch jemand oder geht das bei euch?

@Matr1x: Kannst Du mal schauen was Du im Typoscript Objectbrowser für "lib.parseFunc.allowTags" respektive "lib.parseFunc.denyTags" gesetzt hast? Versuch es ggf. mal mit
Typoscript:Zeilennummerierung:  An / Aus

  1. lib.parseFunc.allowTags = *
  2. lib.parseFunc.denyTags =
Eine weitere Idee wäre: Kann es sein dass Du den Code verwendest der hier in einem Thread gepostet wurde und das Problem " wraps in Tabellenzellen" behebt? Ich glaube das war sowas wie
Typoscript:Zeilennummerierung:  An / Aus

  1. lib.parseFunc_RTE.externalBlocks.table.HTMLtableCells.default.callRecursive = 0
  2. tt_content.table.20.innerStdWrap.parseFunc.nonTypoTagStdWrap.encapsLines.wrapNonWrappedLines = |
  3. tt_content.stdWrap.dataWrap >
  4. lib.parseFunc_RTE.nonTypoTagStdWrap.encapsLines>
Kommentiere die Zeile doch mal zum Test aus und sag ob Du damit Erfolg hattest.

Grüsse,
Andreas

[Dieser Beitrag wurde 2 mal bearbeitet. Zuletzt am 31.03.2006 um 20:40]
Verfasst am: 03.04.2006 [07:43]
M8TRIX


dabei seit: 18.12.2004
Beiträge: 328
onkelfusspilz schrieb:

1.) Die Schaltfläche zum Umschalten in die Quelltext-Ansicht ist verschwunden (früher Symbol "<>".


Dito! Ich bräuchte diesen Quelltext Button ebenfalls dringend wieder!
Hab ihn eigentlich per TS eingeblendet, vorrausgesetzt der Code ist richtig!
Typoscript:Zeilennummerierung:  An / Aus

  1. # which buttons should be shown?
  2. RTE.default.showButtons = code

Sollte der TS Code falsch sein, korrigiert mich bitte.

onkelfusspilz schrieb:

@Matr1x: Kannst Du mal schauen was Du im Typoscript Objectbrowser für "lib.parseFunc.allowTags" respektive "lib.parseFunc.denyTags" gesetzt hast?


Ich verbiete des font-Tag.
Typoscript:Zeilennummerierung:  An / Aus

  1. RTE.default.proc {
  2. denyTags = font
  3. // LINES CONVERSION
  4. dontConvBRtoParagraph = 1
  5. }



onkelfusspilz schrieb:

Eine weitere Idee wäre: Kann es sein dass Du den Code verwendest der hier in einem Thread gepostet wurde und das Problem " wraps in Tabellenzellen" behebt? Ich glaube das war sowas wie
Typoscript:Zeilennummerierung:  An / Aus

  1. lib.parseFunc_RTE.externalBlocks.table.HTMLtableCells.default.callRecursive = 0
  2. tt_content.table.20.innerStdWrap.parseFunc.nonTypoTagStdWrap.encapsLines.wrapNonWrappedLines = |
  3. tt_content.stdWrap.dataWrap >
  4. lib.parseFunc_RTE.nonTypoTagStdWrap.encapsLines>
Kommentiere die Zeile doch mal zum Test aus und sag ob Du damit Erfolg hattest.

Grüsse,
Andreas


Ja...icon_biggrin.gifDu hattest recht icon_cool.gifNachdem ich die Zeilen auskommentiert habe, funktionieren nun auch wieder meine verlinkungen und auch im jeder beliebigen Größe und ebenfalls mit meinen definierten Stilen icon_biggrin.gifLass Dich mal ganz fest drücken icon_biggrin.gif

viele liebe Grüße

sandra
Hilfe gibts auch hier:
www.typo3forum.net
Verfasst am: 03.04.2006 [11:43]
ms_k

[Themenersteller]
dabei seit: 17.02.2005
Beiträge: 132
 Hi Ihr beiden,

ich denke ihr sucht diese Funktionen:

Typoscript:Zeilennummerierung:  An / Aus

  1. showButtons = chMode, inserttag


chMode: bringt euch den HTML <-> RTE Umschalter
inserttag: die Option einzelne HTML-Tags einzufügen

Grüße
Karin

rhein-main.net gmbh
www.rhein-main.net
www.tatsachen-ueber-deutschland.de
www.young-germany.de
[1] [2] [3] [Nächste ›] [Letzte »]



Impressum | Kontakt | TYPO3-Hosting | TYPO3-Schulungen

  
TYPO3 Version 4.2.0 testen

TYPO3 Ver. 4.2.0 testen

Testen Sie die neue TYPO3 Version 4.2.0 kostenlos für einen Monat

TYPO3 Bücher

TYPO3 Workshops

TYPO3 Einführungsschulung
in Berlin:
Montag, 07.07.
in Espelkamp:
Montag, 04.08.
TYPO3 Intensivschulung
in Espelkamp:
Mi., 06.08. - Fr., 08.08.
in Würzburg:
Mo., 18.08. - Mi., 20.08.
in Köln:
Mo., 01.09. - Mi., 03.09.
in Berlin:
Mi., 24.09. - Fr., 26.09.
TYPO3 Extensionschulung
in Berlin:
Mo., 14.07. - Mi., 16.07.
in Espelkamp:
Mo., 11.08. - Mi., 13.08.