Zum Inhalt springen

htmlarea / RTE (Konfiguration) - so gehts

Erstellt am 21. März 2006 · 191 Antworten · letzte Antwort am 28. Februar 2013 · Seite 6 von 10

Tags: Frage

kccm24 ·

Hallo zusammen,
habe den Thread gelesen, aber ich sehe keine Lösung für mein Problem:

In meiner CSS Datei habe ich den Bodytag mit eine Hintergrundgrafik versehen.

Wenn ich jetzt einen Text anlegen will erscheinzt diese Hintergrundgrafik im
rte_htmlarea, obwohl ich den Text in eine Tabellenzelle einfüge, die einen weißen
Hintergrund hat. Das nervt, weil die Hintergrundgrafik sich leider mit der Schirtffarbe beißt und diese kaum erkennbar ist.
Wie kann ich definieren, dass der bodytag im rte_htmlarea überschrieben wird?

Gruß
kccm24

mediaman ·

Hallo, ich habe auch ein Problem:

Habe bei mir die Align-Buttons aktiviert und nach einem Tag Recherche liefen die dann auch endlich mit:

RTE.default.proc {
entryHTMLparser_db.tags.img >

#- TAGS ALLOWED OUTSIDE P & DIV
allowTagsOutside = hr, address, img, size, span

entryHTMLparser_db = 1
entryHTMLparser_db.tags {
		p.fixAttrib.align.unset >
		div.fixAttrib.align.unset >
		p.allowedAttribs = class, style, align
		span.fixAttrib.style.unset >
	}
}

Heute musste ich dann noch eine Text-Klasse definieren. Das hat dann auch nach ein paar Stunden hingehauen:

RTE.default {
        # Zuweisung der CSS-Datei
        contentCSS = fileadmin/template/sonstiges/css_htmlarea.css 
        useCSS = 1
        

        showButtons = bold, italic, underline, 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, copy, cut, paste, fontsize,  left, center, right, textcolor, fontstyle, textstyle, textstylelabel

        

        hideButtons =  strikethrough,lefttoright, righttoleft, bgcolor, textindicator, emoticon, user, spellcheck, chMode, inserttag, outdent, indent, justifyfull, subscript, superscript, acronym, formatblock, blockstyle, blockstylelabel
        
        #Meine CSS-Klasse ist mit span versehen, also brauche ich keine 1!!
        showTagFreeClasses = 0

        ignoreMainStyleOverride = 0

        removeTags =
        removeTagsAndContents =
        hideTags =

        classesCharacter = roter-startseiten-text
        allowedClasses (roter-startseiten-text)
}

Tja, aber nun ist es vorbei mit den Align-Button, da funktioniert nämlich mal wieder die Speicherung nicht mehr, wie schon zuvor, als ich einen Tag nach der Lösung gesucht habe...

Habe dann in diesem Thread noch diese Lösung für Align gefunden:

entryHTMLparser_db.tags {
                span >
	}

funktioniert aber natürlich auch nicht. Ich krieg noch ein Schreikrampf bei diesem .... Editor #angry#

Danii ·

Mahlzeit zusammen,

erstmal danke an ms_k für den [HowTo]-Trööt. Allerdings habe ich noch zwei Sachen wo ich nicht weiter komme.

1. Problemerle
onkelfusspilz hat das Problem schon auf der ersten Seite angesprochen

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!)

Ich hab dazu leider keine Lösung finden können. Gibts hier schon Lösungsansätze?

2. Problemerle
Die Absatzeigenschaften funktionieren ja erst am einen öffnenden <p>-Tag der allerdings bei Neuanlegen eines Datensatzes nicht vorhanden ist. D.h. der Redakteur muss erst einmal eine Zeilenschaltung machen. Gibts ne Möglichkeit den <p>-Tag schon inital zu setzen?

Uuups und noch eins:

Wenn ich nach einer Tabelle eine Zeilenschaltung/Return einfüge, werden mir nach dem schließenden <table>-Tag zwei mal <p></p><p></p> reingebaut. Ist doch Käse. Kann ich da irgendwo schrauben?

ms_k ·

Hi Dani,

also Eine Gegenfrage nochmal zu Problem 1:
Was hättest denn gerne an der Stelle statt dem <caption> wenn du eine Tabellenüberschrift einfügst. Laut SELFHTML ist das doch legitim :o

