Stylesheets

hallo zusammen

gibt es eine möglichkeit dem RTE stylesheets zu lernen? also dass nicht der veraltete font-tag benutzt wird, wenn ich die schriftart ändern will, sondern aus einer styleshet-datei sämtliche styles aufgelistet werden und ich dann einen herausnehmen kann, welcher dann auch verwendet wird

z.b. schreib ich einen text im RTE , der quelltext schaut dann ca so aus:

<P>Feine &amp; bekömmliche Küche im Haubenrestaurant nahe Salzburg.</P>

so. jetzt will ich dieser zeile einen style aus meiner eigenen stylesheet-datei zuweisen.

im css-file steht dann z.b. folgendes:

h1, .headline
{	
color: #FF6666;
font-size: 11px;
font-weight: bold;
font-family: Verdana,Arial;
}

geht das irgendwie ohne jetzt auf den reinen html-modus zu wechseln? es soll ja z.b. für irgnedwelche DAUs auch wartbar und zumutbar sein...

danke im voraus für eure hilfe! 🙂

es soll dann praktisch am ende im sourcecode nicht sowas stehn:

<P style="margin:0 0 0 0;"><font size="2">Feine & bekömmliche Küche im Haubenrestaurant nahe Salzburg.</font></P>

sondern schön sauber und leserlich:

<h1>Feine & bekömmliche Küche im Haubenrestaurant nahe Salzburg.</h1>

das gleiche gilt natürlich überall.. also für stink normalen content-text... aus:

<P style="margin:0 0 0 0;"><font size="2">

soll

<p>

werden. wobei <p> dann in meinem stylesheet-file z.b. so definiert ist:

p
{	
font-size: 11px;
font-family: Verdana,Arial;
color: #666666;
}

hat jemand einen vorschlag wie ich das am besten, einfachsten und schnellsten lösen kann?

bitte! hat keiner erfahrungen damit, wie man typo3 dazu bewegen kann NUR stylesheets zu verwenden??

hmm, wenn ich Dich richtig verstehe möchtest Du nur Stile und ein paar Hx-Tags verwenden - na dann probier mal das hier

RTE.classes {
  mainBodyText {
    name = Body Text (Primary)
    value = font:bold; color:blue;
  }

  News {
  name = News
 value = font: bold 15px Arial, Helvetica, sans-serif
 }
}

RTE.default.disabled = 0


RTE.config.tt_content.bodytext.types {

# Hier wird eingestellt welche Schaltflächen im RTE 
# NICHT zur Verfügung stehen
text.hideButtons=line,bold,italic,left,fontsize,center

# und hier welche Schaltflächen außerdem da sein sollen
text.showButtons = class

# Hier werden ein paar HTML-Tags ausgeschlossen
text.hidePStyleItems = h3, h4, h5, h6, pre

# und hier was im Pulldown unter den Schaltflächen angezeigt wird
text.classesParagraph =  mainBodyText, News
text.classesCharacter =  mainBodyText, News
}

HTH, vielleicht auch ein paar anderen...
BB

Hi!

nagus schrieb

geht das irgendwie ohne jetzt auf den reinen html-modus zu wechseln? es soll ja z.b. für irgnedwelche DAUs auch wartbar und zumutbar sein...

Ich verwende z.B. die folgende Konfiguration dese RTE;

### Konfiguration des RTE ###START###
  RTE.default {
    # Auszeichnungen, die ich nicht benötige
    hidePStyleItems = H2,H3,H4,H5,H6,PRE,P
    # Von mir "erfundene" Absatzformate
    classesParagraph = teaser,bodyText
    # Überscheiben der Typo3 Standard-Styles für H1 und Body, damit diese auch im BE korrekt dargestellt werden
    mainStyleOverride_add.H1 = color:#FF962C; font-size: 12px; font-weight: bold; margin-top: 0px; margin-bottom: 0px;
    mainStyleOverride_add.BODY = font-family:arial,helvetica,sans-serif; font-size: 10px; background-color:#FFFFFF; color:#000000; margin:10px;
  } 

  RTE.classes {
    # Meine Absatzvorlagen in den RTE einbinden
    teaser {
      name = Teaser
      value = margin-top: 10px; font-size: 11px; line-height:20px; font:bold; 
    }
    bodyText {
      name = Fliesstext
      value= margin-top: 10px;font-size:11px; line-height: 20px; color: #444444
    }
  }
