Recht praktisch und für den Redakteur leicht zu bedienen ist der TYPO3 Inhaltsdatensatz „Dateiverweise“ zur Darstellung von Downloads. Defaultmäßig wird hier eine Tabelle ausgegeben. Per Objectbrowser kann man bequem auf die einzelnen tr und td Elemente zugreifen (tt_content.uploads.20.itemRendering.wrap)
, aber nicht auf das table Tag. Dies könnte wünschenswert sein, wenn man beispielsweise eine Zeile mit Tabellenüberschriften, th, zusätzlich zur Verfügung stellen will.
Die Lösung bringe ein Blick in die Datei pi1/class.tx_cssstyledcontent_pi1.php von css_styled_content (das ja wohl eingebunden sein dürfte ;-)), in die Zeile 370 ff
(if (isset($conf['outerWrap'])) {...}).
„outerWrap“ machts also möglich. Im Folgenden das TypoScript für eine hübsche Tabelle, die spaltenweise und mit den entsprechenden Überschriften – mehrsprachig – Format, Dateiname, Dateigröße und ein Link zum Downloaden erstellt. Das Dateiformat wird übrigens per jQuery durch eine Grafik ersetzt.
tt_content.uploads.20.outerWrap = <table class="uploads"><tr><th class="format">{$const.lang.format}</th><th>{$const.lang.title}</th><th>{$const.lang.size}</th><th>{$const.lang.download}</th></tr>|</table> tt_content.uploads.20.itemRendering{ 10.if > 10.data = register:fileExtension 20.1 > 20.2 > 20 = TEXT 20.data = register:filename 30.if > 40 = COA 40.10 = TEXT 40.10.data = register:path 40.20 = TEXT 40.20.data = register:filename 40.wrap = <td class="csc-uploads-load"><a href="!">{$const.lang.load}</a></td> } |
Korrekterweise muss die letzte Zeile so aussehen:
40.wrap = <td class="csc-uploads-load"><a href="|">{$const.lang.load}</a></td>
Das jQuery für die Grafiken:
$('.csc-uploads-icon').each( function (i){ if ($(this).html() == 'pdf'){ $(this).html('<img src="fileadmin/layout/uploads_pdf.gif" alt="" />'); } if ($(this).html() == 'doc'){ $(this).html('<img src="fileadmin/layout/uploads_doc.gif" alt="" />'); } if ($(this).html() == 'swf'){ $(this).html('<img src="fileadmin/layout/uploads_swf.gif" alt="" />'); } if ($(this).html() == 'wmv'){ $(this).html('<img src="fileadmin/layout/uploads_wmv.gif" alt="" />'); } }) }); |