TypoScript: TS Setup 05 PageConfig BOOTSTRAP Rootseite

tst_05_pageconfig_BOOTSTRAP.ts

# Wahlmöglichkeit der verschiedenen Layouts
TCEFORM.pages.layout {
  addItems {
  }
  altLabels {
    0 = Layout: 3 Spalten
    1 = Layout: 2 Spalte
  }
}
# Ausblenden der nicht benötigten Layouts (in serparater Zeile!)
TCEFORM.pages.layout.removeItems = 2,3

# Zusätzliche Elemente für die section_frame (Erscheinungsbild - Standardframe)
# Wird noch in der tst_PAGE.ts definiert
TCEFORM.tt_content.section_frame {
  addItems.31 = 11 Spalten
  addItems.32 = 10 Spalten
  addItems.33 =  9 Spalten
  addItems.34 =  8 Spalten
  addItems.35 =  7 Spalten
  addItems.36 =  6 Spalten
  addItems.37 =  5 Spalten
  addItems.38 =  4 Spalten
  addItems.39 =  3 Spalten
  addItems.40 =  2 Spalten
  addItems.41 =  1 Spalten
 }
# Ausblenden der nicht benötigten Rahmen
TCEFORM.tt_content.section_frame.removeItems = 1,5,6,10,11,12,20,21

# Anpassungen Dateiupload (Ausblenden von Spalten/Bennen der Default-Spalte)
TCEFORM.tt_content.layout.types.uploads.removeItems = 0,2,3
TCEFORM.tt_content.layout.types.uploads.altLabels.1 = Download mit Icon

# Spezielle Frames, welche die Bilder wrappen.
# Ebenfalls im Page-Setup noch weiter ausführen
# TCEFORM.tt_content.image_frames.disabled = 0
# TCEFORM.tt_content.image_frames.removeItems = 1,2,3,4,5,6,7,8
# TCEFORM.tt_content.image_frames.addItems.10 = runde Ecken

# Auslbenden der nicht gebrauchten Spalten:
mod.SHARED.colPos_list=0,2

# Falls auf einer speziellen Seite andere Spalten eingeblendet werden müssen,
# kann dies mit einer globalVar auf das Layout (siehe oben) gemacht werden:
# [globalVar = SOBE|pageinfo|layout=2 ]
#   mod.SHARED.colPos_list = 0,2,3
# [global]

###############################################################################
# RTE-Konfiguration
###############################################################################

###############################################################################
# RTE Classes
# Diese definieren die Ausklappmenüs im RTE!
# Wegen Bug im Safari müssen alle Klassen klein definiert werden!
###############################################################################