zu Problem 2:
nach dem Speichern fügt er auch um eine einzeiliges Wortstück eine Absatzformatierung, ala <p>

mmh Problem uups *lach*:
tritt bei mir auch auf, hat mich bislang aber nicht gestört, weil ich eh Absätze am Ende brauche bzw. nach Tabellen als sinnvoll erachte. Daher sorry hab ich keine Lösung dafür ;-).

Viele Grüße
ms_k

Danii ·

Servus ms_k, erstmal Danke für deine Antwort.

zu Problem 1:
Das <caption>hallo</caption> steht so im FE und nicht im Quelltext!
Nach dem speichern der Seite steht's im BE noch kurz über der Tabelle (als Head so wie es sein soll) - im FE dann so wie oben beschrieben. Nach nochmaligen Aufruf der Seite im BE stehts dann ebenfalls so drin: caption>hallo</caption>

zu Problem 2:
eigentlich schade. Muss mal halt dem Redakteur richtig verkaufen dass er erst speichern muss um Änderungen zu machen. Wäre kofortabler, sprich userfreundlicher gewesen wenn der Redakteur gleich loslegen könnte.

mmh Problem uups *lach* *prust*:
Mich störts ja auch nicht - aber immer diese (kommenden Rückfragen des Redakteurs (warum geht des ned)) #angry#

ms_k ·

hi dani,

sorry hatte bei Problem 1 das FE überlesen:

tu doch den <caption>-tag einfach mal zu den proc.allowTags = ...
und entryHTMLparser_db.noAttrib = ...

Obwohl ich den Tag nicht darin hatte/habe funktioniert es bei mir, vielleicht gehts dann auch bei dir.

Mit was für einer T3 bzw. RTE Version arbeitest du denn?

Viele Grüße
ms_k

PS: Einfach manche Frage überhören und den Redakteur mit neuen Spielsachen glücklich machen, hehe *g* weisst schon die Ablenktaktik

Danii ·

Guten Morgen ms_k,

großes Danke für den Tipp - funktioniert wenn ich das in proc.allowTags = ...
und entryHTMLparser_db.noAttrib = ... eingebe. Super

T3-Intallation ist 3.8.0 und htmlArea 1.1.3

Ich bin ja gespannt welche kleinen Stolperfallen sich da noch auftun, wär ja langweilig wenn alles auf Anhieb klappen würde ;-)).

Estrobyn ·

Jetzt misch ich mich hier auch mal ein...

Habe den Code vom Anfang übernommen und das meiste funktioniert (Danke an ms_k!!!). Nur 2 Dinge nerven mich schon lange:

1) Wenn ich nur eine Zeile Text schreibe (ohne Absatz), erscheint das Pop-Down Menu "Paragraph" immer noch grau (deaktiviert) obwohl ich den einen Satz auch gerne mit einem css Format versehen würde... 😢 ("Text" bleibt auch deaktiviert) bis ich die Enter Taste drücke, dann aktivierts wie von geisterhand ... 😉

2) Ich habe in meinem CSS die Links so modifiziert, dass immer ein Pfeilchen automatisch vor jeden Link gesetzt wird. Der RTE schnallt das aber irgendwie nicht, der setzt das Pfeilchen immer vor den ganzen Satz wo der Link drin ist resp . wenn ich mit <BR> umbreche sogar vor dem gesamten Absatz... #paralyzed#

Hatte da jemand schon dieselben Probleme und/oder weiss ne Lösung?

Danke und Grüsse

Estro

ms_k ·

Hallo,

1) Wenn ich nur eine Zeile Text schreibe (ohne Absatz), erscheint das Pop-Down Menu "Paragraph" immer noch grau (deaktiviert) obwohl ich den einen Satz auch gerne mit einem css Format versehen würde... icon_cry.gif("Text" bleibt auch deaktiviert) bis ich die Enter Taste drücke, dann aktivierts wie von geisterhand ... 😉

das scheint noch ein besonderes Feature zu sein, denn erst wenn man speichert wird bei einer einzeiligen Geschichte ein <p>-Tag gesetzt und erst sobald ein Tag vorhanden ist - werden die Format- und Stilvorlagen aktiviert. Also dafür hab ich auch noch keine Lösung, aber ich finde mit der <enter> bzw. speichern-Variante lässt es sich leben 😃 .