### Konfiguration des RTE ###ENDE###

Durch diese Konfiguration können die Redakteure Ihren Text nur mit den Absatzvorlagen H1, Teaser und Fliesstext formatieren. Im Frontend wird dann z.B. folgender HTNML-Code erzeugt:

<h1>Eine Überschrift</h1>
<p class="teaser">Der Teaser .....</p>
<p class="bodyText">Und nun kommt Fliesstext...</p>

CU
maxhb

Hi maxhb,

genau das hab ich auch vor, dass ich den RTE so an Funktionen zu reduzieren, dass meine Autoren das Gesamtbild der Seite weniger stark verändern können.

Ich woltte alle Auszeichnungen verstecken und dann neue hinzufügen, die aber nicht in der Config sondern in einer Css-File ablegen will.

Was ginge wäre so was änliches:

RTE.classes { 
    # Meine Absatzvorlagen in den RTE einbinden 
    teaser { 
      name = Teaser 
      file=style.css ; ##hier soll der Verweis zur Style hin 
    } 
        }

Wie muss der Verweis lauten, das muss doch gehen.

mfg mavo

Hi!

mavo schrieb

Was ginge wäre so was änliches:

RTE.classes { 
    # Meine Absatzvorlagen in den RTE einbinden 
    teaser { 
      name = Teaser 
      file=style.css ; ##hier soll der Verweis zur Style hin 
    } 
        }

So einen Vereise kann man IMHO nicht vornehmen, allerdings bestimmt die obige Zeile auch nur, wie diese Absatzvorlage im BE angezeigt wird. Allerdings finde ich es einfach schöner, wenn die Redakteure quasi WYSIWIG-mässig arbeiten können...

CU
maxhb

Hi maxhb,

hab gerade mal dein Beispiel auf mein Design verändern wollen, leider wird der ganze nur im RTE richtig angezeigt, auf der Seite dann im Browser leider nicht mehr. Dort sind dann alle Formationen wieder wie früher und total vermurkst.

Hier der Code der TConfig der Hauptseite:

### Änderungen am Ausehen und Funktion des RTEs ###########
#################################################

  RTE.default { 
    # Allgemeine Änderungen des RTE ######################
    proc {
      dontConvBRtoParagraph = 1
      preserveTables = 1
      dontConvBRtoParagraph = 1
    }
       
    #  Änderugen an der Formatierung ######################
    # Auszeichnungen, die ich nicht benötige 
    hidePStyleItems = H1,H2,H3,H4,H5,H6,PRE, 
    # Von mir "erfundene" Absatzformate 
    classesParagraph = headline,text_small 
    # Überscheiben der Typo3 Standard-Styles für H1 und Body, damit diese auch im BE korrekt dargestellt werden 
    mainStyleOverride_add.H1 = font-family: arial,helvetica,sans-serif; color: #CB2424; font-size: 14px; font: bold; 
    mainStyleOverride_add.BODY = font-family: arial,helvetica,sans-serif; font-size: 12px; color: #000000; text-align: justify; 
  } 

  RTE.classes { 
    # Meine Absatzvorlagen in den RTE einbinden 
    headline { 
      name = rote Überschrift 
      value = font-family: arial,helvetica,sans-serif; color: #CB2424; font-size: 14px; font: bold; 
    } 
    text_small { 
      name = Kleiner Text 
      value= font-family: arial,helvetica,sans-serif; font-size: 10px; color: #000000; text-align: justify; 
    } 
  } 
}

Und hie hab ich nochmal nen Kostprobe der HTML Seite:

