Render lightbox captions using image title field

This commit is contained in:
Björn Fromme
2018-09-26 11:01:01 +02:00
parent 5caf8a9945
commit 06547943ce
@@ -21,9 +21,9 @@
<f:for each="{images}" as="image" iteration="iteration"> <f:for each="{images}" as="image" iteration="iteration">
<f:if condition="{iteration.cycle} <= 5"> <f:if condition="{iteration.cycle} <= 5">
<a href="{f:uri.image(image: image, cropVariant: 'zoom', maxWidth: '2560')}" <a href="{f:uri.image(image: image, cropVariant: 'zoom', maxWidth: '2560')}"
data-fancybox="gallery-{id}" class="slider__thumb"> data-fancybox="gallery-{id}" data-caption="{image.originalResource.title}" class="slider__thumb">
<f:image image="{image}" width="150" height="85c+100" class="img-responsive" <f:image image="{image}" width="150" height="85c+100" class="img-responsive"
alt="{image.alternative}" title="{image.title}"/> alt="{image.originalResource.alternative}" title="{image.originalResource.title}"/>
</a> </a>
</f:if> </f:if>
</f:for> </f:for>
@@ -36,15 +36,17 @@
<f:if condition="{images -> f:count()} == 1"> <f:if condition="{images -> f:count()} == 1">
<f:then> <f:then>
<f:alias map="{image: images.0}"> <f:alias map="{image: images.0}">
<a data-fancybox="gallery-{id}" href="{f:uri.image(image: image, cropVariant: 'zoom', maxWidth: '2560')}" <a href="{f:uri.image(image: image, cropVariant: 'zoom', maxWidth: '2560')}"
data-fancybox="gallery-{id}" data-caption="{image.originalResource.title}"
title="{image.title}">1</a> title="{image.title}">1</a>
</f:alias> </f:alias>
</f:then> </f:then>
<f:else> <f:else>
<f:for each="{images}" as="image" iteration="iteration"> <f:for each="{images}" as="image" iteration="iteration">
<f:if condition="{iteration.cycle} > 5"> <f:if condition="{iteration.cycle} > 5">
<a data-fancybox="gallery-{id}" href="{f:uri.image(image: image, cropVariant: 'zoom', maxWidth: '2560')}" <a href="{f:uri.image(image: image, cropVariant: 'zoom', maxWidth: '2560')}"
title="{image.title}">{iteration.index}</a> data-fancybox="gallery-{id}" data-caption="{image.originalResource.title}"
title="{image.originalResource.title}">{iteration.index}</a>
</f:if> </f:if>
</f:for> </f:for>
</f:else> </f:else>
@@ -52,8 +54,9 @@
</f:then> </f:then>
<f:else> <f:else>
<f:for each="{images}" as="image"> <f:for each="{images}" as="image">
<a data-fancybox="gallery-{id}" href="{f:uri.image(image: image, cropVariant: 'zoom', maxWidth: '2560')}" <a href="{f:uri.image(image: image, cropVariant: 'zoom', maxWidth: '2560')}"
title="{image.title}">{iteration.index}</a> data-fancybox="gallery-{id}" data-caption="{image.originalResource.title}"
title="{image.originalResource.title}">{iteration.index}</a>
</f:for> </f:for>
</f:else> </f:else>
</f:if> </f:if>