2) Ich habe in meinem CSS die Links so modifiziert, dass immer ein Pfeilchen automatisch vor jeden Link gesetzt wird. Der RTE schnallt das aber irgendwie nicht, der setzt das Pfeilchen immer vor den ganzen Satz wo der Link drin ist resp . wenn ich mit <BR> umbreche sogar vor dem gesamten Absatz..

post doch mal auszüge aus deinem HTML-Quellcode bzw. CSS-Code, denn momentan würd ich eher auf definitionsfehler dort tippen.

Grüße
ms_k

Estrobyn ·

Hallo!

Vielen Dank für deine Antwort!

das scheint noch ein besonderes Feature zu sein, denn erst wenn man speichert wird bei einer einzeiligen Geschichte ein <p>-Tag gesetzt und erst sobald ein Tag vorhanden ist - werden die Format- und Stilvorlagen aktiviert. Also dafür hab ich auch noch keine Lösung, aber ich finde mit der <enter> bzw. speichern-Variante lässt es sich leben.

Ja, das denke ich mir auch. Also für mich ist es kein Problem. Es kamen von anderen Benutzern des Backend immer die gleichen Fragen, wieso dass es nicht funktioniert, etc. Aber sowas mit dem <p> Tag habe ich au vermutet... Vielleicht gibt's ja doch irgendwann ne Lösung. Bei mir ist es meistens so: Sobald ich mich eine zeitlang nicht damit befasse kommt mir plötzlich die Lösung in den Sinn 😉

post doch mal auszüge aus deinem HTML-Quellcode bzw. CSS-Code, denn momentan würd ich eher auf definitionsfehler dort tippen.

Hier ist der CSS Code. Den habe ich bei einer anderen Website auch schon eingesetzt, dazumal aber noch mit dem alten RTE und der letzten Version von TYPO3... Da hat's geklappt... #paralyzed#

.bodytextlink{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	text-decoration: none; 
	color: #152665;
	list-style-type: none;
	background: url(img/pfeil_link.gif) no-repeat left center;
	padding: 0 0 0 10px;
}

Liebe Grüsse

Estro

ms_k ·

hi,

also meine CSS-Klassen sehen auch so aus, hast du die Klasse im TSconfig definiert ala:

Seite 1: Zeile: 101-104

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, author, [deinKlasse]
		)

und seite 1, zeile 165

# Classes: Eigene Stile
classesCharacter = [deineKlasse]

Die Klasse ist auch in deiner RTE definierten CSS und Sonstigen CSS bekannt?

Wie sieht denn dein generierter HTML-Quellcode aus.

Grüße
ms_k

Estrobyn ·

Salü!

PS: Kannst gleich nach unten scrollen, das erste Problem ist gelöst! 😉

Ja, das habe ich alles gemacht...

# 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, author, bodytextlink, bodytext
                )

und

        # Classes: Eigene Stile
        classesCharacter = author, bodytextlink, bodytext
        classesImage= rte_image

Der Quelltext sieht wie folgt aus:

<td id="content_bodytext" class="bodytext">
	<!--  CONTENT ELEMENT, uid:2/text [begin] -->
		
		<!--  Text: [begin] -->
			<p class="bodytextlink">Auf diesen Seiten stellt sich die <a href="http://www.seite.ch" title="Opens external link in new window" target="_top" class="external-link-new-window" >Sekundarschule</a> vor.</p>

		<!--  Text: [end] -->
			
	<!--  CONTENT ELEMENT, uid:2/text [end] -->
		
	
		</td>

Der Pfeil erscheint (sowohl im RTE als auch auf der Page) vor dem ganzen Text und nicht nur vor dem Link, obwohl ich explizit zuerst das zu verlinkende Wort markiert habe und dann "bodytextlink" auswählte (der Link ist ja auch nur auf dem einen Wort)... Ich nehme an, weil da ein <p> Tag fehlt und der RTE Klassen nur <p> Tags zuweisen kann? Vielleicht muss man dem sagen, dass die Klasse "bodytextlink" den <a> Tags zugeordnet werden soll?

Grüsse und danke!

Estro

-------------------
OMG - Jetzt habe ich den Fehler entdeckt.......