RTE.classes {
# Die Klassenbezeichungen müssen an 3 Orten hinzugefügt werden:
# proc.allowedClasses / tags.p.fixAttrib.class.list / tags.td.fixAttrib.class.list / classesParagraph
   align-left {
     name = 1 Linksbündiger Text 
     value = 
   }
   align-right {
     name = 2 Rechtsbündiger Text
     value = 
   }
   align-center {
     name = 3 Zentrierter Text
     value = 
   }
  align-justify {
    name = 3 Blocksatz
    value =
  }
   csc-frame-indent {
     name = 4 Einzug
     value =  
   }
   csc-frame-frame1 {
     name = 5 Rahmen Einfach
     value = 
   }
   zitatbox {
   name = 6 Rahmen Farbig/Kursiv
   value =   
   }         
   kleinertext {
     name = 7 Textblock: kleine Schrift
     value = 
   }
   grossertext {
     name = 8 Textblock: grosse Schrift
     value = 
   }
    
     
# Tabellenstile, kann in Tabelleneigenschaften ausgewaehlt werden
# proc.allowedClasses / tags.table.fixAttrib.class.list / classesTable / RTE.default.buttons.blockstyle.tags
     
   contenttable {
     name = Zebra-Layout
     value =
     # Mit der alternating-Funktion werden der TR die beiden Klassen zugewiesen, um Zebratabellen zu erstellen
     alternating {
      rows {
      startAt = 1
      oddClass = tr-odd
      evenClass = tr-even
      oddHeaderClass = thead-odd
      evenHeaderClass = thead-even
      }
      counting {
        rows {
          startAt = 1
          rowClass = tr-count-
          rowLastClass = tr-last
          rowHeaderClass = thead-count-
          rowHeaderLastClass = thead-last
        }
      }
     } 
   }
   contenttable2 {
     name = Mit Linien
     value =
     alternating {
      rows {
      startAt = 1
      oddClass = tr-odd
      evenClass = tr-even
      oddHeaderClass = thead-odd
      evenHeaderClass = thead-even
      }
      counting {
        rows {
          startAt = 1
          rowClass = tr-count-
          rowLastClass = tr-last
          rowHeaderClass = thead-count-
          rowHeaderLastClass = thead-last
        }
      }
     }
   }
     
   layout {
     name = unsichtbare Layouttabelle
     value =
     alternating {
      rows {
      startAt = 1
      oddClass = tr-odd
      evenClass = tr-even
      oddHeaderClass = thead-odd
      evenHeaderClass = thead-even
      }
      counting {
        rows {
          startAt = 1
          rowClass = tr-count-
          rowLastClass = tr-last
          rowHeaderClass = thead-count-
          rowHeaderLastClass = thead-last
        }
      }
     }
   }
     
# Textauszeichnungen fuer Texte nicht fuer Absaetze
# proc.allowedClasses / tags.span.fixAttrib.class.list / classesCharacter
  
  bold_black {
    name = 1 Schrift Fett
    value = font-weight: bold;
   }
    italic_black {
    name = 2 Schrift Kursiv
    value = font-style: italic;
   }
}

# Zusätzliche Link-Klasse, damit kein Icon angezeigt wird.
# Die class ist immer die gleiche, die Namen müssen aber verschieden sein.
# Nicht vergessen, dass ohneicon unten bei allowedClasses usw. eingetragen werden muss.

RTE.classesAnchor {

  intern_ohneicon {
    class = ohneicon
    type = page
    image >
  }
  extern_ohneicon {
    class = ohneicon
    type = url
    image >
  }
  download_ohneicon {
    class = ohneicon
    type = file
    image >
  }
  mail_ohneicon {
    class = ohneicon
    type = mail
    image >
  }

}


###############################################################################
# RTE DEFAULT
###############################################################################

