Typo3 Filelist / Dateiliste: Beschreibung statt Dateinamen verlinken

Hat mich schon immer geärgert: Das Inhaltselement „Dateiliste“ in Typo3 ist ziemlich grausig formatiert und eigentlich interessieren mich die Dateinamen der Downloads relativ wenig. Mit folgenden Zeilen im Setup-Script wird dieses Problem gelöst und noch ein paar andere schöne Dinge:

  • Die Download-Dateien werden als HTML-Liste ausgegeben
  • Es werden die Beschreibungen verlinkt statt der Dateinamen
  • Falls keine Beschreibung angegeben wurde gibt es ein Fallback auf den Dateinamen
  • Das UL-Element der Liste bekommt das Layout übergeben, was die Formatierung per CSS vereinfacht
  • Die LI-Elemente werden mit even/odd-Klassen markiert
  • Es wird ein SPAN-Element übergeben, dass die Datei-Erweiterung in der Klasse „filelist-icon-[suffix]“ enthält. Diese Lösung ist gedacht um per CSS ein Hintergrundbild abhängig von dem Datei-Typ einzustellen. SPAN kann ja per CSS auf display: inline-block; gestellt werden und dann mit einer Höhe, Breite und Hintergrundbild gestyled werden.

 

tt_content.uploads {
tt_content.uploads {
20 {
outerWrap = <ul class="filelist layout-{field:layout}">|</ul>
outerWrap.insertData = 1
itemRendering {
 
wrap = <li class="filelist-item odd first">|</li> |*| <li class="filelist-item even">|</li> || <li class="filelist-item odd">|</li> |*|
 
 
10 >
10 = TEXT
10.value = 
10.dataWrap = <span class="filelist-icon filelist-icon-{register:fileExtension}">|</span>
 
20 {
wrap = <span class="filelist-name">|</span>
 
1 >
2 >
 
2 = TEXT
2.data = register:description
2.data.override = register:filename
2.data.override.if.isFalse.data = register:description
2.dataWrap = <a href="{register:path}{register:filename}" target="{field:target}">|</a>
 
}
 
30.wrap = <span class="filelist-size">(|)</span><span class="clear_div"></span>
}
}
}

Vielen Dank an Chris Wolfram und seinen Blog-Beitrag auf dieser Seite, der mir den entscheidenden Hinweis gegeben hat.

Für Suchmaschinen: Typo3 Dateiliste als HTML-Liste ausgeben. Filelist Beschreibung verlinken statt Dateinamen. Typo3 Filelist eigene Icons für Dateitypen. Typo3 Dateiliste formatieren. Filelist Dateigröße verstecken. Dateiliste Icon verstecken. Typo3 Dateiliste mit abwechselnder Zeilenfarbe.

Nachtrag: TS für css_styles_content 4.7

 
tt_content.uploads {
20 {
outerWrap = <ul class="filelist layout-{field:layout}">|</ul>
outerWrap.insertData = 1
 
 
itemRendering {
 
# css_styled_content 4.7
wrap.cObject {
10.oddEvenClass = odd first |*| even || odd
10.elementClass = filelist-filetype-{register:fileExtension}
20.value = <li class="filelist-item {register:oddEvenClass} {register:elementClass}">|</li>
}			
 
10 >
10 = TEXT
10.value = 
10.dataWrap = <span class="filelist-icon filelist-icon-{register:fileExtension}">|</span>
 
 
20 = COA
20 {
wrap = <span class="filelist-name">|</span>
 
2 = TEXT
2.data = register:description
2.data.override = register:filename
2.data.override.if.isFalse.data = register:description
2.dataWrap = <a href="{register:path}{register:filename}" target="{field:target}">|</a>
 
}
 
30.wrap = <span class="filelist-size">(|)</span><span class="clear_div"></span>
}
}
}