With lots of kind help from the forum I have set up the fancybox 3-plugin to work with the kirby CMS in order to create separate sliders for each project I have on my page. The sliders are opened when a thumbnail of the respective project is clicked on the homepage. Here’s a link to the forum entry in which all my previous problems with setting up the slider have been discussed an solved: Loading all images of a project into a Fancybox-slider (but only displaying the first image on the homepage)
I’d now like to modify the slider script a little so that it actually excludes the thumbnail (the first image of the respective project) from the slider. I thought I might be able to do that by still calling the first image of the project to be used as the clickable thumbnail but having a nested foreach-loop that creates the slider-slides from only those images whose name include a certain string. Then I could name the first image differently every time I create a project and hence exclude the thumbnail showing up on the homepage from the actual slider which opens when it is clicked.
I tried to use the filterBy-method in my code, but could only come up with this version which crashes the local server I’m testing the website on:
<div class="project-wrapper"> <div class="flex-grid-thirds"> <?php foreach($projects as $project): ?> <div class="col"> <?php $projectImages = $project->images(); foreach($projectImages as $projectImage): ?> <?php foreach ($projectImages as $projectImage->filterBy('filename', '*=', '-slider')): ?> <a href="<?= $projectImage->url() ?>" data-fancybox="gallery-<?= $projects->indexOf($project) ?>"> <?php endforeach ?> <?php if($projectImage == $projectImages->first()): ?> <img src="<?= $projectImage->url() ?>" alt="Thumbnail for <?= $project->title()->html() ?>" class="" /> <?php endif ?> </a> <?php endforeach ?> </div> <?php endforeach ?> </div> </div>
How can I use the filterBy-method to do what I’m trying to accomplish here?