RTE.default {

  #defaultLinkTarget = 
  
# Steuerung der Buttons, zuerst werden alle eingeblendet, danach einzeln ausgeblendet
# underline, textcolor, justifyfull, sind eingeblendt, um eigene Farben zu wählen, diese sind unter Color definiert 
  showButtons = *
  hideButtons ( 
    lefttoright, righttoleft, formattext, bidioverride, big,
    citation, definition, insertedtext, italic, keyboard, code,
    deletedtext, quotation, subscript, 
    monospaced, sample, small, span, strikethrough, 
    variable, user, bold, fontstyle, fontsize, 
    blockquote, insertparagraphbefore, insertparagraphafter,
    spellcheck, inserttag, copy, cut, paste,
    bgcolor, emoticon, blockquote
  )
  
# selten genutzte Tags in der Absatzpalette verbergen
  hidePStyleItems = pre,address,h5,h6,div
  
# CSS-Datei für den RTE - einfach die Haupt-CSS-Datei übernehmen (include der rte-css nicht vergessen)
  contentCSS=fileadmin/template/css/bootstrap.css

# Unerwünschte Formatierung auf Word löschen
  enableWordClean = 1
# Entfernt <br>, wenn es am Anfang des Absatzes steht
  removeTrailingBR = 0
# Entfernt HTML-Komentare aus dem Quelltext
  removeComments = 1
# Folgende Tags werden entfernt, wenn man vom RTE in den Quelltext umchaltet    
  removeTags = blockquote
# Damit auch die Formatierung nicht Punkt geht, also z.B. .fett_gruen
  showTagFreeClasses = 0
# Damit nur die Klassen aus dem eigenen CSS übernommen wird
  ignoreMainStyleOverride = 1
# Um die Statuszeile anzuzeigen
  showStatusBar = 1 
# Löscht die Magic Image Option raus
  blindImageOptions = magic
#### TABELLENKONFIGURATIONEN ####
# Beim erstellen von Tabels die Ränder zeigen 
  buttons.toggleborders.setOnTableCreation = 1
  buttons.toggleborders.keepInToolbar = 1
# Zeigt im FireFox Rahmenanfasser 
  buttons.table.enableHandles = 1
# Blendet die Beschreibung aus
  buttons.table.removeFieldsets = description
  buttons.tableproperties.removeFieldsets = description
# Standardzeilen 4  
  buttons.table.properties.numberOfRows.defaultValue = 4
# Standardspalten 2
  buttons.table.properties.numberOfColumns.defaultValue = 2
# Standard für Kopfzeile -> oben
  buttons.table.properties.headers.defaultValue = top
# Löschen der Kopfzeile links
  buttons.table.properties.headers.removeItems = left, both
# Standardbreite für die Tabelle
# buttons.table.properties.width.defaultValue = 100
# Standardmass für Tabelle = %
  buttons.table.properties.widthUnit.defaultValue = %
  buttons.table.properties.heightUnit.defaultValue = %
  buttons.rowproperties.properties.widthUnit.defaultValue = %
  buttons.rowproperties.properties.heightUnit.defaultValue = %
  buttons.cellproperties.properties.widthUnit.defaultValue = %
  buttons.cellproperties.properties.heightUnit.defaultValue = %    
# Entfernen von anderen Masseinheiten
  buttons.table.properties.widthUnit.removeItems = em
  buttons.table.properties.heightUnit.removeItems = em
  buttons.rowproperties.properties.widthUnit.removeItems = em
  buttons.rowproperties.properties.heightUnit.removeItems = em
  buttons.cellproperties.properties.widthUnit.removeItems = em
  buttons.cellproperties.properties.heightUnit.removeItems = em
  
###############################################################################
# PROC
###############################################################################

  proc {   
    # Die Klassen müssen drin sein, sonst werden die Klassen nicht im RTE gezeigt. 
    allowedClasses (
      align-left,align-center,align-right, align-justify,
      csc-frame-indent,csc-frame-frame1,
      zitatbox, kleinertext, grossertext, 
      contenttable,contenttable2, layout,
      external-link, external-link-new-window, internal-link, internal-link-new-window, download, mail, ohneicon
      component-items, action-items,
      component-items-ordered, action-items-ordered,
      bold_black, italic_black
      )
      
    # Damit BR-Tags nicht durch p-Tags ersetzt werden
    dontConvBRtoParagraph = 1
    removeTrailingBR = 0      
    
    # hier werden die erlaubten Attribute der Tags geregelt. 
    
    entryHTMLparser_db = 1
    entryHTMLparser_db {
    
         
    tags {
    # Definition, welche Klassen und sonstige Attribute erlaubt sind 
    p {
      # erlaubte Attribute  , fixAttrib wird auskommentiert
      allowedAttribs = id, title, dir, lang, xml:lang, class
      # align und style-Attribute werden entfernt
      # fixAttrib.align.unset = 1
      # fixAttrib.style.unset = 1
      # erlaubte Klassen, alle anderen werden entfernt
      # ACHTUNG: das erste Komma ist wichtig. 
      fixAttrib.class.list (
      , csc-frame-indent,csc-frame-frame1, align-left, align-right, align-center, align-justify, kleinertext, grossertext, zitatbox
      )
      fixAttrib.class.removeIfFalse = 1
    }
      div < .p
      h1  < .p
      h2  < .p
      h3  < .p
      h4  < .p
      h5  < .p
      h6  < .p
      ul < .p
      ol < .p
      li < .p
      dfn < .p
      pre < .p
      # blockquote < .p

      # Einstellungen für die Tabelle
      preserveTables = 1
        
      table {
      # Eintrag mit style, align, colspan, rowspan erweitert
      # Und bei allen Einträgen wird das fixAttrib auskommentiert, damit die eigene Stile möglich sind
      allowedAttribs = id, title, dir, lang, xml:lang, class, style, align, colspan, rowspan, cellspacing
      # fixAttrib.align.unset = 1
      # fixAttrib.style.unset = 1
      fixAttrib.class.list (
      , contenttable,contenttable2, layout
      )
      fixAttrib.class.removeIfFalse = 1
      # Die Zellspacing ist mit 0 angegeben, dass keine Zwischenräume da sind
      fixAttrib.cellspacing.set = 0 
      }
      td {
      # Hier muss ebenfalls noch: style, align, colspan, rowspan bei allowed Attribs eingefügt werden!
      allowedAttribs = id, title, dir, lang, xml:lang, class, style, align, colspan, rowspan
      # fixAttrib.align.unset = 1
      # fixAttrib.style.unset = 1
      fixAttrib.class.list (
      , align-left, align-right, align-center, align-justify,
      )
      fixAttrib.class.removeIfFalse = 1
      }
      th < .td
      hr < .td
      
      span {
      allowedAttribs = id, title, dir, lang, xml:lang, class, style
      # fixAttrib.align.unset = 1
      # fixAttrib.style.unset = 1
      fixAttrib.class.list (
      , bold_black, italic_black,
      )
      fixAttrib.class.removeIfFalse = 1
      }

      a {
      allowedAttribs = id, title, dir, lang, xml:lang, class, href, name, target
      # fixAttrib.align.unset = 1
      # fixAttrib.style.unset = 1
      fixAttrib.class.list (
      , external-link, external-link-new-window, internal-link, internal-link-new-window, mail, download, ohneicon
      )
      fixAttrib.class.removeIfFalse = 1
      }

      b.remap = strong
      i.remap = em
      }
      
      # aus hygienischen Gründen werden Tags ohne Attribute entfernt
      rmTagIfNoAttrib = span,div,a
    }
    # END OF entryHTMLparser_db     
  }
  # END OF PROC

  # nur Klassen mit Tags erlauben/verbieten. z. B. : p.klasse 
  showTagFreeClasses=0

  # hier wird definiert, welche Klassen den Redakteuren zur 
  # Verfügung gestellt werden: die vorhandenen Klassen für die 
  # Zeichenformatierung werden hier ausgeschaltet:

  #classesParagraph (
  buttons.blockstyle.tags.div.allowedClasses (
    csc-frame-indent,csc-frame-frame1, align-left, align-right, align-center, align-justify, kleinertext, grossertext, zitatbox
    )
   
  #classesCharacter (
  buttons.textstyle.tags.span.allowedClasses (
    bold_black, italic_black, color1, color2, color3, color4, color5
    )
    
  # Klassendefinition für die gesamte Tabelle
  #classesTable = contenttable,contenttable2, layout
  buttons.blockstyle.tags.table.allowedClasses = contenttable,contenttable2, layout

  # Klassendefinition für die einzelnen Zellen
  # das kann für tr, thead, tbody ebenfalls gemacht werden
  # classesTD = rot1, hellgrau1, dunkelgrau1
  # fehlen noch. 
  
  # Klassen für die Links
  classesLinks = external-link, external-link-new-window, internal-link, internal-link-new-window, download, mail, ohneicon

  classesAnchor = external-link, external-link-new-window, internal-link, internal-link-new-window, download, mail, ohneicon
    classesAnchor.default {
    page = internal-link
    url = external-link-new-window
    file = download
    mail = mail
  }
  # Tabellen Editierungs-Optionen (cellspacing/ cellpadding / border)
  ## Wenn alle auf 0 sind, werden alle Optionen angezeigt!
  disableSpacingFieldsetInTableOperations = 1
  disableAlignmentFieldsetInTableOperations = 0
  disableColorFieldsetInTableOperations = 1
  disableLayoutFieldsetInTableOperations = 0
  disableBordersFieldsetInTableOperations = 1
}
# END OF RTE.default

