Zum Inhalt springen

Umbrüche mit dem RTE

Erstellt am 24. September 2002 · 26 Antworten · letzte Antwort am 16. September 2003 · Seite 2 von 2

Tags: HTML & CSS, Frage

nazgul23 ·

Hi,

Da hab ich mich wohl zu früh gefreut 🙁

Das Übertragen auf die Oberste Seite hat funktioniert, aber jetzt taucht ein anderes Prob auf.
Ich kann jetzt meine Listen Schachteln und dann wird das auch richtig angezeigt, aber es wird vom RTE der <LI>-Teil mit einem <P>-Tag gewrapt. Dies hat zur Folge, das zwischen den Listenelementen immer eine Leerzeile ist. In der CSS-Datei habe ich für den P-Tag folgendes stehen:

P {
	font-family : Arial,Helvetica,Geneva,Swiss,SunSans-Regular;
	font-size : 11px;
	line-height : 140%;
	color: #333333;
	padding-bottom : 0px;
}

egal wie ich an line-height und padding-bottom rumspiele hat es keine auswirkung auf diese Leerzeile.

Ich komme einfach nicht weiter :o
Ich mach jetzt Feierabend, das hat heute keinen Sinn mehr 😢

Gruß
nazgul23

nazgul23 ·

hi,

ich hab theoretisch ein lösung zu meinem Prob:
ich will die <P>-Tags durch <Div>-Tags ersetzten.

Ich hab es so versucht:

styles.content.RTE_encaps_stylesheets.remapTag.P = DIV

Das funktioniert aber nicht #paralyzed#

Ist das der falsche Schlüssel???

Gruß
nazgul23

dj.​picasso ·

Hi nazgul23,

wenn ich das richtig verstanden habe, dann schmeißt Du bei der Nutzung von CSS etwas durcheinander.

Du sagst, du möchtest Listen per CSS steuern (<LI>) versuchst dies aber über den <p>-tag im Style-Sheet. Das kann nicht funktionieren, außer Du erweiterst es. Ich trage dafür meist direkt am Anfang meines Style Sheets folgendes ein. Beispiel:

/* Allgemeine Definition der Schrifttypen */
h1, h2, h3, h4, h5, h6, p {
font-family: Arial, Helvetica, sans-serif;
color: #000000;
font-size: 10 px;
font-style: normal;
font-variant: normal;
text-transform: none;
text-decoration: none;
text-indent: 0px;
letter-spacing: normal;
line-height: normal;
margin: 0px 0px 0px 0px;
}

/* Allgemeine Definition der Listen */
ul, ol, dd {
font-family: Arial, Helvetica, sans-serif;
color: #000000;
font-size: 10 px;
font-style: normal;
font-variant: normal;
text-transform: none;
text-decoration: none;
text-indent: 0px;
letter-spacing: normal;
line-height: normal;
margin: 0px 0px 0px 20px;
}

Hier hättest Du dann Deine normalen Schriften von den Listen getrennt. Kurze Info falls nicht bekannt: margin 0px 0px 0px 20px;
bedeutet Rand oben, rechts, unten, links.

Falls Du keine CrossBrowser-Abfrage für Dein StyleSheet machst, solltest Du zumindest standardmäßig ca. 20px linker Rand angeben, da sonst unter dem MS IE Deine Punkte im linken Rand untergehen.

Danach kannst Du dann ja Deine individuellen Listen benennen und kannst jede Liste entsprechend anders einrücken.

Kleiner Tip: Mit <div> (Containern) springen viele nach Belieben um und des öfteren wissen diejenigen dann nicht was sie tun (weil es ja irgendwie funktioniert). Der eigentliche Sinn dieser Container ist aber das Arbeiten im "3-dimensionalen" HTML sowie die daraus resultierende Steuerung/Positionierung über Styles - sprich das Arbeiten mit Ebenen/Layern/Z-Indizees.

Hier aber wiederum vorsicht ohne CrossBrowser Abfragen. Das geht nämlich sonst in den meisten Fällen in die Hose. Auch bei Formularen und Hyperlinks kann sich das sehr schnell aufgrund der unterschiedlichen DOM-Strukturen der Browser negativ auswirken.

Ciao
DJ Picasso

nazgul23 ·

hi dj.picasso,

nicht ganz 😉

Also ich will eigentlich nur meine Listen verschachteln können.
Das geht aber mit der Standardeinstellung von RTE nicht (weil er listen in <typolist> umwandelt und dann die verschachtelung auflöst).

Mein nächster Gedanke war dann, dass ich die typolisten ausschalte.
Dies habe ich im TSConfig im Seitentitel der Rootseite so gemacht:

RTE.default.proc.typolist=0

Desweiteren habe ich im Template unter Setup dies geändert (weil die Listen im tt_content mit Tabellen generiert werden):

tt_content.bullets.20.default.wrap = <UL> | </UL>
tt_content.bullets.20.default.split.1.wrap = <LI> | </LI>

Das ist für die Listen ohne RTE.

tt_content.text.20.parseFunc.tags.typolist.default.wrap = <UL> | </UL>
tt_content.text.20.parseFunc.tags.typolist.default.split.1.wrap = <LI> | </LI>

