Typo3 - Familie Schweizer Soares

Rootline-Menu an Extensions anpassen

Wenn man mit Extensions arbeitet, möchte man nicht unbedingt 'News-Detail' im Rootline-Menu angezeigt bekommen, sondern den Titel der News, bei der man sich gerade befindet.

Dies kann man wie folgt erledigen:

lib.rootline = COA
lib.rootline.10 = HMENU
lib.rootline.10 {
special = rootline
special.range = 0|-1
1 = TMENU
1.target = _top
1.NO {
allWrap = Du bist hier: |   >   |*| |   >   |*| |
}
1.CUR = 1
1.CUR.doNotLinkIt = 1
1.CUR.wrap = |
}

Bis hier handelt es sich um ein 'normales' Rootline-Menu, was in ein COA eingesetzt wird.

[globalVar = GP:tx_ttnews|tt_news > 0]
lib.rootline.10.special.range = 0|-2
lib.rootline.20 = RECORDS
lib.rootline.20 {
dontCheckPid = 1
tables = tt_news
source.data = GPvar:tx_ttnews|tt_news
conf.tt_news = TEXT
conf.tt_news.field = title
wrap =   >   |
}
[end]

Dieser Codeblock bewirkt zuerst, dass das Rootline-Menu den letzten Eintrag nicht anzeigt (range=0|-2) und setzt dann stattdessen ein RECORDS-Element ein. Möchte man mehrere Extensions auf diese Weise nutzen, kann man einfach die IF-Blöcke untereinandersetzen.

Zu beachten ist hierbei, dass Variablen, die [ ] enthalten, anders benannt werden müssen.

Beispiel:

Die Variable tx_myext_pi1[uid] muss in der Bedingung als tx_myext_pi1|uid geschrieben werden.

Anzeige der Seiten UID im Seitenbaum

In das TSConfig der Usergruppe/des Users:

options.pageTree.showPageIdWithTitle = 1

Klasse und ID an Unterseiten

Wenn man an Unterseiten bestimmte CSS-Klassen oder IDs vergeben will, kann man das über die Typoscript-Condition treeLevel tun. Im folgenden Beispiel wird an alle Seiten auf Ebene 2 des Seitenbaumes die id der Seite als CSS-ID vergeben und die id der übergeordneten Seite alls CSS-Klasse.

[tree.level == 2]
page.bodyTagCObject = TEXT
page.bodyTagCObject.dataWrap = <body id="uid{field:uid}" class="pid{field:pid}">
[global]

Datum der letzten Seitenänderung anzeigen

lib.lastchange = TEXT
lib.lastchange {
  data = register : SYS_LASTCHANGED
  if.isTrue.data = register : SYS_LASTCHANGED
  strftime = %e. %B %Y, %H:%M
  wrap = Letzte Änderung der Seite: |
}

Eigene CSS-Klassen für Tabellen im RTE

Um einer Tabelle im CKEditor eigene CSS-Klassen mitzugeben, sind mehrere Schritte notwendig. Denn standardmäßig erhalten alle Tabellen die Klasse "contenttable".

1. Eine CKEditor-Konfig anlegen

Im ersten Schritt muss eine eigene Yaml-Datei für den CKEditor angelegt werden, z.B. in einer eigenen Extension/einem Sitepackage. Außerdem muss diese auch per TSconfig aktiviert werden.

Beispiel einer solchen Datei:

Wichtig ist die Zeile im Bereich stylesSet:

- { name: "Bootstrap Table", element: "table", attributes: { class: "table"}}

Hier wird eine Bezeichung für das Styles-Auswahlfeld definiert, sowie die Klasse, die an das table-Element angefügt werden soll.

# Load default processing options
imports:
    - { resource: "EXT:rte_ckeditor/Configuration/RTE/Processing.yaml" }
    - { resource: "EXT:rte_ckeditor/Configuration/RTE/Editor/Base.yaml" }
    - { resource: "EXT:rte_ckeditor/Configuration/RTE/Editor/Plugins.yaml" }