<P class=headline style="MARGIN: 0px"><SPAN 
                  class=text_normal>Terrorbekämpfung, Kostensenkungen im 
                  Gesundheitssystem oder Schutz vor Kreditkarten-Missbrauch - in 
                  allen diesen Bereichen sollen Plastikkarten mit Mikrochips, so 
                  genannte Smartcards, bald zum Einsatz kommen.</SPAN></P>
                  <P style="MARGIN: 0px"><SPAN 
                  class=text_normal></SPAN>&nbsp;</P>
                  <P style="MARGIN: 0px"><SPAN class=text_normal><B>und hier 
                  steht der normale Text:</B> </SPAN></P>
                  <P style="MARGIN: 0px"><SPAN class=text_normal>Über 
                  Forschungsstand und konkrete Anwendungsmöglichkeiten dieser 
                  Technologie informieren Vertreter aus Industrie, Wissenschaft 
                  und Politik beim 14. SIT-SmartCard-Workshop des 
                  Fraunhofer-Instituts für Sichere Telekooperation SIT, der am 
                  3. und 4. Februar 2004 in Darmstadt stattfindet. Weitere 
                  Bestandteiel der Veranstaltung sind eine Ausstellung mit neuen 
                  Produktentwicklungen sowie die Verleihung von Deutschlands 
                  bedeutenstem Smartcard-Preis. Vollständiges Programm und 
                  Anmelde-Unterlagen finden sich im Internet unter 
                  www.sit.fraunhofer.de, die Teilnahme kostet 450 Euro. Für 
                  akkreditierte Journalisten ist der Workshop kostenlos. 
                  </SPAN></P>

Du hast gemeint, dass dann alle SPANs und so nicht mehr verwendet würden, aber bei mir schon! Warum!

mavo schrieb

Du hast gemeint, dass dann alle SPANs und so nicht mehr verwendet würden, aber bei mir schon! Warum!

Wie bindest Du Deine Stylesheets ein? Direkt im HTML-Template?

CU
maxhb

Hi maxhb,

hier der Code aus der Constants des Tempaltes der Seite:

content.wrap.header1 = <p class="horiLine"><img src="fileadmin/Bilder/pfeil_right.gif" width="10" height="10">&nbsp;&nbsp;|<hr size="1" class="horiLine"></p>
styles.content.imgtext.borderColor = black
styles.content.textStyle.altWrap = <span class="text_normal">|</span>

So binde ich das Stylesheet ein, nicht im HTML Template, sondern im Typo3 Template.

Ich denke auch, ob das auf diese Art Probleme macht, wenn ich das vermische. Habe zudem "CSS styled content" als extension drauf!

mfg mavo

hi zusammen

ich habe auch das problem das ich zwar den RTE richtig konfigurieren kann. d.h. er spuckt den richtigen html-code aus (transformations ok) aber im frontend bekomm ich eine umformattierung.

es muss doch möglich sein mit einer ganz einfachen konfiguration zu erzwingen, dass im frontend der exakt selbe HTML-code wie im backend ausgegeben wird. so im sinne von:

renderLikeRTE = 1

ich weiss, dass das thema schon 10000x angesprochen worden ist, aber ich kriegs nicht hin... habe mich halb zu tode gelesen und probiert. bitte bitte bitte helft mir. ich bin nahe daran typo3 hinzuschmeissen...

Guten Abend!

Ich muß dies hier aus dem Kopf schreiben, da ich derzeit nicht im Büro bin: ja, es gibt eine Möglichkeit die durch den RTE vorgenommenen "Transformationen" zu unterbinden.

Dazu schreibe man in die TSConfig-Sektion der Wurzelseite des Web-Auftrittes folgende Zeilen:

RTE.default.proc {
overruleMode=ts_images,ts_links,ts_reglinks
}

Achtung: bitte UNBEDINGT erst in die RTE-Dokumentation schauen, ob ich diese Zeilen richtig geschrieben habe (z.B. im PDF nach "overrule" suchen)

Bei mir funktionieren diese Zeilen wunderbar!

Viel Erfolg!