Und das für die Listen im RTE, aber Eigentlich ist das ja überflüssig, weil ich es ja abgeschaltet habe.

Das Verschachteln hat dann funktioniert, aber weil der RTE um jede Zeile wraped habe ich jetzt um jedes Listenelement den Font-Tag und darum den P-Tag.
Daraus ergibt sich das Problem, dass die Listenelemente nicht zusammen sind, sondern eine Leerzeile dazwischen ist und das ist sehr unschön #paralyzed#

Folgendes habe ich getestet:
- die HTML-Seite local gespeichert und
-- versucht per CSS einstellung die leerzeile wegzubekommen -> geht nicht
-- die P-Tags durch DIV-Tags entfernt --> die Leerzeile ist weg.

Und dann habe ich mir gedacht, weil ich das wrapen nicht wegbekomme wollte ich die P-Tags durch Div-Tags ersetzten. Aber wie o.O

ich hab mir auch schon den Adminguide unter die Lupe genommen, entweder bin ich blind oder mein Englisch ist nicht so gut, um das zu verstehen 🙁

Was könnte ich sonst machen um die Leerzeilen wegzubekommen o.O

der RTE hat schon komische angewohnheiten 😉

Viele Grüße
nazgul23

dj.​picasso ·

Hi nazgul23,

also erst einmal muß ich gestehen, dass ich noch ein Newbee bin, was das arbeiten mit Typo3 angeht. Deshalb triffst Du mich natürlich mit Deinem Code an meiner schwachen Stelle. Aber ich arbeite dran 😃 .

Mit Deinem CSS Problem habe ich das mal mit einer statischen HTML Seite getestet. Kein Problem bei mir.

Hier mal der HTML-Code:

<ul class="test">
<li>Liste1</li>
<li>Liste2</li>
<ul class="test">
<li>Liste1</li>
<li>Liste2</li>
<li>Liste3</li>
<li>Liste4</li>
<li>Liste5</li>
</ul>
<li>Liste3</li>
<li>Liste4</li>
<li>Liste5</li>
</ul>
<p class="txt1">Dies ist ein normaler Text</p>

Mit dem Quelltext, den ich dir schon gepostet hatte und der Ergänzung (nur Beispielhaft!!):

