htmlarea / RTE (Konfiguration) - so gehts

Auch wenn ich die Tags (also auch span) expliziet erlaube bzw. verbiete passiert das gleiche:

proc {
# Tags erlauben
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
		
# Tags verbieten
denyTags = font
.
.
.

Muss doch aber was mit proc zu tun haben...oder? Hier nochmal mein ganzes Setup:

### Spalten ausblenden ###
TCEFORM.tt_content.colPos.removeItems = 1,2,3
mod.SHARED.colPos_list = 0

###RTE:###

## Anchor classes configuration for use by the anchor accessibility feature
RTE.classesAnchor {
	externalLink {
		class = external-link
		type = url
		image = fileadmin/templates/htmlarea/img/external_link.gif
		altText = LLL:EXT:rtehtmlarea/htmlarea/plugins/TYPO3Browsers/locallang.xml:external_link_altText
		titleText = LLL:EXT:rtehtmlarea/htmlarea/plugins/TYPO3Browsers/locallang.xml:external_link_titleText
	}
	externalLinkInNewWindow {
		class = external-link-new-window
		type = url
		image = fileadmin/templates/htmlarea/img/external_link_new_window.gif
		altText = LLL:EXT:rtehtmlarea/htmlarea/plugins/TYPO3Browsers/locallang.xml:external_link_new_window_altText
		titleText = LLL:EXT:rtehtmlarea/htmlarea/plugins/TYPO3Browsers/locallang.xml:external_link_new_window_titleText
	}
	internalLink {
		class = internal-link
		type = page
		image = fileadmin/templates/htmlarea/img/internal_link.gif
		altText = LLL:EXT:rtehtmlarea/htmlarea/plugins/TYPO3Browsers/locallang.xml:internal_link_altText
		titleText = LLL:EXT:rtehtmlarea/htmlarea/plugins/TYPO3Browsers/locallang.xml:internal_link_titleText
	}
	internalLinkInNewWindow {
		class = internal-link-new-window
		type = page
		image = fileadmin/templates/htmlarea/img/internal_link_new_window.gif
		altText = LLL:EXT:rtehtmlarea/htmlarea/plugins/TYPO3Browsers/locallang.xml:internal_link_new_window_altText
		titleText = LLL:EXT:rtehtmlarea/htmlarea/plugins/TYPO3Browsers/locallang.xml:internal_link_new_window_titleText
	}
	download {
		class = download
		type = file
		image = fileadmin/templates/htmlarea/img/download.gif
		altText = LLL:EXT:rtehtmlarea/htmlarea/plugins/TYPO3Browsers/locallang.xml:download_altText
		titleText = LLL:EXT:rtehtmlarea/htmlarea/plugins/TYPO3Browsers/locallang.xml:download_titleText
	}
	mail {
		class = mail
		type = mail
		image = fileadmin/templates/htmlarea/img/mail.gif
		altText = LLL:EXT:rtehtmlarea/htmlarea/plugins/TYPO3Browsers/locallang.xml:mail_altText
		titleText = LLL:EXT:rtehtmlarea/htmlarea/plugins/TYPO3Browsers/locallang.xml:mail_titleText
	}
}

### RTE Classe des Interface (Ausrichtung)  ###
RTE.classes {
	align-left {
		name = LLL:EXT:rtehtmlarea/htmlarea/locallang_tooltips.xml:justifyleft
		value = text-align: left;
	}
	align-center {
		name = LLL:EXT:rtehtmlarea/htmlarea/locallang_tooltips.xml:justifycenter
		value = text-align: center;
	}
	align-right {
		name = LLL:EXT:rtehtmlarea/htmlarea/locallang_tooltips.xml:justifyright
		value = text-align: right;
	}
}

# Breite des RTE in Fullscreen-Ansicht
TCEFORM.tt_content.bodytext.RTEfullScreenWidth= 90%

### RTE Standard-Config ###
RTE.default {
  ## Zuweisung der CSS-Datei
  contentCSS = fileadmin/templates/htmlarea/htmlarea-edited-content.css
	
  ## Markup options
  enableWordClean = 1
  removeTrailingBR = 1
  removeComments = 1
	removeTags = center, sdfield
	removeTagsAndContents = style, script
	
	# Buttons die gezeigt/versteckt werden
	showButtons = chMode, 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, copy, cut, paste
	hideButtons = fontstyle, formatblock, fontsize, strikethrough,lefttoright, righttoleft, textcolor, bgcolor, textindicator, emoticon, user, spellcheck, inserttag, outdent, indent, justifyfull, subscript, superscript, acronym, about

	# 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
	
	# zeigt alle CSS-Klassen die in formate.css vorhanden sind
	showTagFreeClasses = 1
	
	# Specifies that Mozilla/Firefox should use style attributes or not. When enabled, Mozilla/Firefox use span tags with style attributes rather than tags such as b, i, font, etc.
	useCSS = 1

	## Add styles Left, center and right alignment of text in paragraphs and cells.
	inlineStyle.text-alignment (
		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; }
		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; }
		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; }
	)

	# 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
	}
	
	# Classes: Ausrichtung
	classesParagraph (
		align-left, align-center, align-right, box1
	)

	# Classes: Eigene Stile
	classesCharacter = headline
	classesImage = rte_image
	
	# 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 = 0
	disableColorFieldsetInTableOperations = 1
	disableLayoutFieldsetInTableOperations = 1
	disableBordersFieldsetInTableOperations = 0
	
	# FE RTE configuration (htmlArea RTE only)
	FE < RTE.default
	FE.userElements >
	FE.userLinks >
	
	## Use same processing as on entry to database to clean content pasted into the editor
	enableWordClean.HTMLparser < RTE.default.proc.entryHTMLparser_db

	### Customization of the server processing of the content - also called 'transformations'
	proc {
		# Tags erlauben
		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
		
		# Tags verbieten
		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,
			align-left, align-center, align-right, box1, headline
		)

		# 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

			# htmlSpecialChars = 1

			# align attribute werden erlaubt
			.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
	
				# img tags werden erlaubt
				img >
			}
		}
	}
}

