CODEWITHSUNDEEP
typo3fedext
Markus Bischof
Markus Bischof

Reputation: 189

Enable sliding for page resources with Fluid Powered TYPO3 vhs

Hi everybody out there,

I have configured my page template so that I can create FAL relations. I'm able to read the data of the current page and spit out the image.

But what I really want is that I can slide up - if there is no FAL relation at the current page then I would like to look in the parent page for an image - and the parents parent page if the parent itself have no FAL relation (and so on - until I'm at the root page).

After reading the documentation something like this is possible with content, but I can not find any hints how to do this with page resources.

Hopefully someone can help

Markus

Upvotes: 2

Views: 3336

Answers (3)

user2310852
user2310852

Reputation: 1674

For TYPO3 8.7 you have to use TypoScript, vhs with v:page.resources.fal is not working anymore (issue) - in my case. See example from N1ck above.

I use a Subpage-Sitemap with images from page properties (media/resources).

FLUID:

<f:if condition="{menu}">
    <ul class="ce-menu ce-menu-1">
        <f:for each="{menu}" as="page">
            <li>
                <a href="{page.link}"{f:if(condition: page.target, then: ' target="{page.target}"')} title="{page.title}">
                    <f:format.raw>{page.title}</f:format.raw>
                    <f:cObject typoscriptObjectPath="lib.mediaResources" data="{uid:'{page.data.uid}'}" />
                </a>
            </li>
        </f:for>
    </ul>
</f:if>

TypoScript:

lib.mediaResources = FILES
lib.mediaResources {
    references {
      table = pages
      #Seiten-ID ubergabe
      uid.dataWrap= {field:uid}
      fieldName = media
    }
    renderObj = IMAGE
    renderObj {
      file.width = 50c
      file.height = 50c
      file.import.data = file:current:uid
      file.crop.data = file:current:crop
      file.treatIdAsReference = 1
      altText.data = file:current:title
      params = class="ce-menu-1-image"
      wrap = |
    }
}

Works perfect, without vhs-Extension. A solution with FLUID would be nice.

Upvotes: 1

N1ck
N1ck

Reputation: 321

You can use the vhs viewhelper v:page.resource in combination with the slide argument, wich is supported from vhs version 2.3.3.

{namespace v=FluidTYPO3\Vhs\ViewHelpers}

<v:page.resources.fal table="pages" field="media" uid="{page.uid}" as="images" slide="-1" >
  <f:for each="{images}" as="image">
    <f:image src="{image.url}" alt="{image.alternative} {image.name}" title="{image.title}" />
  </f:for>
</v:page.resources.fal>

Inline-syntax-example for the first element

<v:resource.image identifier="{v:page.resources.fal(field: 'media', uid: '{page.uid}' slide:'-1') -> v:iterator.extract(key: 'id') -> v:iterator.first()}" treatIdAsReference="1" maxWidth="1500"/>

Upvotes: 2

Christian Ducrot
Christian Ducrot

Reputation: 56

It's not possible with a VHS ViewHelper because Resource / Record / FalViewHelper doesn't support content sliding like Content / GetViewHelper does. What you can do:

Write a feature request or make a pull request with your solution.

or

Write your own ViewHelper.

or

Use good old (or bad?) typoscript for it:

lib.slider = FILES
lib.slider {
    references {
        data = levelmedia:-1, slide
    }
    renderObj = COA
    renderObj {
        10 = IMAGE
        10 {
            file.import.data = file:current:publicUrl
            file.width = 960
            titleText.data = file:current:title
            wrap = <li>|</li>
        }
    }
    stdWrap.wrap = <ul>|</ul>
}

and use it in your template like:

<f:cObject typoscriptObjectPath="lib.slider" />

Upvotes: 1

Related Questions