.test {font-size: 12px; font-weight: bold; text-align:left; color: #000000; margin: 0px 0px 0px 20px;}

bekomme ich zwei Listen, die entsprechend versetzt und ohne Leerzeichen dargestellt werden (sowohl Netscape 6.x, MSIE 5.X als auch MSIE 6.X).
Auch nach den beiden Listen erscheinen in meinen Browsern keine Abstände, sondern direkt die Zeile mit dem Text.
Daher sollte es doch eigentlich reichen wenn Du Deine <UL> Einträge ergänzt.
Falls Du dann jedoch weitere Einstellungen über Fonts in Deinen Listen einträgst, kann das natürlich dazu führen, dass Deine Listendarstellung wieder über den Haufen geworfen wird.

Ciao
DJ Picasso

Ach ja, falls Du die Darstellung der Punkte innerhalb der Listen unterschiedlicher Art haben möchtest, funktioniert natürlich mittlerweile (früher mal ein Problem von Netscape) folgendes:

<ul>
<li class="test">Liste21</li>
<ul>
<li class="test2">Liste31</li>
<li class="test3">Liste32</li>
<li class="test4">Liste33</li>
<li class="test5">Liste34</li>
</ul>
<li class="test">Liste22</li>
<li class="test">Liste23</li>
<li class="test">Liste24</li>
</ul>

nazgul23 ·

Hallo

Also wenn ich jetzt im RTE eine Liste erstelle siehter Cod z.b. im RTE so aus:

<ul>
  <li>Liste1</li>
  <li>Liste2</li>
  <ul>
    <li>Liste1</li>
    <li>Liste2</li>
    <li>Liste3</li>
    <li>Liste4</li>
    <li>Liste5</li>
  </ul>
  <li>Liste3</li>
  <li>Liste4</li>
  <li>Liste5</li>
</ul>

das ist ja ganz schön und gut, aber wenn ich dann im FE den Code anschaue sieht er so aus:

<ul>
  <P style="margin:0 0 0 0;"><font face="Arial..." size="2" color="black"><li>Liste1</li></font></P>
  <P style="margin:0 0 0 0;"><font face="Arial..." size="2" color="black"><li>Liste2</li></font></P>
  <ul>
  <P style="margin:0 0 0 0;"><font face="Arial..." size="2" color="black"><li>Liste1</li></font></P>
  <P style="margin:0 0 0 0;"><font face="Arial..." size="2" color="black"><li>Liste2</li></font></P>
  <P style="margin:0 0 0 0;"><font face="Arial..." size="2" color="black"><li>Liste3</li></font></P>
  <P style="margin:0 0 0 0;"><font face="Arial..." size="2" color="black"><li>Liste4</li></font></P>
  <P style="margin:0 0 0 0;"><font face="Arial..." size="2" color="black"><li>Liste5</li></font></P>
  </ul>
  <P style="margin:0 0 0 0;"><font face="Arial..." size="2" color="black"><li>Liste3</li></font></P>
  <P style="margin:0 0 0 0;"><font face="Arial..." size="2" color="black"><li>Liste4</li></font></P>
  <P style="margin:0 0 0 0;"><font face="Arial..." size="2" color="black"><li>Liste5</li></font></P>
</ul>

Warum das gemacht wir, steht im Adminguid. Aber egal was ich in style im P-Tag eintrage (hab es Statisch getestet) es verändert sich nichts auf Bezug der Leerzeile. 🙁

Und wie bekomme ich die P-Tags weg oder wie kann ich sie durch Div-Tag ersetzten? Dann würde es funktionieren.

Ist es jetzt verständlich, was ich will o.O

Viele Grüße
nazgul23

dj.​picasso ·

Hi,

habe mir mal das Adminguide angesehen (Seite 25 ff) und bin derzeit nur am Staunen. :o

Muß Dich daher etwas vertrösten, da ich mir die Dinge erst etwas verständlicher machen muß.
Ich hoffe das ist ok.

Auf jeden Fall macht der Code, den Du als Resultat erhälst keinen Sinn. Das kann ja nicht funktionieren.

Wenn ich irgendetwas herausbekommen habe, dann melde ich mich.
Ciao
DJ Picasso

nazgul23 ·

ja das wäre echt super.

irgendwie hab ich da eine denckblockade und ich komme nicht weiter 😢

Vielen Dank für deine bisherigen bemühungen 🙂

Viele Grüße
nazgul23

nazgul23 ·

Hallo Patrik,

nee ich habe noch keine Lösung.
Ich hab die Listen so gelassen, dass sie immer eine Leerzeile zwischen den Punkten habe.

Gruß
nazgul23

Kirtapatrik ·

Hallo

Es gibt die Möglichkeit einen Listen Content zu erstellen da tritt diese Problem nicht auf.

Jedoch macht dies das editieren der Seite auch nicht gerade einfacher.

Gruss Patrik

dj.​picasso ·

Hi nazgul23,

ich hatte ja versprochen, ich melde mich wieder:
Mittlerweile bin ich soweit, dass ich mich etwas durch das RTE gewühlt habe und ausnahmsweise ergibt sich bei mir kein Problem mit der Darstellung.

Wenn ich bei mir

tt_content.text.20.parseFunc.tags.typolist.default.wrap = <UL class="test"> | </UL> 
tt_content.text.20.parseFunc.tags.typolist.default.split.1.wrap = <LI > | </LI>

einstelle, dann konvertiert mir der RTE auch den Code genauso in meine Seite.

Ich erhalte dann

<ul class="test"> 
  <li>Liste1</li> 
  <li>Liste2</li> 
  <li>Liste3</li> 
  <li>Liste4</li> 
  <li>Liste5</li> 
</ul>

Ciao
Der DJ
PS: Nur mit der Kaskadierung von Listen bin ich noch nicht weiter.

SolarUwe ·

Hi allerseits,

ich habe auch schon versucht, die Listen in ganz normalem HTML zu erhalten - an Verschachtelungen habe ich mich dabei noch nicht gemacht. Ich bin einen etwas anderen Weg gegangen als DJ Picasso. Dazu habe ich die Bullets in tt_content angepasst, nämlich in <ul>|</ul> verwandelt (habe ich so ähnlich in einem Posting unter www.toaster-schwerin.de/typo3) gefunden. Das funktioniert soweit auch ganz gut. Nur wrapped die RTE die ganze <ul>-Liste wieder in <p></p>.

Soweit ich ein anderes Posting von Kaspar verstehe, ist es unmöglich, der RTE das wrappen in <p></p> abzugewöhnen. Oder ist DJ Picassos Posting so zu verstehen, dass auch das abzuschalten ist?

Hier übrigens der oben erwähnte Code aus meinem SETUP:

tt_content.bullets.20.2.split.1.wrap =
tt_content.bullets.20.2.wrap = <ul>|</ul>
tt_content.bullets.20.3.split.1.wrap =
tt_content.bullets.20.3.wrap = <ul>|</ul>
tt_content.bullets.20.default.split.1.wrap =
tt_content.bullets.20.default.wrap = <ul>|</ul>

tt_content.text.20.parseFunc.tags{
typolist < tt_content.bullets.20.3
typolist {
setCurrent >
stdWrap.if.isTrue.current = 1
}
}

Schönes Neues Jahr,
UWE.

wikki ·

keine ahnung, ob die "lösung" irgend jemanden noch interessiert (falls es hier überhaupt eine funktionierende lösung gibt). bei mir macht er jetzt wenigstens das, was er machen soll

im page header steht

RTE.default.proc{
	typolist = 0
	dontConvBRtoParagraph = 1
	allowTagsInTypolists = a,br,b,i,u,img,div
	denyTags = font
	allowedClasses = maincontent,contenttext
	skipAlign = 1
	skipClass = 1
	remapParagraphTag = div
	entryHTMLparser_db.rmTagIfNoAttrib = span,div
}

und im template setup steht
http://typo3.org/1422+M5b612e16e62.0.html