# Add configuration for the editor
# For complete documentation see docs.ckeditor.com
editor:
  config:
    contentsCss: "EXT:vt9/Resources/Public/Css/rte.css"
    stylesSet:
      - { name: "Bootstrap Table", element: "table", attributes: { class: "table"}}
      - { name: "Button Primary", element: "a", attributes: { class: "btn btn-primary"}}
      - { name: "Button Secondary", element: "a", attributes: { class: "btn btn-secondary"}}
      - { name: "Button Success", element: "a", attributes: { class: "btn btn-success"}}
      - { name: "Button Info", element: "a", attributes: { class: "btn btn-info"}}
      - { name: "Button Warning", element: "a", attributes: { class: "btn btn-warning"}}
      - { name: "Button Danger", element: "a", attributes: { class: "btn btn-danger"}}
      - { name: "Alert Primary", element: ['p', 'h1', 'h2', 'h3', 'h4', 'h5'], attributes: { class: "alert alert-primary"}}
      - { name: "Alert Secondary", element: ['p', 'h1', 'h2', 'h3', 'h4', 'h5'], attributes: { class: "alert alert-secondary"}}
      - { name: "Alert Success", element: ['p', 'h1', 'h2', 'h3', 'h4', 'h5'], attributes: { class: "alert alert-success"}}
      - { name: "Alert Info", element: ['p', 'h1', 'h2', 'h3', 'h4', 'h5'], attributes: { class: "alert alert-info"}}
      - { name: "Alert Warning", element: ['p', 'h1', 'h2', 'h3', 'h4', 'h5'], attributes: { class: "alert alert-warning"}}
      - { name: "Alert Danger", element: ['p', 'h1', 'h2', 'h3', 'h4', 'h5'], attributes: { class: "alert alert-danger"}}

    format_tags: "p;h1;h2;h3;h4;h5;pre"

    toolbarGroups:
      - { name: 'document', groups: [ 'mode', 'document', 'doctools' ] }
      - { name: 'clipboard', groups: [ 'clipboard', 'undo' ] }
      - { name: 'editing', groups: [ 'find', 'selection', 'spellchecker', 'editing' ] }
      - { name: 'forms', groups: [ 'forms' ] }
      - { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] }
      - { name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align', 'bidi', 'paragraph' ] }
      - { name: 'links', groups: [ 'links' ] }
      - { name: 'insert', groups: [ 'insert' ] }
      - { name: 'styles', groups: [ 'styles' ] }
      - { name: 'colors', groups: [ 'colors' ] }
      - { name: 'tools', groups: [ 'tools' ] }
      - { name: 'others', groups: [ 'others' ] }
      - { name: 'about', groups: [ 'about' ] }

    justifyClasses:
      - text-left
      - text-center
      - text-right
      - text-justify

    extraPlugins:
      - justify
      - autolink

    removePlugins:
      - image

    removeButtons:
      - Save
      - NewPage
      - Preview
      - Print
      - Templates
      - Find
      - SelectAll
      - Scayt
      - Form
      - Radio
      - Checkbox
      - TextField
      - Textarea
      - Select
      - Button
      - ImageButton
      - HiddenField
      - Underline
      - CopyFormatting
      - CreateDiv
      - Blockquote
      - Indent
      - Outdent
      - JustifyBlock
      - Language
      - Anchor
      - Image
      - Flash
      - HorizontalRule
      - Smiley
      - PageBreak
      - Iframe
      - Font
      - FontSize
      - TextColor
      - BGColor
      - ShowBlocks
      - About

Das ist aber noch nicht alles. Denn jetzt wird zwar die Klasse im Backend angefügt und bleibt auch beim Speichern erhalten, im Frontend kommt sie jedoch noch nicht an. Deshalb:

2. TypoScript anpassen

Folgende Zeile muss in das TypoScript-Setup, um die Ausgabe der Standardklasse zu deaktivieren und statt dessen unsere eigene Klasse anzuzeigen:

lib.parseFunc_RTE.externalBlocks.table.stdWrap.HTMLparser.tags.table.fixAttrib.class.list >