Ich habe anstatt das "Text" Pop-Down-Feld das "Paragraph" Pop-Down Feld benutzt... Oje, ist mir das peinlich... Aber ich glaube, es hat daran gelegen, dass ich die eigenen Klassen nicht sauber verlinkt habe im Config des RTE, sprich der TIPP mit

# 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, author, bodytextlink, bodytext
                )

und

        # Classes: Eigene Stile
        classesCharacter = author, bodytextlink, bodytext
        classesImage= rte_image

war Gold wert!!! Damit ist das Text-Pop-Down Menu erst erschienen...

Vielen herzlichen Dank!!!

Hmm... Lustigerweise funktioniert jetzt der "hover"-Effekt des so markierten Links aber nicht mehr... 🙁
Quelltext dazu:

<td id="content_bodytext" class="bodytext">
	<!--  CONTENT ELEMENT, uid:2/text [begin] -->
		
		<!--  Text: [begin] -->
			Auf diesen Seiten stellt sich die <a href="startseite.html" title="Opens internal link in current window" target="_top" class="bodytextlink" >Sekundarschule</a> vor.
		<!--  Text: [end] -->

			
	<!--  CONTENT ELEMENT, uid:2/text [end] -->
		
	
		</td>

Kann man eigentlich die Klassen beim Link-Setzen auch gleich umbenennen und die eigenen einfügen (z.B. "internal-link-new-window" mit meinem "bodytext" ersetzen)?

Liebe Grüsse

Estro

ms_k ·

hi,

hast du evtl. eine generelle A-tag Definition die in deiner CSS ist, die die Klasse bodytextlink noch überschreibt?

Kann man eigentlich die Klassen beim Link-Setzen auch gleich umbenennen und die eigenen einfügen (z.B. "internal-link-new-window" mit meinem "bodytext" ersetzen)?

äh in deinem geposteten Quellcode ist es doch schon so

#
<!-- Text: [begin] -->
#
Auf diesen Seiten stellt sich die <a href="startseite.html" title="Opens internal link in current window" target="_top" class="bodytextlink" >Sekundarschule</a> vor.
#
<!-- Text: [end] -->

oder war das der wunschquellcode *g*.

Grüße ms_k

Unbekannter Benutzer ·

Hi Leute,

ich stehe vor einem Problem. Ich möchte die RTE HTMLArea gerne für einen Kunden anpassen. Damit dieser leichter von mir definierte Klassen verwenden kann.

Wie ist es möglich evtl. Einrückungen vorzunehmen im Dropdownmenü?

Bsp:
Tabellenstil1

Klasse1
Klasse2
Klasse3

Tabellenstil2

Klasse4
Klasse5
Klasse6

Dies würde die Auswahl der richtigen Klasse enorm erleichtern.

Ich arbeite ebenfalls mit der rte_formate.css hier aus dem Forum und der im ersten Post zur Verfügung gestellten Konfiguration.

Gruß MoRpH2k2

PS: Ich musste die Quote Funktion nutzen um eine Einrückung hinzubekommen 😉 Sowohl Tabs als auch leerzeichen wurden ignoriert 😉

briem ·

Wie bekomme ich den alttext von Links weg?
Ich meine damit "Öffnet einen internen Link" usw.
Ich möchte auf diese Texte gänzlich verzichten.
Danke im vorraus

just2b ·
marelinchen schrieb

hallo weiss jemand wo ich die extension in version 1.2 downloaden kann.
auf typo3.org ist nur die neuste 1.4

extension manager > suche nach der ext > klick auf den titel > link oben dropdown version auswählen > update/o.ä. klicken

georg

Liberation ·
briem schrieb

Wie bekomme ich den alttext von Links weg?
Ich meine damit "Öffnet einen internen Link" usw.
Ich möchte auf diese Texte gänzlich verzichten.
Danke im vorraus

rootpage TS, nicht ins Template!
->
RTE.classesAnchor {
externalLink {
class = external-link
type = url
image = fileadmin/template/rte/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/template/rte/link.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/template/rte/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/template/rte/link.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/template/rte/link.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/template/rte/link.gif
altText = LLL:EXT:rtehtmlarea/htmlarea/plugins/TYPO3Browsers/locallang.xml:mail_altText
titleText = LLL:EXT:rtehtmlarea/htmlarea/plugins/TYPO3Browsers/locallang.xml:mail_titleText
}
}

