Eigene Klassen definieren

RTE Styles

CSS Datei mit Style-Definitionen erstellen.

@charset "UTF-8";

/** RTE ***************************************************************/
span.green {color: #006666;}
span.blue {color: #003366;}
ACHTUNG: Die Angabe eines Typs ist zwingend. Für die Anwendung auf alle Elemente muss span angegeben werden. Wird ein Block-Element (p, h1, …) definiert, ist die Klasse anschliessend nur über den Block-Stil zuweisbar!

Einträge der DropDown-Liste definieren

Über das TypoScript-Setup der Rootseite können die Einträge der Textstilliste definiert werden.

# RTE setup
# RTE setup
RTE {
  # basics
  default {
    # set CSS file with classes
    contentCSS = fileadmin/templates/css/rte.css
    useCSS = 1

    # remove default classes
    classesCharacter := removeFromList(csc-frame-frame1, csc-frame-frame2, important, name-of-person, detail)
    classesParagraph := removeFromList(csc-frame-frame1,csc-frame-frame2)

    # define new classes
    classesCharacter := addToList(green,blue)
    classesParagraph := addToList(lead)
  }

  # set new classes
  classes {
    green {
      name = green
      value = color:#006666;
    }
    blue {
      name = blue
      value = color:#003366;
    }
    lead {
      name = Lead
      value = font-size: 18px;
    }
  }

  # allow new classes to be saved
  default.proc {
    allowedClasses := addToList(green,blue,lead)
  }
}

 

RTE Funktionen definieren

Diese können über das TS einer eigene Benutzergruppe definiert werden und gelten so global für die ganze Website.

options.RTEkeyList = textstylelabel,textstyle,formatblock, bold, italic, orderedlist, unorderedlist, link, copy, cut, paste, undo, redo, chMode, removeformat

 

Layouttypen definieren

Per Typoscript können neue bzw. andere Layouttypen für Inhaltselemente definiert werden. Die Liste der verfügbaren Layouts wird über die TypoScript Konfiguration der Rootseite definiert.

# content of layout selection
TCEFORM.tt_content {
  layout{
    altLabels{
      0 = Normal
      1 = Teaser (Text)
      2 = Teaser (Image)
    }
    removeItems = 3,4,5,6,7,8,9,10
  }
}

Über das Seitentemplate kann per Typoscript die Ausgabe einer spezifischen Klasse gesteuert werden.

# append layout class
tt_content.stdWrap.innerWrap.cObject = CASE
tt_content.stdWrap.innerWrap.cObject {
  key.field = layout
  1.15 = TEXT
  1.15.value = csc-default text-teaser

  2 < .1
  2.15.value = csc-default image-teaser
}
ACHTUNG: Anschliessend werden keine Frame-Klassen mehr ausgegeben!

Hinterlasse eine Antwort

Deine E-Mail-Adresse wird nicht veröffentlicht.