Code example
This Gallery FCE is a example how to use FAL images in Flux Content Elements.
- Description
- Gallery FCE as example how to use fal images in Flux Content Elements
- Author
- benjaminrau
- Creation date
- Extensions
- FluidTYPO3.Fluidcontent FluidTYPO3.Vhs
- Tags
- Content ViewHelpers
- Files
- Gallery.html
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div xmlns:flux="http://typo3.org/ns/FluidTYPO3/Flux/ViewHelpers" | |
| xmlns:v="http://typo3.org/ns/FluidTYPO3/Vhs/ViewHelpers" | |
| xmlns:f="http://typo3.org/ns/fluid/ViewHelpers"> | |
| <f:layout name="Content" /> | |
| <f:section name="Configuration"> | |
| <flux:form id="gallery" wizardTab="MG"> | |
| <flux:field.inline.fal name="settings.images" multiple="TRUE" maxItems="20" /> | |
| </flux:form> | |
| </f:section> | |
| <f:section name="Preview"> | |
| <b><f:translate key="flux.gallery" /></b> | |
| </f:section> | |
| <f:section name="Resources"> | |
| </f:section> | |
| <f:section name="Item"> | |
| <li><a href="{image.url}" title="{f:if(condition: image.description, then: '{image.title}: ', else: '{image.title}')}{image.description}" rel="gallery"><f:image treatIdAsReference="TRUE" src="{image.id}" alt="{image.title}" title="{f:if(condition: image.description, then: '{image.title}: ', else: '{image.title}')}{image.description}" width="170c" height="170c" /></a></li> | |
| </f:section> | |
| <f:section name="Main"> | |
| <div id="gallery"> | |
| <div class="gallery_list"> | |
| <ul> | |
| <f:for each="{v:content.resources.fal(field: 'settings.images')}" as="image"> | |
| <f:render section="Item" arguments="{_all}" /> | |
| </f:for> | |
| </ul> | |
| </div> | |
| </div> | |
| </f:section> | |
| </div> |