Vielleicht hat ja jemand einen Tipp für mich.

Ich hatte die Ummantelung von Tabellenzelleninhalten mit <p> untebunden durch

lib.parseFunc_RTE.externalBlocks.table.HTMLtableCells.default.callRecursive = 0

Dadurch werden aber auch Links unterbunden.

Wie kann ich das so differenzieren, das tatsächlich nur die Paragraphen wegfallen ?

EDIT
Habe die Lösung, allerdings stosse ich ausgerechnet da auf einen Typo3-Bug:

lib.parseFunc_RTE.externalBlocks.table.stdWrap.HTMLparser.removeTags = p

Leider sorgt der Bug dafür, das die schliessenden p-tags enthalten bleiben ...
Habs in der Bugliste vermerkt.

Ich glaube ich hab einen kleinen Fehler im ersten Posting des Threads gefunden:

### align attribute werden erlaubt
 .tags {
       p.fixAttrib.align.unset >

Wenn ich bei mir den Punkt (.) vor "tags" weglasse, wird auch das Attribut align im Tag p gespeichert. Mit dem Punkt wird das Attribut beim Speichern weggeworfen.

Oder liege ich falsch und es gibt einen tieferen Sinn für den Punkt?
Bin noch nicht so 100%ig sattelfest in TS.

Gruss Stephan.

Hallo delldog,

da liegst du richtig, der Punkt ist überflüssig - macht lustiger weise bei meinem System keinen unterschied. Das align wird trotz .tag[...] gesetzt. Danke 🙂

Viele Grüße
ms_k

An dieser Stelle auch von mir ein herzliches Danke an Dich, Karin!
Ich bin genau im richtigen Moment auf Dein Posting gestoßen und es hat mir, wie vielen anderen anscheinend ebenso, eine Menge Nervenschmalz erspart... 😉

Lieben Gruß

Hi,

ich habe doch noch ein Problem.

jenachdem, wenn man z.B. Leerzeilen einfügt mit weichem Umbruch, erzeugt der RTE bei mir ein leeres div, das zu Layoutproblemen führt, ausserdem ja Quatsch ist:

<div></div>

Weiss jemand, womit das zusammenhängt bzw. wie ich ihm das abgewöhnen kann ?

vielen Dank.

Leerzeilen erzeugen ein leeres DIV???

Das problem habe ich nicht, habe allerdings auch nicht den code aus dem ersten post übernommen sondern eigenen ts gemacht.

mmh zwar konkrete Hilfe, aber an der ersten TSconfig sollte es nicht liegen.

Weiche Umbrüche = <br>
Harte Umbrüche = <p></p>

Der Fehler könnte z.B in der normalen TS liegen. hast du irgendwelche

styles.content.[blablah]

umdefiniert !?

Grüße
ms_k

nein, garnichts.

Ich habe lediglich den Code aus dem ersten post genommen und an meine Bedürfnisse angepasst, was sich auf die Anzeige der Buttons und eigene Klassen beschränkt.

Ich versuch das nochmal genau reproduzierbar zu machen. Gleiches Problem hatte ich auch beim Einfügen aus Word-Dokumenten - selbst das html-cleaning lässt solche Fragmente stehen.

Hallo zusammen,
ja vielen Dank mir hat auch das lesen dieses Postings geholfen.
Im Manual "Handbuch für Redakteure" ist die IE-Einstellung beschrieben.
Gut, habe ich gedacht, gilt auch für Typo3 4.0 mit htmlArea.
Nein, gilt nicht
Lösung:
Temporäre Internetdateien-Einstellungen
Neue Versionen... auf Automatisch stellen
Speicherplatz: muß größer als 32MB sein.
So habe ich es jedenfalls jetzt eingestellt.
Nun geht alles.
Ich hatte schon vermutet, die Einbindung der CSS-Dateien war falsch.
Gruß
Hille

Hi,

da leider niemand auf die Frage des Mucksters geantwortet hat möchte ich Sie nochmal wiederholen.

Die Grundkonfigration funktioniert wunderbar, jedoch ist auch mir aufgefallen, dass komischerweise span-tags ignoriert werden.

Ich hab die Tags explizit erlaubt, jedoch speichert er diese nicht in der Datenbank.

Hat jemand eine Idee wie man Tags innerhalb von p-Tags explizit erlauben kann, so dass die Standard-Buttons bold und italic funktionieren?

Danke im Voraus,
space2063

Hi,

ok, nachdem ich mich jetzt fast durch alle Einträge des Forums gequält habe (und das gleiche Problem mehrmals gesehen habe) ... kann ich die Frage präzisieren:

Es scheint, dass span-Tags, die eine class-Tag enthalten explizit über:

<code>
RTE.config.tt_content.bodytext.proc.allowedClasses = irgend_eine_klasse
</code>

erhalten werden könnnen. Das ist auch nicht die Frage. Wie kann man nun span-Tags speichern, die z.B. ein style-Tag besitzen? bzw. wie werden die Einträge, die htmlarea über die Buttons (bold/ italic) selbst einfügt, in der DB gespeichert ... das Gleiche gilt für Farbangaben etc.

MfG,
space2063

Hey,

ok, nachdem ich ein paar Stunden rumgedockert habe kam nun folgende Lösung bei raus: einfach dieses bisschen an Code hinzufügen *g*

RTE.default.proc {
  # Content to database
  entryHTMLparser_db = 1
  entryHTMLparser_db {
      
  ## align attribute werden erlaubt
  tags {
    #span.fixAttrib.align.unset >
    #span.allowedAttribs = class,style
    span >
  }
}

Der auskommentierte Teil brachte komischerweise keinen Erfolg. Egal zumindest konnte ich mir selbst weiter helfen *freu* (und evtl. anderen Leidensgenossen).

... evtl. macht es Sinn diese Zeile auf der ersten Seite hinzuzufügen(?)

Greetz,
space2063

Hallo zusammen,

ich habe mittlerweile alle Foren durch und sämtliche Lösungsansätze getestet, aber folgendes Problem bleibt, bzw. es ergibt sich ein weiteres Kuriosum...

die Definition eigener styles funktioniert und werden im Editor auch brav angezeigt. Nach der Speicherung gehen die für die Formatierung verantwortlichen <span>-tags allerdings verloren...
ändere ich aber die Klasse manuell auf eine default-Klasse, z.B. "important" werden sie gespeichert????? #angry# #angry#

ich könnte mir natürlich nun die drei Standard-Klasse nach meinen Bedürfnissen in meiner .css editieren (was funktioniert), das kann aber nicht der Weisheit letzter Schluss sein.....

Kann das irgendwie sein, dass da irgendwas hardcoded ist?

Ideen?

trage deine classes hier ein:
Codebeispiel... 😉
RTE.default {

## Zuweisung der CSS-Datei
contentCSS = /fileadmin/template/res/rte_formate.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 (
external-link, external-link-new-window, internal-link, internal-link-new-window, download, mail,
align-left, align-center, align-right,
csc-frame-frame1, csc-frame-frame2, csc-frame-frame3, csc-frame-frame4, csc-frame-frame5, csc-frame-frame6, csc-frame-frame7, csc-frame-frame8
csc-frame-rulerBefore, csc-frame-rulerAfter, csc-frame-indent, csc-frame-indent6633, csc-frame-indent3366, test
component-items, action-items,
component-items-ordered, action-items-ordered,
important, name-of-person, detail, downscript, superscript, underline, strikethrough, formatblock, blue, red, yellow, white
)
classesParagraph =align-left, align-center, align-right, justifycenter, csc-frame-frame1, csc-frame-frame2, csc-frame-frame3, csc-frame-frame4, csc-frame-frame5, csc-frame-rulerBefore, csc-frame-rulerAfter, csc-frame-indent, csc-frame-indent6633, csc-frame-indent3366, test
classesTable = csc-frame-frame1, csc-frame-frame2
classesTD = align-left, align-center, align-right
classesLinks = external-link, external-link-new-window, internal-link, internal-link-new-window, download, mail
classesCharacter = important, name-of-person, detail, downscript, superscript, underline, strikethrough, red-text, blue-text, yellow-text, white-text

}

:o unglaublich!

1000Dank!!!

Michael

Noch ne Frage
... wie kann ich den styles einen sprechenden Namen geben, also in der listbox?

Danke

Michael

in der rte_formate.css entsprechend benennen.

Hm, ich glaub' ich hab mich nicht richtig ausgedrückt...

Z.B. eine der default-Klassen heißt "important" wird aber als "Wichtig" gelistet...

Wenn die Antwort von Liberation doch passt, hab ich keine Idee, wie ich es in der .css eintrage...

RTE.classes {
align-left {
name = LLL:EXT:rtehtmlarea/htmlarea/locallang_tooltips.xml:justifyleft
value = text-align: left;
}
align-center {
name = LLL:EXT:rtehtmlarea/htmlarea/locallang_tooltips.xml:justifycenter
value = text-align: center;
}
align-right {
name = LLL:EXT:rtehtmlarea/htmlarea/locallang_tooltips.xml:justifyright
value = text-align: right;
}
csc-frame-frame1 {
name = LLL:EXT:rtehtmlarea/htmlarea/plugins/DynamicCSS/locallang.xml:frame-frame1
value = background-color: #EDEBF1; border: 1px solid #333333;
}
csc-frame-frame2 {
name = LLL:EXT:rtehtmlarea/htmlarea/plugins/DynamicCSS/locallang.xml:frame-frame2
value = background-color: #F5FFAA; border: 1px solid #333333;
}
csc-frame-frame3 {
name = Frame with red background
value = background-color: #B20707; border: 1px solid #333333;
}
csc-frame-frame4 {
name = Frame with blue background
value = background-color: #0C08B2; border: 1px solid #333333;
}
csc-frame-frame5 {
name = Frame with graydark background
value = background-color: #383838; border: 1px solid #333333;
}
csc-frame-frame6 {
name = Frame with gray background
value = background-color: #7b7b7b; border: 1px solid #333333;
}
csc-frame-frame7 {
name = Frame without background
value = border: 1px solid #333333;
}
csc-frame-rulerBefore {
name = Frame with rulerBefore
border-top: 1px solid #333333;
}
csc-frame-rulerAfter {
name = Frame with rulerAfter
border-bottom: 1px solid #333333;
}
csc-frame-indent {
name = Frame with 100px indent
padding-left: 100px;
}
csc-frame-indent3366 {
name = Frame with 33% indent left
padding-left: 33%;
}
csc-frame-indent6633 {
name = Frame with 33% padding right
padding-right: 33%;
}
important {
name = LLL:EXT:rtehtmlarea/htmlarea/plugins/DynamicCSS/locallang.xml:important
value = color: #8A0020;
}
}
Kostet min. ne Kiste Bier