TYPO3 10.4: Menu of subpages with image

Question

I would like to expand the content element "menu of subpages" with images from page resources.

In TYPO3 8.7 the following code did everything i needed:

<f:if condition="{menu}">
    <ul class="pagemenu-img">
        <f:for each="{menu}" as="page">
            <li>
                <a href="{page.link}"{f:if(condition: page.target, then: ' target="{page.target}"')} title="{page.title}">
                    <f:image src="fileadmin/{page.files.0.originalFile.identifier}" />
                    <span>{page.title}</span>
                </a>
            </li>
        </f:for>
    </ul>
</f:if>

With TYPO3 10.4 this isn't working anymore.
Is there another way? Preferably without using VHS.

Answer 1

It's still working.

I have tested your HTML-Template and the result is as expected:

Your problems seem to be something other...

Answer 2

Maybe there were some pages which didn't have any images with them...

You should therefore check if there is an image present: [and get rid of the hardcoded fileadmin/ link there by< just using {page.files.0.originalFile}]

<f:if condition="{menu}">
    <ul class="pagemenu-img">
        <f:for each="{menu}" as="page">
            <li>
                <a href="{page.link}"{f:if(condition: page.target, then: ' target="{page.target}"')} title="{page.title}">

                    <f:if condition="{page.files.0}">
                        <f:image image="{page.files.0.originalFile}" />
                    </f:if>

                    <span>{page.title}</span>
                </a>
            </li>
        </f:for>
    </ul>
</f:if>