RTE.default.buttons.blockstyle.tags {
  table.allowedClasses = tb-zebra-rows, tb-zebra-cols, contenttable,contenttable2, layout
  tr.allowedClasses = tr-odd, tr-even, header-odd, header-even     
  td.allowedClasses = td-odd, td-even
  th.allowedClasses = header-odd, header-even, th-odd, th-even
}

RTE.mutuallyExclusiveClasses {
  10 = tr-odd,tr-even,header-odd,header-even
  20 = td-odd,td-even
  30 = th-odd,th-even
  40 = tb-zebra-cols, tb-zebra-rows
}

RTE.default.proc.allowedClasses := addToList(tb-zebra-rows, tb-zebra-cols,tr-odd, tr-even, header-odd, header-even, td-odd, td-even, header-odd, header-even, th-odd, th-even, thead)


# Mit dem folgenden Abschnitt ist es möglich, unmittelbar beim Einkopieren aus 
# der Zwischenablage den Code bereinigen zu lassen, also bereits vor dem Speichern; 
# Leider ist es in den Voreinstellungen praktisch unkonfiguriert, deshalb muss man hier 
# viel selbst erledigen. Man kann den HTMLParser der WordClean-Funktion bis ins Detail 
# konfigurieren. 
# Diese Konfiguration unterscheidet sich von RTE.default.proc !
# Es wird hier viel mehr entfernt - über die Zwischenablage können keine korrekten Klassen 
# kommen, deshalb werden alle entfernt. 