Chiba City Boy ·

Hallo @all, nachdem ich seit längerem mitlese hab ich mich entschlossen mich nun auch registriert um eine Frage zu meinem kniffeligen Problem zu stellen.

Ich kriege den RTE absolut nicht nach meinen Wünschen konfiguriert, habe alle relevanten Threads hier im Forum gelesen, ebenso diese recht bekannte und erstklassige Anleitung zum RTE konfigureieren:http://ug.typo3-nrw.de/typo3-dynamic_css.html

Das Problem ist das die Drop-Downs "Absatz" und "Text" einfach immer ausgegraut sind, egal was ich mache. Das Thema gabs schon oft, aber keine der Lösungen dort hat geholfen. Ist auch kein Browserproblem, tritt in FF und IE auf. Bin echt ratlos.

Hier meine PgaeTS-Config:

RTE.classes {
        quelle{
                name = quelle
                value = color: #DA1F3D;text-align: right;width:300px;float:right;
        }
        kommentar {
                name = kommentar
                value = width:200px;float:right;border-left: 2px solid #DA1F3D;margin: 0 10px;padding: 0 10px 5% 10px;font-size: 1.1em;
        }
}

#CSS Konfiguration
RTE.default.contentCSS = fileadmin/rte.css
RTE.default.useCSS = 1
RTE.default.classesAnchor >
RTE.default.classesImage = links, rechts
RTE.config.tt_content.bodytext.proc.allowedClasses = quelle, kommentar

#RTE-Verhalten
RTE.default.enableWordClean = 1
RTE.default.disableEnterParagraphs = 0
RTE.default.hideTags = font, font (full)

#Transformation
RTE.default.proc {
   // TRANSFORMATION METHOD
   overruleMode = ts_css

   dontConvBRtoParagraph = 1
}

#Farben
RTE.default.disableColorPicker = 1
RTE.default.disableSelectColor = 0
#vordefinierte farben
RTE.colors {
   color1 {
      name = gelb
      value = #FFCD1F
   }

   color2 {
      name = hellgelb
      value = #FFF4D8
   }

   color3 {
      name = dunkelgelb
      value = #F0C11D
   }

   color4 {
      name = senf
      value = #D19400
   }

   color5 {
      name = rot
      value = #DA1F3D
   }

   color6 {
      name = dunkelrot
      value = #B01931
   }
}
RTE.default.colors = color1, color2, color3, color4, color5, color6

#Template-Compliance
#H1 schon vergeben
RTE.default.hidePStyleItems = PRE, H1

#WORKARAOUND wegen ausgegrauten Boxen:
RTE.default.showTagFreeClasses = 1

Das zugehörige rte.css:

p.quelle {
	color: #DA1F3D;
         text-align: right;
         width:300px;
         float:right;
         }

p.kommentar {
	width:200px;
         float:right;
         border-left: 2px solid #DA1F3D;
         margin: 0 10px;
         padding: 0 10px 5% 10px;
         font-size: 1.1em;
}

img {
	border: 1px solid #DA1F3D;
}

img.links {
	float: left;
         margin: 10px 10px 10px 0;
	border: 1px solid #DA1F3D;
}

img.rechts {
	float:right;
         margin: 10px 0 10px 10px;
	border: 1px solid #DA1F3D;
}

Die rte.css wird zusätzlich zur "normalen" styles.css eingebunden, ist auch in der Ausgabe korrekt.

Was in der Ausgabe allerdings ebenfalls fehlt, sind die <p> Tags. Alles was im RTE noch innerhalb von <p>-Tags sitzt, steht einfach plain im Quelltext der Ausgabe. In der Quelltextansicht des RTE sind die <p> noch da!

Nach einigem rumprobieren habe ich festgestellt, dass "Absatz" und "Text" ausgegraut werden sobald diese Zeile drin steht, ohne die es ja aber auch niocht geht: RTE.default.contentCSS = fileadmin/rte.css

Ich verwende Typo 4.0, rteHTMLArea

Wäre super wenn jemand dazu ne Lösung wüsste, ich bin echt seit Tagen am rumbasteln und kurz davor hinzuschmeissen.

LG, CCB