Liebes Forum,
ich möchte auch mal etwas geben und vielleicht die Lösung mit Eurer Hilfe ausbauen und verfeinern.
Oft benötigt man das CE sitemap/menu als Menü mit Bildern aus den Media-Ressourcen der Seiten. Seit fluid_styled_content funktionieren aber die alten TS-Scripte mit tt_content.menu.20.4 nicht mehr. Nun hatte ich folgendes Skript gefunden, dass das Menü in Fluid baut:
https://www.rutschmann.biz/blog/post/typo3-7-lts-fluid-styled-content-spezialmenue-auflistung-der-unterseiten-mit-bild-aus-seiteneigens/ Das funktioniert, solange man nicht den vom Redakteur über das neue Crop-Tool gewählten Ausschnitt verwenden will. Das geht damit nämlich leider nicht. Das liegt daran, dass das resultierende {media} keine Bildobjekte enthält, sondern nur ein Array aus Eigenschaften des Bildes ist. Sonst könnte man prima über <f:media /> das Bild einbinden, wie es das fsc MediaGallery Partial macht.
Ich habe rumprobiert und folgende Lösung gefunden:
FLUID
<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" xmlns:ce="http://typo3.org/ns/TYPO3/CMS/FluidStyledContent/ViewHelpers" data-namespace-typo3-fluid="true">
<ce:menu.directory pageUids="{pageUids}" as="pages">
<f:if condition="{pages}">
<dl class="ce-menu ce-menu-4">
<f:for each="{pages}" as="page">
<dt>
<f:link.page pageUid="{page.uid}">
<f:if condition="{page.nav_title}">
<f:then>
{page.nav_title}
</f:then>
<f:else>
{page.title}
</f:else>
</f:if>
</f:link.page>
</dt>
<dd>
## Hier binde ich die Media Ressource aus der entsprechenden Unterseite ein.
## Über data reiche ich das {page}-array an TS weiter
<f:cObject typoscriptObjectPath="lib.pageimage" data="{page}" />
</dd>
</f:for>
</dl>
</f:if>
</ce:menu.directory>
</html>Im TYPOSCRIPT vom Setup habe ich dann die Möglichkeit, zu entscheiden, ob ich das gecroppte Image haben möchte:
TYPOSCRIPT
pageimage = FILES
pageimage {
references {
table = pages
### Hier übernehme ich das aus Fluid übergebenen {page}-Array und ziehe die Seiten-ID der
### betreffenden Unterseite
uid.dataWrap= {field: uid}
fieldName = media
}
begin = 1 #ACHTUNG: Hier wird das zweite Bild genommen. Ggf anpassen
maxItems = 1
renderObj = IMAGE
renderObj {
file.width = 196m
#file.height = 196c
file.import.data = file:current:uid
## Hier wird der Crop angewendet
file.crop.data = file:current:crop
file.treatIdAsReference = 1
altText.data = file:current:title
wrap = <div class="slide">|</div>
}
}Das funktioniert soweit. Eine Erweiterung hätte ich noch gerne, weiß aber nicht so recht, wie ich das anstellen soll. Ich habe das selbe Bild zwei Mal eingebunden. Einmal mit Crop für den Header und einmal mit Crop für das Bildmenü. Cool wäre es, könnte ich sagen: Wenn ein Bild vorhanden, begin = 0, ansonsten begin = 1. Ich habe Folgendes probiert:
FLUID:
<f:if condition="{page.media} > 1">
<f:then>
<f:cObject typoscriptObjectPath="lib.pageimage" data="{uid:'{page.uid}', position:2}" />
</f:then>
<f:else>
<f:cObject typoscriptObjectPath="lib.pageimage" data="{uid:'{page.uid}', position:1}" />
</f:else>
</f:if>Hier wird über Fluid ermittelt, ob es mehr als ein Bild gibt. Die Position reiche ich an TS weiter. Als Text lässt sie sich auch ausgeben:
pageimage >
pageimage = TEXT
pageimage.dataWrap = {field:position}
aber begin lässt sich davon nicht beeindrucken:
pageimage = FILES
pageimage {
references {
table = pages
uid.dataWrap= {field: uid}
fieldName = media
}
begin.dataWrap = {field:position} ### GEHT NICHT :-(
maxItems = 1
renderObj = IMAGE
renderObj {
file.width = 196m
#file.height = 196c
file.import.data = file:current:uid
file.crop.data = file:current:crop
file.treatIdAsReference = 1
altText.data = file:current:title
wrap = <div class="slide">|</div>
}
}
So. Vielleicht konnte ich ja dem ein oder anderen schon helfen, demnächst ein Bildmenü über das CE Sitemap/Menü zu erstellen. Wenn jemand eine Idee hat, wie ich "begin" dynamisieren kann, freue ich mich.
Viele Grüße