RTE.default.enableWordClean.HTMLparser {
  allowTags (
    a, abbr, acronym, address, b, bdo, big, br, caption, center, cite, code, col, 
    colgroup, del, dfn, div, em, h1, h2, h3, h4, h5, h6, hr, i, img, ins, kbd, li, link, 
    ol, p, pre, q, samp, sdfield, small, strike, strong, sub, sup, table, thead, tbody, tfoot, 
    td, th, tr, tt, u, ul, var, span, style
    #blockquote,
    )
  tags {
    p {
      allowedAttribs = id, title, dir, lang, xml:lang, class, style
        #fixAttrib.align.unset = 1
        #fixAttrib.style.unset = 1      
       }
    div < .p
    h1  < .p
    h2  < .p
    h3  < .p
    h4  < .p
    h5  < .p
    h6  < .p
    table < .p
    thead < .p
    tbody < .p
    tfoot < .p
    th < .p
    tr < .p
    td < .p
    caption < .p
    span < .p
    ul < .p
    ol < .p
    li < .p
    dfn < .p
    hr < .p
    strong < .p
    em < .p
    del < .p
    q < .p
    code < .p
    #blockquote < .p
    b < .p
    i < .p
    sub < .p
    sup < .p
    hr  < .p
    pre < .p
    a  {
      # entfernt die Anker aus Word-Dokumenten 
      # und die Style-Attribute, die Safari sonst in die Links schreibt. 
      allowedAttribs = id, title, dir, lang, xml:lang, class, href, style, target
        fixAttrib.style.unset = 1
    }
  }
  # das a ist neu hier, für die Anker aus Word
  rmTagIfNoAttrib = span,div,a
  removeTags = center, font, o:p, sdfield, strike, u
  # das brauchts, weil Safari sonst sogar auf br das style-Atribut setzt
  noAttrib = br
}

RTE.default.disableColorPicker = 1
RTE.default.disableSelectColor = 0
RTE.colors {
  color1 {
    name = Blau
    value = #0f76ba
  }
  color2 {
    name = Grün
    value = #579928
  }
  color3 {
    name = Orange
    value = #cc8013
  }
  color4 {
    name = Violett
    value = #5c006f
  }
  color5 {
    name = Magenta
    value = #bb4188
  }
}
RTE.default.colors = color1, color2, color3, color4, color5,